JSONの受取
WebAPIを利用してJSON形式のデータを受け取り、ブラウザ上に表示する処理を作っている最中です。
その実装の中で、
「WebAPIを呼び出すのは基本ブラウザのJavaScript側？それともサーバー側のPHPとかでも呼んで良いの？」
という基本的な使い分けが分からず、Web開発者の方々のアドバイスを頂いて切り分けたのが昨日の記事。
やはりブラウザ上でWebAPIから取得したデータを表示するだけなら、ブラウザのJavaScript側で実装するのがスマートで良いそうです(^-^)v
ただ特段、ユーザーにデータ表示をさせたりしない用途であればサーバー側で実装してもＯＫとのこと。
まぁ待っている人がユーザーじゃなくて自分（開発者）とかであれば、時間が掛かってもまぁ問題ないですからねぇ。
と、言う訳で昨日はWebAPIを呼び出してJSON形式で返してくれる物で、以前からデータが欲しかったのに「JSON形式を扱えない」という理由で取得出来なかったデータがあったので、それを取得してCSVにしてダウンロードするツール（？）みたいな物を作りました(^-^)v
いやぁ、前からJSON形式受け取れなくて
「くっそー、これさえ受け取れれば・・・」
と思っていたので、ようやくJSON形式データを受け取れる様になって良かったです(^-^)v
しかもPHPのファイル1個でサクッと作るだけでデータを引っこ抜けるので、もの凄い楽！
当初はWindowsアプリとして作る予定だったので、もの凄く工数が節約できて良かったです♪
あ、ツール作りに時間を割いたのでWebサイト向けのJavaScriptでの組み直しはまだやってません。
来週やります(^o^;
更なるアドバイス
で、昨日の記事にさらにアドバイスを頂きましたのでご紹介させて頂きます(^-^)/
私も疑問に思っていたJSONPについてのお話です。
id:treeappsさん
apiを使う側の人はjsで、apiでjsonpを返す側の人はphp等のサーバ側でやりますね。
ふむふむ。
API使う側はJavaScriptで呼び出す、と。
APIでJSONPを返す側の人は、サーバー側（PHP等）で実行する、と。
「API使う側はJavaScriptで呼び出す」というのは正に昨日の私の記事の話ですね(^^)v
ただ次の「APIでJSONPを返す側の人」って言うのはどういう人なんでしょうか？
WebAPIの提供者側という事で良いんでしょうかね？
WebAPIの提供者側はサーバー側で処理して返して良い、と。
ウムム。
なんだか難しい話になってきた気がします(-_-;
私自身はWebAPIの提供者側にまではなろうとは思っていませんが、もしかしたら自分自身のWebサイトのサービスの一環として非同期処理でやろうとした時に、自分のサービス向けにAPI的な動きが要求される場合があるんですかね？
この辺までまだ入り組んだ物を作ろうとした事がないので、ちょっと見渡せません(;_;)
id:treeappsさん
jsでjsonpを扱うと、他のjs等の処理とは別に非同期で処理を行えます。するとjsonpの処理が遅くても他処理に影響を与えないため高速になります
コメント後半。
JavaScriptでJSONPを扱うと、他のJavaScriptの処理とは別に非同期で処理を行える、と。
JSONPが非同期なので処理が遅くても、他処理（基本的なHTMLの表示等）に影響を与えないため高速になる、と。
という事は、JavaScriptでも普通にJSONを呼んだだけだと同期処理になってしまって、他のJavaScriptの処理の遅延の原因にもなりえると！
アギャポー（＠＿＠）
てっきり普通にJavaScriptでJSON呼べば良いものと思っていました(^O^;
これは落とし穴でした。
JSONPにしないと非同期処理にならないんですね(^^;
全然知りませんでした。
教えて頂き、ありがとうございました<(_ _)>
JSONPってなあに？
でわ先ほどから登場しているJSONP（ジェイソンピー）って何でしょうか？
確かにWebAPIの説明を呼んでいると「JSON」と「JSONP」の両方が出て来ていました。
特段気にしていなかったのですが、大きな違いがあるのでしょうか？
ちょっと調べてみると・・・
JSONPとは
JSON with paddingの略
Javascriptの非同期通信でよく使われるXMLHttpRequestオブジェクトにはSame-Originポリシーが存在し、クロスドメインアクセスができない。
一方，scriptタグを用いると，ドメインの異なるサーバに置いているスクリプトファイルを読み込むことができる。
この仕組みを利用し、scriptタグのsrcに、データを取得できるAPIのURLを指定し，ドメインの異なるサーバからデータを取得する仕組みの総称として、JSOPという言葉が使われる。
JSONP用のAPIでは、関数名＋取得データをjson形式で表記して引数とした形式(例.callbackFunc({id:1000,name:aaa}))のレスポンスが一般的で、APIから返されるコールバック関数と同じ名前の関数(callbackFunc(jsonData))をクライアント側で定義しておけば、データを読み込んだ際にそのコールバック関数が実行される。
動的にscriptのDOMを生成することで、非同期でデータが取得できるようになる。
ただし、Same-Originポリシーが存在しないため、機密情報をAPIに含める際には十分な注意が必要である。
ふむふむ。
JavaScriptで別ドメインのサーバーのスクリプトを読み込む（クロスドメインアクセス）ために利用されるのが、JSONPだと。
コールバック関数を定義しておいて、非同期でデータを読み込んだ後にコールバック関数が実行される、と。
ただしJSONPに機密情報を受け渡すのは危険だよ、と。
確かにXML形式の受け渡しだとクロスドメインアクセスに引っかかって取れない、とかって話を聞いた事がありますね（直面したことはない）。
JSONPを使うと、別サーバーのWebAPIを普通に呼びだして使う事が出来るのは便利そうですね(^-^)v
というか別サーバーのWebAPIを呼びだせないんじゃ、使い勝手が悪過ぎる気はしますが、昔は出来なかったのかな？
コールバック関数は非同期処理の戻ってきたのを受け取るのに必要な関数なんですね！
引数で渡した関数名がコールバック関数として呼び出される、と。
これ間違うと処理が返って来ても何も動かなくて困るんでしょうねぇ(^-^;
もうちょっと掘ってみる
昨日調べていたら、分かりやすい話も。
JSONPって、クロスドメインでデータをとってこれて、Web APIとかはこれで実装されているんでしょ。
まず、勘違いしやすいのは（というより私が勘違いしていたのは）、JSONPを「JSON『テキスト』に毛が生えたもの」、と思ってしまうこと。
断言しましょう！JSONPはテキストではなく「script」です！
これらの特徴を生かしてデータをクロスドメインから受け取る手法がJSONPです。
事前にこちらのスクリプトで、コールバック関数を用意しておき、
そのコールバック関数と同名の関数の引数にJSONをつっこんだ（Padding）したスクリプトを返すようクロスドメインのサーバーに要求し、
動的にそのスクリプトを読み込んだ瞬間にこちらのコールバック関数が引数にJSONをつっこんだ状態で呼び出される。
そのコールバック関数内でJSONのデータを使って好きな処理をしてあげれば一丁上がり！
私も調べる前は
「JSONPってJSONに何か足しただけの文字列形式なんでしょ！」
程度に思っていました(^o^;
違うんですね(-_-;
JSONPはテキストではなくてスクリプトだ、と。
へぇー。
クロスドメインのサーバーにJSONをつっこんだスクリプトを返すように要求して、戻ってきたらすかさずコールバック関数を呼んでくれる、と。
コールバック関数に戻ってくる時にはJSONデータが入っているので、それを好きなようにいじくってあげればＯＫ、と。
なるほど、なるほど。
JSONとは基本的な書き方（呼び方）が全然違う、別物なんですねJSONPって。
ただ単にPが付いている様な気がしましたが、JSONとは別物、それがJSONPと。
と、言う事は今回私はJSONを呼び出せる様になりましたけど、JSONPはまだ呼びだした事がないので、もう少し違う書き方で呼んであげなければいけない、と。
WebサイトでWebAPIをJSONPで非同期で呼んで表示の早いサイトを作る道のりはまだまだ遠い・・・(-_-;
