私はReact Reduxをローカルで使用してリモート・サーバをホストしていると、Expressサーバが正しく応答しません

Question

私はこれらの機能をサーバに搭載し、もう1台はクライアントにインストールしています。

ノードエクスプレスコード：

app.get('/api/current_user', (req, res) => { 
    res.setHeader('Access-Control-Allow-Origin', 'http://localhost:3000'); 
     res.send(req.user); 
    }); 

はReduxのコードに反応：

export const fetchUser =() => async dispatch => { 
    const res = await axios.get(`${URI}/api/current_user`); 

    console.log("res data: " +res.data) 

    dispatch({ type: types.FETCH_USER, payload: res.data }); 
}; 

問題は、私はこの{data: "", status: 200, statusText: "OK", headers: {…}, config: {…}, …}としてconsole.log("res data: " +res.data)の出力としてnullを取得することです。しかし、ブラウザでのテストではJSONをhttps://server243.azurewebsites.net/api/current_userとして取得します。

私はボーテサーバーを持っているし、ローカルで実行しているCLIENとき、私はCORS のconsole.log("res data: " +res.data)

Answer 1

をこのミドルウェアを追加してみてください、ヨール要求をブロックこの問題は反応アプリケーションにはありません。

req.userオブジェクトは、通常、PassportJsによって作成されます。したがって、パスポートがそのようにするには、まずあなたのケースであなたの反応アプリケーションにOauthプロバイダ（google）を呼び出さなければなりません。その後、プロバイダは、ユーザー名とパスワードを使用してログインできる画面にユーザーを誘導します。

認証に成功すると、エクスプレスアプリの登録済みエンドポイントは認証プロバイダによって呼び出され、最終的にユーザのブラウザとエクスプレスサーバとの間で有効なセッションが確立されます。

次に、req.userにpassportJsデシリアライズされたデータが格納されます。

Answer 2

Becouseローカルmashine上の要求を行うと、すべての（サーバとクライアント）がローカルホストであり、すべての罰金ですの出力としてデータを取得します。リモートサーバをアクセスもしようとする - それは、サーバとクライアントが同じドメインからではありませんbecouse

は、それがチャットで説明したように、あなたの特急サーバーに

app.use((req, res, next) => { 
    res.header('Access-Control-Allow-Origin', '*'); 
    res.header('Access-Control-Allow-Methods', 'POST, GET, PUT, PATCH, DELETE, MOVE, OPTIONS'); 
    res.header('Access-Control-Allow-Headers', 'Origin, X-Requested-With, Content-Type, Accept'); 
    next(); 
});