2016-07-01 4 views
2

Reactネイティブコンポーネントで、OMDB APIにパラメータを渡す単純なフェッチであるコードを使用しています。これはCORSの問題である可能性があります。なぜなら、omdbapi.comに直接行くという形式で実行すると、Network Request Failedで常に失敗するからです。しかし、この要求は、同じネットワーク上のAndroidエミュレータで機能します。しかし、私はlocalhostのリクエストにリモート要求をラップ地元のURLにアクセスして同じコードを実行した場合ネイティブネットワーク要求に反してフェッチに失敗しました - Works Local

// The fetchData function makes an AJAX call to the OMDB API. 
    fetchData(movieinput) { 
    console.log("In fetch"); 
     // We pass the movie the user entered in into the URL for the API call. 
     fetch('http://www.omdbapi.com/?t='+movieinput+'&y=&plot=short&r=json') 
      .then((response) => response.json()) 
      .then((responseData) => { 
       // After the data is recieved, we set this.state.movie to the result of the API call. 
       this.setState({ 
        movie: responseData, 
       }); 
      }) 
      .done(); 
    } 

は、それが正常に動作します。

fetchData(movieinput) { 
    console.log("In fetch"); 
     // We pass the movie the user entered in into the URL for the API call. 
     fetch('http://localhost:3000/movie/'+movieinput) 
      .then((response) => response.json()) 
      .then((responseData) => { 
       // After the data is recieved, we set this.state.movie to the result of the API call. 
       this.setState({ 
        movie: JSON.parse(responseData), 
       }); 
      }) 
      .done(); 
    } 

+0

あなたはこれに対する解決策を見つけましたか?私はまったく同じ問題を経験しています – Adam

答えて

0

問題はおそらくApp Transport Securityです(デフォルトではアプリケーションがすべてのネットワーク通信でhttpsを使用するよう強制されます)。あなたの反応するネイティブアプリが動作するようにATSを微調整する方法を説明するビデオチュートリアルです:http://codecookbook.co/post/how-to-make-network-requests-in-react-native/

関連する問題