サーバサイドからクライアントサイドのJavaScriptを呼び出す際のベストプラクティス - kazuhoのメモ置き場

JavaScript文字列のエスケープ – yohgaki's blog に対して、 最近だと id="hoge" data-foo="<% bar %>" しておいて $("#hoge").data('foo') でとりだすのが主流かと思います。 はてなブックマーク - JavaScript文字列のエスケープ – yohgaki's blog のように、 そもそもJavaScriptコードを動的生成すべきでない JavaScriptコードに渡す変数はHTMLノードを経由すべきだ というような反論がついています。 が、はたしてそうでしょうか。 僕には、元の記事の手法も、HTMLノードを経由する手法もあまり好ましくない*1ように思えます。 そもそも、HTML生成時にXSS脆弱性が発生しがちなのは、 タグや静的な文字列と動的に生成される文字列が混在し 埋め込まれる多数の文字列を正しくエスケープ

[kazuhooku]

全面的に書き直した

[yosuke_furukawa]

今やってるプロジェクト、この形式に沿ってないから変えなきゃですね、って言ったら動けばいいんじゃない?、著者から言われたことは内緒。

[rryu]

インラインJSONP方式とは。よく考えてみると、安全にJSONが吐けるなら、普通に変数に入れた方が楽な気がする。

[ozuma]

JSONP XSS

[ledsun]

サーバーサイドのテンプレートエンジン使わないで、サーバからクライアントサイドJavaScriptにjsonデータ渡す方法考えてたら、これになった。

[jshimazu]

サーバーサイドとフロントエンド（javascript）を分離するのはJSONがベスト・プラクティス

[potato777]

"JSONPと同形式の呼出をサーバサイドで生成しSCRIPTタグとして埋め込む、という手法を採るべき"

[lesamoureuses]

これは思う “*1：JavaScriptに渡すべき情報が増えるたびにHTMLテンプレートの修正が必要になるとか”

[tarchan]

htmlにjson埋め込んだら安全にならなくない？

[iR3]

ふむふむ

[k-holy]

静的な値はJSONエンコードしてhiddenにぶっ込んでますが、サーバ側で繰り返し要素出力しつつJavaScriptからもその繰り返してる何かにアクセスしたい時にいつも悩む

[solidstatesociety]

dataでだいたい済んでるなぁいまのところ。

[blue1st]

たまにどうやろうか悩むやつだ！動的生成はあんま良くないとは思うし、HTMLノードを使うのも本質と違う気がするので、楽かどうかはともかくJSONPで渡すのが流れ的には美しい気がする。

[tinsep19]

JavaScript文字列のエスケープ に対して、 最近だと id=”hoge” data-foo=”&lt;% bar %&gt;” しておいて $(”#hoge”).data(’foo’) でとりだすのが主流かと思います。 はてなブックマーク - JavaScript文字列のエスケープ のように、 そも

[auient]

「JSONPと同形式の呼出をサーバサイドで生成しSCRIPTタグとして埋め込む、という手法を採るべき」/ なぜなら：エスケープの手順が簡単、HTMLがキレイ、サーバとクライアントの境界が明確になる

[hirata_yasuyuki]

Browsing: "サーバサイドからクライアントサイドのJavaScriptを呼び出す際のベストプラクティス - kazuhoのメモ置き場"

[mimosafa]

jsonpのこととか、そもそもjavascriptのことはあまりわからないのだけど、なんとなく、なるほど。WordPressのwp_localize_scriptは関数ひとつでこれをやってくれているのですね。という認識でいいのかしら。

[m_shige1979]

サーバから動的に変数などを生成してコードを実行する場合の方法案

[ken_zookie]

タイトルから WebSocket かなにかの話かと勘違いしましたｗ プログラムとデータの分離ということなら、script type="application/json" で ID を付けてコード側で pull すべきでは？

[coppieee]

大量のデータを埋め込むならありだな。1、2個程度ならdata-*の方法で十分。てか、JSONをそのままdata-*にぶっ込めば全部解決する？

[kotas]

data-* 手法が優れているのは、テンプレートエンジンの自動HTMLエスケープ機構だけで（初心者含め）意識せずに安全が得られる点だと思う。JSON 埋め込み方式だと追加のエスケープが必要となるため忘れうる。

[nemoba]

勘違いしてるなら申し訳ないが、JSONPで分割して通信しちゃうなら、JSON-API作ってAJAXやれば、危険なJSONPライクな独自手法に走らなくても、ぜんぜん安全にいける方法が確立されてるような。。。/通信なしか

[tokuhirom]

個人的にはやっぱり data-* にうめこむ方で今後もいくかなあ、とおもうところ。

[takezaki]

僕はJSONPを安全に使える自信がない