[解決済み] JSONPの解析 $http.jsonp() レスポンスをangular.jsで解析する
質問
私はangularの
$http.jsonp()
リクエストを使っていますが、これは関数にラップされたjsonを正常に返しています。
var url = "http://public-api.wordpress.com/rest/v1/sites/wtmpeachtest.wordpress.com/posts?callback=jsonp_callback";
$http.jsonp(url).
success(function(data, status, headers, config) {
//what do I do here?
}).
error(function(data, status, headers, config) {
$scope.error = true;
});
返されたfunction-wrapped-JSONにアクセス/パースするにはどうすればよいですか?
どのように解決するのですか?
UPDATE: Angular 1.6から。
JSON_CALLBACK文字列をプレースホルダーとして使用することはできなくなりました。 をプレースホルダとして使用することはできなくなりました。
このようにコールバックを定義する必要があります。
$http.jsonp('some/trusted/url', {jsonpCallbackParam: 'callback'})
パラメータを変更/アクセス/宣言するために
$http.defaults.jsonpCallbackParam
デフォルトは
callback
注意:あなたのURLがtrusted/whitelistに追加されていることも確認する必要があります。
$sceDelegateProvider.resourceUrlWhitelist
を経由して、または明示的に信頼される。
$sce.trustAsResourceUrl(url)
success/error
でした。
廃止予定
.
は
$http
レガシーなプロミスメソッドsuccess
そしてerror
は非推奨とされ、v1.6.0 で削除される予定です。代わりに標準のthenメソッドを使用してください。もし$httpProvider.useLegacyPromiseExtensions
に設定されている場合はfalse
に設定されている場合、これらのメソッドは$http/legacy error
.
USEです。
var url = "http://public-api.wordpress.com/rest/v1/sites/wtmpeachtest.wordpress.com/posts"
var trustedUrl = $sce.trustAsResourceUrl(url);
$http.jsonp(trustedUrl, {jsonpCallbackParam: 'callback'})
.then(function(data){
console.log(data.found);
});
前回の回答 Angular 1.5.x以前
あなたがしなければならないことは、変更することです
callback=jsonp_callback
を
callback=JSON_CALLBACK
のように
var url = "http://public-api.wordpress.com/rest/v1/sites/wtmpeachtest.wordpress.com/posts?callback=JSON_CALLBACK";
そして、あなたの
.success
関数は、リターンが成功した場合、あなたが持っているように発火するはずです。
この方法で行うことで、グローバル空間を汚さずに済みます。これはAngularJSのドキュメントに記載されています。 ここで .
Matt Ball氏のフィドルを更新し、このメソッドを使用するようにしました。 http://jsfiddle.net/subhaze/a4Rc2/114/
完全な例です。
var url = "http://public-api.wordpress.com/rest/v1/sites/wtmpeachtest.wordpress.com/posts?callback=JSON_CALLBACK";
$http.jsonp(url)
.success(function(data){
console.log(data.found);
});
関連
-
[解決済み] JSONとJSONPの違いは何ですか?
-
[解決済み] JSONPとは何か、なぜ作られたのか?
-
[解決済み] javascriptで2つの数値を連結する方法は?
-
[解決済み] 文字列のn番目の出現箇所を取得するには?
-
[解決済み] TypeScriptのdeclare classとinterfaceの違いとは?
-
[解決済み] React js 親コンポーネントから子コンポーネントの状態を変更する
-
[解決済み] JavaScriptのtoString()関数をオーバーライドして、デバッグ用に意味のある出力を提供することは可能でしょうか?
-
[解決済み] JavaScriptでjson-objectのキーを取得する [重複].
-
[解決済み] イテレータでmap()を使用する
-
[解決済み] 文字列とラベルのローカライズとグローバリゼーションのベストプラクティス【終了しました
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] AngularJSのエラーです。Cross Origin リクエストはプロトコルスキーム http, data, chrome-extension, https に対してのみサポートされています。
-
[解決済み] node.jsで文字列のsha1ハッシュを取得するにはどうすればよいですか?
-
[解決済み] 文字列がhtmlであるかどうかをチェックする
-
[解決済み] Reactコンポーネントでthis.setStateを複数回使用するとどうなりますか?
-
[解決済み] Javascript 空の配列の削減
-
[解決済み] サブドメインにまたがってlocalStorageを使用する
-
[解決済み] BlobからArrayBufferへ移行する方法
-
[解決済み] Promise : then vs then + catch [重複].
-
[解決済み] なぜjavascriptのES6 Promisesはresolve後も実行を継続するのですか?
-
[解決済み] これは純関数ですか?