redux-sagaでPostを取得できないのですか？

Question

私はPOSTリクエストを送信するためにReduxの-サガを使用して、次のコードを持っている：

import {put, call, fork, takeEvery} from 'redux-saga/effects'; 
import fetch from 'isomorphic-fetch'; 
const url = 'xxx/api/posts'; 


function* addPost(data) { 
    try{ 
     const response = yield fetch(url, { 
      method: 'POST', 
      headers: { 
       'Accept': 'application/json, application/xml, text/plain, text/html, *.*', 
       'Content-Type': 'application/json; charset=utf-8' 
      }, 
      body: JSON.stringify(data) 
     }); 
     const id = yield response.json().id; 
     yield put({type: types.ADD_POST, payload: {id, title, content }}); 
    }catch(e) { 
     yield put({type: types.ERROR, payload: e}); 
    } 
} 

をしかし、AJAXは私のコードで間違っているものを「OPTION」メソッドで送信されますか？なぜそれは動作しません？

Answer 1

要求を送信するサーバーは、Content-Typeを含むAccess-Control-Allow-Headers応答ヘッダーを送信するように構成する必要があります。

https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS#Preflighted_requestsここで何が起こっているのかを説明します。あなたのリクエストにより、ブラウザはCORSの "プリフライト"を送信します。

この場合、ブラウザがプリフライトを行う具体的な理由は、リクエストにContent-Type: application/jsonリクエストヘッダーが含まれているということです。 CORSプロトコルは、そのクロス原点要求は、application/x-www-form-urlencoded以外の値を持つContent-Typeリクエストヘッダを含む multipart/form-data、 場合text/plain必要ブラウザはOPTIONS要求を送信し、応答がAccess-Control-Allow-Headersを含むかどうかを確認するためにそれに対する応答を確認します応答ヘッダーにはContent-Typeが含まれています。

ブラウザに、応答にその値を含むレスポンスヘッダーが含まれていることが判明した場合、ブラウザーは次にコードを作成しようとしている実際のPOST要求を送信します。しかし、代わりにブラウザが応答にそのヘッダが含まれていないと判断した場合、またはヘッダにContent-Typeが含まれていない場合、ブラウザはすぐに停止してPOSTを送信しません。