2017-05-26 5 views
0

私は、クライアントをPOSTに戻してAPIに戻すフェッチを作成するアクションを持っています。「415(サポートされていないメディアタイプ)」と「401(無許可)」を返すReux Reduce Fetchアクション

私は自分自身が問題ではない "ヘッダー"でJWTを送信します。これはGETでもうまく動作しますが、POSTでは使用できません。ここに私の行動があります:

export const createNewClient = (payload) => 
    (dispatch, getState) => { 
    dispatch({ type: REQUEST_CREATE_NEW_CLIENT, payload }) 

    const jwt = getJwt() 
    if (!jwt) { 
     throw new Error('No JWT present') 
    } 
    const token = jwt.access_token 
    const headers = new Headers({ 
     'Authorization': `bearer ${token}` 
    }) 
    debugger 
    const task = fetch('/api/client/create', { 
     method: 'POST', 
     body: JSON.stringify(payload), 
     headers, 
    }) 
     .then(handleErrors) 
     .then(response => response.json()) 
     .then(data => { 
     dispatch({ type: RECEIVE_CREATE_NEW_CLIENT, payload: data }) 

     dispatch({ 
      type: SAVE_MESSAGE, payload: { 
      message: "Successfully saved client", 
      type: 'success' 
      } 
     }) 
     }) 
     .catch(error => { 
     //clearJwt() 
     dispatch({ type: ERROR_CREATE_NEW_CLIENT, payload: error.message }) 

     dispatch({ type: SAVE_MESSAGE, payload: { message: error.message, type: 'error' } }) 
     }) 
    addTask(task) 
    return task 
    } 

私はUTF-8を含むようにヘッダーを修正しようとしました。

headers: { 
    'Content-Type': 'application/json;charset=UTF-8' 
    }, 

これはちょうど私に401 Unauthorizedを与えました。これは、これを使用することで正しいメディアタイプですが、今は受け入れられないことを意味します。

Fetch GETコマンドでも同じJWTがうまく動作するので、JWT自体は問題ではありません - 私は "Fetch"を書く方法かもしれないと思います。 JWTが受け入れられるように、私はなど

enter image description hereを逃したか、間違って取得POSTのために構成されている何

今、私はポストマンで同じことを行うと、私はこの取得と経由ではなく、取得...

+0

'fetch'に提供されるヘッダーはキーと値のペアでなければなりません。このヘッダーを試してください:{メソッド:POST、body:JSON.stringify(ペイロード)、 'Authorization': 'ベアラ$ {トークン}'} '。 –

答えて

1

それは、提供された画像

のように動作する場合以下が動作します

fetch('/api/client/create', { 
    method: 'POST', 
    body: JSON.stringify(payload), 
    headers: { 
    'Authorization': `bearer ${token}`, 
    'Content-Type': 'application/json', 
    } 
}) 
関連する問題