async/fetchとの組み合わせでは動作しません。

私はES7 async/awaitと一緒にfetchを使用しようとしています。私は近くにいるが、私はそれを働かせることができないことを知っている。ここでは、コードは次のようになります。async/fetchとの組み合わせでは動作しません。

次のように私が使用

class Bar { 
    async load() { 
     let url = 'https://finance.yahoo.com/webservice/v1/symbols/goog/quote?format=json'; 
     try { 
      response = await fetch(url); 
      return response.responseText; 
     } catch (e) { 
      return e.message; 
     } 
    } 
}

：

let bar = new Bar(); 
bar.load().then(function (val) { 
    console.log(val); 
});

DEMO

私は常にメッセージどれ

response is not defined

でcatchに入るいくつかの理由私が間違っていることを示唆している？

UPDATE：コメントで示唆したように、それはfetchと問題になる可能性がありますので、私は単純化（ES5）バージョン試してみました：

<!doctype html> 

<html> 
    <head>  
     <script> 
      var url = 'https://finance.yahoo.com/webservice/v1/symbols/goog/quote?format=json'; 
      fetch(url, {method: 'get', mode: 'cors'}).then(function (response) { 
         console.log(response.responseText); 
       }); 
     </script> 
    <head> 

    <body></body> 
<html>

をそして、私は交換した場合、まだ、しかし:(機能しません。クラスコードは常に厳格なコードである

var request = new XMLHttpRequest(); 
request.open("GET", url, false); 
request.send(null); 
console.log(request.responseText);

出典

2015-09-28 Jeanluca Scaljeri

私はあなたが間違ってフェッチ使用していると思う - フェッチが、これは間違っているものをhttps://developer.mozilla.org/en-US/docs/Web/API/Fetch_API –

まだわからない場合。私は '{method： 'get'}'を 'fetch'呼び出しに追加しようとしましたが、うまくいきませんでした。 –

CORSの問題に遭遇しているようにも見えます –

あなたが変数としてresponseを宣言するのを忘れて、あなたはimplictly global variablesに代入して逃げることはありませんその代わり、それはReferenceErrorスロー

：フェッチそれが動作します。

それ以外では、ResponseオブジェクトはXHRのようなresponseTextプロパティを持たず、.text()メソッドを持ち、ボディが受信されるのを待って約束を返します。

class Bar { 
    async load() { 
     let url = 'https://finance.yahoo.com/webservice/v1/symbols/goog/quote?format=json'; 
     try { 
      let response = await fetch(url); 
//   ^^^^ 
      return await response.text(); 
//        ^^^^^^ 
     } catch (e) { 
      return e.message; 
     } 
    } 
}

出典

2015-09-28 13:18:30 Bergi

ありがとう、ありがとうございます。第二の「待っている」理由はありますか？それがなければ、最初の 'await'がすでにフェッチの約束を解決しているので、コードも機能します。 –

2番目の約束を待つことは、その中のエラーがあなたの試合に投げ込まれ、返された約束を拒否するためにすぐに伝播されないことを意味します。違いはあまりありません。もしtry-catchがそこになければ、ソリューションの有無はまったく同じでなければなりません。 – Bergi

yahoo.comからの返信がCORSを許可せず、元のコードコードをこのコードに置き換えても機能しないので、これがなぜ機能するのか、非常に興味があります。 –

async/fetchとの組み合わせでは動作しません。

答えて

関連する問題