2016-11-16 5 views
1

私はCreate-React-Appスターターアプリを使用して反応します。私は、ノードフェッチでデータを取得するテストをしたいが、それは動作していないようです。私はそれを腋窩で働かせることができます。React Appノードフェッチを使用してデータをフェッチする

私は効果にエラーが発生します: 9:./~/encoding/lib/iconv-loader.jsに 重要な依存関係を警告12-34は、依存関係の要求が表現 @です./~ /encoding/lib/iconv-loader.js 9:12-34

webpack:///./~/react-scripts/~/react-dev-utils/webpackHotDevClient.jsにエラーがあるようです?

また、私はというエラーを取得:リソースの読み込みに失敗しました:ネット:: ERR_CONNECTION_TIMED_OUTをし、その要求の送信時に、URLにポートを追加さ​​れたフェッチのように思える:http://codepen.io:3000/jobs.json

コード:

import React from 'react' 
import NodeFetch from 'node-fetch' 

class NodeFetchData extends React.Component { 
    constructor(props) { 
    super(props); 

    this.state = { 
     jobs: [] 
    }; 
    } 


    componentDidMount() { 

    NodeFetch('http://codepen.io/jobs.json') 
    .then(res => { 
     this.setState({ jobs:res.data.jobs }); 
    }); 
    } 

    render() { 
    return (
     <div> 
     <ul> 
      {this.state.jobs.map(job => 
      <li key={job.hashid}>{job.company_name}</li> 
     )} 
     </ul> 
     </div> 
    ); 
    } 
} 

export default NodeFetchData; 
+0

あなたは[同じ起源のポリシー](https://en.wikipedia.org/wiki/Same-origin_policy)に惑わされていると思います。デフォルトでは、ほとんどのブラウザは、ページ上のJSコードが異なる起点のコンテンツにアクセスすることを許可しません。 – Kryten

答えて

0

https://github.com/github/fetchを使用することをお勧めします。これはかなり標準的ですが、実際これは最近[email protected]でピアとして追加されました。

さらに複雑な場合(複数のファイルアップロードなどの場合)superagentはうまく行く!

関連する問題