質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
HTML5

HTML5 (Hyper Text Markup Language、バージョン 5)は、マークアップ言語であるHTMLの第5版です。

PHP

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

Q&A

解決済

3回答

5499閲覧

HTMLの各属性に対する正しいエスケープ方法について教えて下さい。

misak1

総合スコア18

HTML5

HTML5 (Hyper Text Markup Language、バージョン 5)は、マークアップ言語であるHTMLの第5版です。

PHP

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

0グッド

1クリップ

投稿2016/04/19 05:02

###HTMLの各属性に対する正しいエスケープ方法について教えて下さい
正しいエスケープの方法とその辺りの仕様を紹介しているWEBページがありましたら
URLを教えて下さい。

会社の先輩にhref属性にはkey,valueにurlencodeを掛けるだけではダメで更に全体をhtmlspeciarlcharsがあると言われました。

php

1href="<?= htmlspeciarlchars( 'http://hoge.com/fuga/?'.urlencode('key1').'='.urlencode('val1').'&'.urlencode('key2').'='.urlencode('val2') ) ?>"

###発生している問題
value、name、alt、title属性にはhtmlspeciarlchars
href、srcなどURLが入る属性にはurlencode
onclickなどにはaddslashesではダメらしいということ。

###試したこと
WEB制作会社のHP(IMJ,メンバーズ、カヤック)を見てみると代替hrefはhtmlspeciarlcharsされているようでした。

###補足情報
URLエンコード(パーセントエンコード)
HTMLエンコード
など各エンコードの仕様。
XSSに対する問題、回避策など基本的なことは理解しているつもりです。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答3

0

あなたがディレクトリ名、ファイル名に :/?&# 等の予約文字を使用したならURLエスケープ(パーセントエンコード)しなければなりません。
a要素のhref属性値に <>"' を含むならHTMLエスケープしなければなりません。
次のHTMLは不正にhref属性値を閉じます。

HTML

1<a href="http://example.com/"test".html">sample</a> 2<a href='http://example.com/'test'.html'>sample</a> 3<a href=http://example.com/<test>.html>sample</a>

次のHTMLは意図せず、HTML文字実体参照として機能します。

HTML

1<a href="http://example.com/?a=1&amp;=2">sample</a> 2<a href="http://example.com/?a=1&#160;=2">sample</a>

次のHTMLは意図せず、HTML文字実体参照として機能します。
http://d.hatena.ne.jp/think49/touch/20110216/1297852052
https://html.spec.whatwg.org/multipage/syntax.html#named-character-references

HTML

1<a href="http://example.com/?a=1&amp=2">sample</a> 2<a href="http://example.com/?a=1&copy=2">sample</a>

Re: misak1 さん

投稿2016/04/21 04:34

think49

総合スコア18156

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

misak1

2016/04/22 01:26 編集

私の質問が良くなかったのでしょうね。 一番知りたいことはパラメータ区切り文字の&を&amp;としているのは何故かということが知りたいのです。 ```html <a class="next" href="/index?page=2&amp;per_page=10"> ``` 残念ながら、私には、あなたの示してくれたサンプルの示したいことが理解できません。 ```html <a href="http://example.com/?a=1&amp;=2">sample</a> ``` パラメータ1: a=1 パラメータ2: amp;=2
guest

0

「正しいURLをどう書くか」と「正しいHTMLをどう書くか」がごっちゃになってる気がします。
両者は全く別の物で、それを「エスケープ」とひとくくりにしてはいけません。

会社の先輩にhref属性にはkey,valueにurlencodeを掛ける

これは、正しいURLの書き方の話で、

更に全体をhtmlspeciarlcharsがあると言われました。

こっちは、正しいHTMLの書き方の話です。

以下、不正確かも知れません。ごめんなさい。

正しいURLの書き方としては、
クエリー文字列を、「名前=値」の形式で書くなら、(名前と)値は、urlencodeが必要で、名前と値を区切る=や、次の「名前=値」と区切る&は、urlencodeしちゃ駄目です。

正しいHTMLの書き方としては、テキストや属性の場所では、URLであろうがなかろうが、< > & " を書いちゃ駄目で、htmlspecialcharsする必要があります。htmlspecialcharsするときはオプション引数でENT_QUOTESや文字エンコーディングを指定した方が良いです。
正しいURLであれば、「名前=値」を区切る&以外の禁止文字は出てこないはずなので、htmlspecialcharsを呼ばずに、「名前=値」を&amp;で区切るという事でも良いかと思います。

投稿2016/04/19 07:09

otn

総合スコア84421

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

misak1

2016/04/19 07:46

>正しいURLの書き方としては、 >クエリー文字列を、「名前=値」の形式で書くなら、(名前と)値は、urlencodeが必要>で、名前と値を区切る=や、次の「名前=値」と区切る&は、urlencodeしちゃ駄目です。 ここまでは理解できています。 問題はhrefの中の&も&amp;にしないとダメなのかというところです。 &はパラメータの区切り文字で、html表示するわけじゃないので、実体参照する必要もないし、"amp;"という名前か値があったとしてもurlencodeされるから"amp%3B"になって問題にならないような気がします。
otn

2016/04/22 00:06

> html表示するわけじゃないので 表示しようが表示しまいが、HTMLの中に書く時は、&は、&amp; と書きます。 「この属性の時はこれこれの理由で大丈夫」とか「この属性の時は大丈夫じゃない」とかの区別はありません。
guest

0

ベストアンサー

なかなか、正しいエスケープの方法というのを、決めるのは難しいかと思います。

静的パラメータであれば、別にエスケープする必要も無い場合が多いですし、
逆に動的パラメータで、かつ、ユーザが任意入力した値が反映されるのであれば、何らかエスケープをしておかないと、SQLインジェクションなどの原因となります。

よって、どのようなパラメータが渡されるのかによって、その都度、どこまでエスケープしたら安全か、どの方法がよいのか、(htmlspeciarlcharsで明示的に「<」とか「>」を排除とか)考察する必要があるかと思います。

ただ、それ以上に、サーバ側の変数の受けを気をつけるべきだと思います。

どんなに、クライアント側でエスケープをしたところで、結果としてAPI(REST API)側が、受けた引数をそのまま処理してしまっては、APIが何らかでばれた場合(HTMLソースを見られれば分かってしまいます)に、
悪意のあるユーザーが、エスケープ無しで、いろいろなパラメータを投げ込んでくる可能性があります。

その時に正しく、対応できるようにする必要がありますので、
クライアントのエスケープもある程度は気にする必要がありますが、
基本は、サーバ側で、受けた変数をどのようにエスケープをするか、という方が重要な気がします。

もっと言えば、クライアントから、どのような形で引数を受けても、安全に処理が進み、また処理できないと判断されるパラメータならきちんとエラーを戻す、(例えば)さらに不正パラメータと思われたら思い切って404を戻す、などなど。

よって、クライアント側のエスケープは、サーバサイドのAPIの動作と合わせて、最適な方法を模索することが大切かと思います。

論点がずれてしまい、申し訳ございませんが、
ツラツラと書かせて頂きました。

投稿2016/04/19 05:37

ItoTomonori

総合スコア1283

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

misak1

2016/04/19 07:35

回答ありがとうございます。 サーバーサイド側に応じて、処理すればいいと思いますが、正しいエスケープをしないと、サーバー側で処理するのが大変になりそうですね。
misak1

2016/04/23 06:10

正しいエスケープの方法というのを、使う対象に応じてエスケープすべきというのが一番納得できる回答でしたのでベストアンサーとさせていただきました。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問