web-dev-qa-db-ja.com

Safari-Web Inspector Networkタブ-リソースをロードしようとしてエラーが発生しました

XHR/FetchのSafariの開発者ツール（[ネットワーク]タブ）で、下の画像にエラーが表示されています。応答本文は表示されません。常に赤いテキスト「リソースのロード中にエラーが発生しました」がスローされます。私の最初の考えは、XHRとは対照的に、開発ツールはフェッチをサポートしないだろうということでした。ただし、Safari 12はサポートしています。

example

OS：MacOS High Sierraブラウザー：Safari 12およびテクノロジープレビュー66

これは、応答ヘッダーと関係がありますか？ XSSまたは他の何か？ PS：同じ応答本文がchrome devツールに表示されます。

javascriptsafaridevtoolssafari-web-inspector
16
Ramesh

プレビューのあるメニューバーの右側には、responseがあり、その横にある矢印をクリックして、JSONに切り替えます。

2
Yehuda Schwartz

ブラウザのエラーメッセージには、このリクエストが正常に完了するための要件が​​記載されています。

サーバーは、Access-Control-Allow-Origin応答ヘッダーを送信して、要求されたリソースへのアクセスをリモートドメインに許可する必要があります。

Safari 12では、[ネットワーク]タブで行を選択します。応答はメイン領域に表示されます。その上にいくつかのタブがあります。 [ヘッダー]タブを選択し、表示されるデータのリクエスト部分でリクエスト情報を確認します。リクエストデータの詳細については、「リクエストデータ」をご覧ください。該当する場合は、そこに小さな矢印が表示されます。この矢印を押すと、リクエストの全コンテンツが表示されます。

1
UnP

世界はfetch()の準備ができていません。

これを解決するために、私は簡単にfetch()から axios に変換しました。

  • bodyがdataになりました
  • jsonは自動的にデコードされます
  • credentialsがwithCredentialsになりました

応答がokであったかどうかを判断するために、この関数も追加しました。

function ok(resp) {
  return resp && resp.status && resp.status >= 200 && resp.status < 400
}

私の場合、これで調整する必要がありました。

0
jchook