番号記号/ハッシュ記号（＃）はコードを破ります

Question

誰かが、eventbriteからイベントデータを取り出し、SVGに書き込んで、Amazon Webサービスを使用し、それをPDFとして保存してチラシを作成するWebページを作成しました。

ここで動作します：www.ilovemylaser.com/fliers.html。

しかし、私がアドレス行に '＃'を使用すると、それは壊れてしまうので、サンディエゴ以降のものでは '＃'を 'No'に置き換えました。

www.admaticonsulting.com/resources/fliers2.htmlを見ると、私は '＃2'を使用しました。フライヤーをクリックすると、都市、会場名、時間、州、およびジップがないことがわかります。それを最初のリンクからのThousand Oaksフライヤーと比較してください。

この行はコードであり、そして私はそれが問題だかなり確信している：

var output = "<p><a href=\"h t t p ://ec2-52-42-194-56.us-west-2.compute.amazonaws. com/task.php?date=" + date + "&staddress=" + venue + "&venue=" + ven3 + "&city=" + city + "&region=" + region + "&postal_code=" + postal_code +"&time="+ time + "\">" + date + " - " + city + "</a><br></p>"; 

は、今私は2つの以上のリンクを投稿することはできませんが、あなたはどのチラシのリンクをクリックした場合、あなたはよ1つのリンクを表示してから別のリンクを表示することを確認してください。

＃がこれに影響していることを確かめてください。また、「＃」を持つものの「解決されたリンク」にはスペースがあります。

フライヤーに＃がなく、データが欠けていないのはどうすればいいですか？

Answer 1

URLの＃は、ブラウザまたは他のクライアントによってローカルに処理されるFragment Identifierから始まります。サーバーに送信されたHTTP要求には含まれていないため、サーバー上での処理には使用できません。To include a 'reserved' character as data in a URL you must encode it。リンクはhttps://en.wikipedia.org/wiki/Percent-encoding#Percent-encoding_reserved_charactersで、サーバーから取得したページはhttps://en.wikipedia.org/wiki/Percent-encodingで、ブラウザはアンカータグの位置がPercent-encoding_reserved_charactersであることに注意してください。

Answer 2

あなたは、各クエリ文字列値をエンコードするためにencodeURIComponentを使用する必要があります。

var output = "<p><a href=\"h t t p ://ec2-52-42-194-56.us-west-2.compute.amazonaws. com/task.php?date=" + encodeURIComponent(date) + "&staddress=" + encodeURIComponent(venue) + "&venue=" + encodeURIComponent(ven3) + "&city=" + encodeURIComponent(city) + "&region=" + encodeURIComponent(region) + "&postal_code=" + encodeURIComponent(postal_code) +"&time="+ encodeURIComponent(time) + "\">" + date + " - " + city + "</a><br></p>";