• 締切済み

javascriptに外部のJSONPを読み込む

外部のサーバーにあるJSON形式のファイルをjavascriptで読み込み値を取得したいのですが、どうすればいでしょうか? JSONはWebAPIで呼び出します。 http://hoge.com/hoge/というURLのJSONファイルをコールバックして、それをjavascriptで読み込みJSONPデータの値を変数として使いうという感じです。 以下のサイトを参考にしたのですが、うまくできません。 http://techblog.yahoo.co.jp/javascript/jsonpjavascript/ 最近javascriptを勉強し始めた素人なので、用語の使い方が間違っているかもしれませんが、具体的なサンプルを書いていただけると幸いです。

みんなの回答

  • fujillin
  • ベストアンサー率61% (1594/2576)
回答No.1

>具体的なサンプルを書いていただけると幸いです。 ご提示のサイトが、求めておられる『具体的なサンプル』そのものだと思いますが…? サンプルだけでなく解説も付いているようですが…? >以下のサイトを参考にしたのですが、うまくできません。 何がどううまく出来ないかを書いて質問なさらないと、回答がつかないかと思いますよ。 (回答しようがないので)

全文を見る
すると、全ての回答が全文表示されます。

関連するQ&A

  • javascript外部ファイルから読み込み

    JavaScriptで変数の値を外部ファイルに記載しておきたいのですが 読み込み方などがわかりません。 if(aaa=bbbb) { } bbbbの値を外部の read.txt に記載しておきたいです。

  • JSONPのセキュリティについて質問させて下さい。

    JSONPのセキュリティについて質問させて下さい。 JSONPにはCSRFのセキュリティリスクがあるとされています。 その解説として下記のWebサイトがありました。 http://gihyo.jp/dev/serial/01/web20sec/0003?page=2 この中に、 「クエリストリングに推測不可能な文字列を含めておき, JSONPファイルを読み出す場合にその値を用いて認証を行うようにします。 すると攻撃者はJSONPファイルのURLがわからなくなるため, 図2のように被害者に気づかれないようにリクエストを発生させる攻撃を防ぐことができます。」 とあります。 ただ、ここでいう、認証を行う、というの具体的にどういうことなのかがわかりません。 何をどう認証する仕組みを作ればいいのかがよくわかりません。 というか、そもそもこの認証になんの意味があるのかが不明です。 具体的には、 クライアントがJSONPを返すホスト(上記ウェブサイトでいう(h)ttp://mail.example.com/json.dat) に対して何らかのリクエストを発行した場合、リクエスト内容である そのクエリストリングに推測不可能な文字列を付与する、ということかと思うのですが、 それでどうやって、そのリクエストが不正なアクセスかどうか、を識別することができるのでしょうか? 推測不可能な文字列の付与は、おそらく被害者ユーザーのブラウザ(クライアント)から、 JSONPを返すのホストにへリクエストに対して行われることとなると思います。 ただ、そのリクエストに文字列を付与したところで、そのリクエストが 攻撃的意図で発行されているのか普通に発行されているのか、 は識別出来ないはないかと思い、困っています。。。 どなたかご回答くだされば幸甚です。

  • PHPからJavaScriptの指定形式へ変更

    PHPからJavaScriptの下記形式へ変更したいのですが、これは何と言う形式なのでしょうか? ・json? ・それともJavascriptオブジェクト? ■変更したいavaScript形式 [  ['hoge', 4.3],  ['piyo', 5.6] ], ■変更元のPHPデータ Array (  [0] => 'hoge',4.3  [1] => 'piyo',5.6 )

  • Jsonpのコールバック関数に内に引数を渡すには?

    APIで返されたJsonpコールバック関数に引数を渡したいのですが、やり方が判りません。 それともそもそも、間違っていて 1.引数を渡さない 2.コールバック関数内のデータを一旦変数にいれてコールバック関数内から取り出す。 3. 2で取り出したコールバック関数内のデータと1で渡そうとしていた引数を使う。 とやったほうがいいのでしょうか。 当方経験が浅いためよくわかっていません。基本的な間違いの可能性が高いと思います。 識者の方ご教授下さい。お願いします。 function start(){ var str = "渡したい引数"; var param = new Object(); param.keyword = '東京'; param.inputcharset = 'utf8'; param.outputcharset = 'utf8'; param.format = 'jsonp'; param.callback = 'jsonp4travelAPI'; var url = 'http://api.4travel.jp/Ver1/SearchAlbum.php?'+obj2query( param ); // script 要素の発行//ここでAPIへリクエストを送る。 var script = document.createElement( 'script' ); script.type = 'text/javascript'; script.src = url; document.body.appendChild( script ); } // 4travel検索終了後のコールバック関数 function jsonp4travelAPI ( data ) { // データが取得できているかチェック // //ここに渡したい引数も持ってきたい。でも str is not definedになります。 alert(str); } // オブジェクトからクエリー文字列を生成する関数 function obj2query ( obj ) { var list = []; for( var key in obj ) { var k = encodeURIComponent(key); var v = encodeURIComponent(obj[key]); list[list.length] = k+'='+v; } var query = list.join( '&' ); return query; } window.onload =start;

  • JSONPを処理するにはどうすればいいですか?

    http://www.baldanders.info/spiegel/remark/archives/000222.shtml このページの下部のサンプルスクリプトを function getjsonp(url){ で囲ってurlを渡してJSONPデータを処理しようとしたのですが、 hundler is not defined とエラーが出てしまいます。 サンプルスクリプトのそのままのコードでは動くのです。 オブジェクト指向がよくわかっていないのでどうすればいいか、識者の方教えてください。 宜しくお願いします。 下記がエラーするスクリプトです。 <script type="text/javascript" src="/js/jsr_class.js"></script> <div id="bookmark"></div> <script type="text/javascript"> var url ='http://del.icio.us/feeds/json/spiegel?callback=hundler'; getjsonp(url); function getjsonp(url){ var oJsr = new JSONscriptRequest(url); oJsr.buildScriptTag(); oJsr.addScriptTag(); function hundler(data) { var ul = document.createElement('ul'); for (var i=0, post; post = data[i]; i++) { var li = document.createElement('li'); var a = document.createElement('a'); a.setAttribute('href', post.u); a.appendChild(document.createTextNode(post.d)); li.appendChild(a); ul.appendChild(li); } document.getElementById('bookmark').appendChild(ul); oJsr.removeScriptTag(); } } </script>

  • 外部javascriptファイルをjavascriptから動的に呼び出したい

    呼び出し元のURLによって動作を変えたいJAVASCRIPTがあります。 普段外部のJAVASCRIPTを呼び出すときはよくこうするのですが <script type="text/javascript" src="js.php?key=url"></script> これでは「key=url」が固定になってしまいます。そこで下記のように <script> var commentname=document.URL; var str=encodeURIComponent(commentname); document.write('<script type="text/javascript" src="read.php?key=',str,'"><\/script>'); </script> document.writeを使って無理やり外部Javascriptファイルの呼び出しスクリプトを書いているのですが、この書き方はどうもエレガントさにかけるというか、いまいち気に入りません。 もっとほかに良い方法がある気がするのですが、調べてもわかりませんでした。おわかりになる方がいらっしゃったらご教示頂けないでしょうか。

  • Perl HTML JavaScript

    ソースコードについて <input type="hidden" id="hoge" name="hoge" value="$hensu"> このコードのvalueの値(変数)をソースから見て   見えなくさせたい(認識できなくさせたい) おそらく完全に見えなくするのは不可能と思うのですが、 valueの値をソースで見えにくくする、認識できなくする方法は ないでしょうか? 完全に見えなくできるならそれが1番いいです^^; valueの値だけjsの外部ファイルにするとかですか? その方法ですと、Valueの値はPerlでの変数なのですが、 そのようなことも可能でしょうか?

    • ベストアンサー
    • Perl
  • JavaScriptからJavaScriptを呼ぶ方法?

    あるJavaScriptのファイルでで変数に値を代入します。 他の複数のJavaScriptのファイルで、その変数を使用したいと思います。 JavaScript{     JavaScript{     }     処理・・・・ } という形になるのでしょうか。 このように、他のJavaScriptから変数を呼び出したいのです。 どのように記述したら良いでしょうか?

  • javascript の外部ファイルの読み込み

    *OKWaveで初めて質問します、よろしくおねがいします。 *外国人ですので間違えた日本語ありましたらお許し下さい。 ---------------------------- hoge.txt の内容が一秒毎に変わります。 ここでjavascript の外部ファイルの読み込みと document.write()を使って 一秒毎にhoge.txt の内容をブラウザで表示したいのです。 可能でしょうか? よろしくおねがいします。

  • javascript php 連携

    よろしくお願いします。 javascriptの『onchange』値をPHPの変数に入れたいと苦戦しています。 <html> <head> <script type="text/javascript"> function hoge1(){ var x = $('str1').options[$('str1').selectedIndex].text; やりたいことはここでPHPの変数『list_a』にjavascriptの変数『x』の値を入れたいです。 } </script> </head> <body> ここに結果表示 <?= $list_a; ?> <select id="str1" name="str1" onchange="hoge1()"> <option>hoge1</option> <option>hoge2</option> <option>hoge3</option> </select> </body> </html> よろしくお願いいたします。 ちなみにAjaxは全くわかりませんのですいません。。。

    • ベストアンサー
    • PHP