JSONP смотреть онлайн

JSONP, by Wikipedia https://ja.wikipedia.org/wiki?curid=2008427 / CC BY SA 3.0

#ウェブ技術
#JavaScript
#JSON
#ソフトウェアアーキテクチャ
JSONP (JSON with padding) とは、scriptタグを使用してクロスドメインな（異なるドメインに存在する）データを取得する仕組みのことである。
HTMLのscriptタグ、JavaScript（関数）、JSONを組み合わせて実現される。
クロスドメインな通信を実現する方法としては、後にオリジン間リソース共有 (CORS)も開発され、JSON-Pに代わる選択肢となっている。
ウェブブラウザなどに実装されている「同一生成元ポリシー」という制約により、ウェブページは通常、自分を生成したドメイン以外のドメインのサーバと通信することはできない。
しかし、HTMLのscriptタグのsrc属性には別ドメインのURLを指定して通信することができるという点を利用することによって別ドメインのサーバからデータを取得することが可能になる。
JSONPでは、通常、上記src属性のレスポンスの内容はjavascript関数呼び出しの形式となるため、src属性に指定するURLにその関数の名前をクエリ文字列の形式で付加する。
一般的な方法では、この時に指定する関数名はウェブページ側ですでに定義されているコールバック用の関数の名前になる。
関数名を渡すリクエストパラメータの名前はサーバとクライアント間で事前に取り決めておく必要がある。
例えば（callbackというパラメータ名でparseResponseという関数名を渡す場合） 「script type='text/javascript'
src='http://another.domain.example.com/getjson?callback=parseResponse'」
通常は、上記リクエストのレスポンスとして、JSON形式のデータを引数とする関数の呼び出し文が返される。
この関数の呼び出し文がブラウザにより解釈・実行されることで、データの受信完了の検知とコールバック処理が可能になっている。
上記の例では、parseResponseという関数の呼び出し文が返される。
parseResponse({"Name":"Smith","Rank":7})
JSONPでは、クロスサイトリクエストフォージェリ（英: cross-site request forgery、CSRF）に対する脆弱性に注意が必要である。
このscriptタグを使う方法では同一生成元ポリシーが適用されず、またサーバのエンドポイントは外部に公開されているため、悪意のあるサイトがJSONデータを取得するといったことが可能であることから、機密情報や個人情報などのデータを取り扱うには不向きである。
また、scriptタグを埋め込む側においても、リモートサイトから任意の内容のデータをページに差し込むことが可能であるため、そのリモートサイトが悪意のあるサイトである場合やJavaScriptインジェクションに対する脆弱性がある場合は、その脆弱性を突かれることで、アカウント情報を盗まれたり、元のサイトも影響を受けたりする可能性がある。
データを提供するサーバ側では、リクエストの正当性を検証するのが適切である。
但し、Cookieだけを使用した検証は、CSRFに対して脆弱であるため、不十分である。
Dojo Toolkit、Google Web ToolkitなどのライブラリでJSONPがサポートされている。