web-dev-qa-db-ja.com

fetchがstatus = 0の応答を返すのはなぜですか？

フェッチAPIを使用して、URLからHTMLドキュメント全体を取得したいと考えています。

let config = {
method: 'GET',
headers: {
    'Content-Type': 'application/json',
    'Accept': 'text/html',
    'Accept-Language': 'zh-CN',
    'Cache-Control': 'no-cache'
},
mode: 'no-cors'};

fetch('http://www.baidu.com', config).then((res)=> {
console.log(res);}).then((text)=> {});

コードをChromeで実行すると、リクエストがトリガーされ、chromeネットワークタブにhtmlが返されますが、フェッチの結果は返されます。

enter image description here

ステータスが0である理由と、chromeネットワークの場合のように、正しい解像度を取得するにはどうすればよいですか？

javascriptajaxfrontend
17
pingfengafei

no-corsconfig.modeの一部：

no-cors —メソッドがHEAD、GET、またはPOST以外にならないようにします。 ServiceWorkersがこれらのリクエストをインターセプトした場合、これら以外のヘッダーを追加またはオーバーライドすることはできません。さらに、JavaScriptは結果のレスポンスのプロパティにアクセスできません。これにより、ServiceWorkersがWebのセマンティクスに影響を与えず、ドメイン間でデータが漏洩することによって発生するセキュリティとプライバシーの問題が防止されます。

事実上、このような要求を行うことから得られる応答（モードとしてno-corsを指定）には、要求が成功したか失敗したかに関する情報が含まれず、ステータスコードが0になります。modeをfetch呼び出しは、CORSが実際に失敗したことを示します。

特定のケースで0が何を意味するかを確認するには、他のSO回答を参照してください。

15
Brian

ブラウザ環境でこれを行う方法はわかりませんが、Nodeのクロスオリジンサイトから何かをfetchで利用できることは知っています。

require('es6-promise').polyfill();
require('isomorphic-fetch');
fetch('https://www.baidu.com', {
  mode: 'no-cors'
})
  .then((res) => {
    console.log(res.status); //=> 200
  });

したがって、Node server to fetch to your what and then respond to your clientを使用できます。

また、ブラウザ内の一部のサイトからのfetchも実現したいと考えていますが、これは不可能のようです。多分それは本当にこれを行うことは不可能です。なぜならインターネットは私たちがリソースを取得したいウェブサイトを保護する必要があるからです。

0
enzeberg