JWT 설정 - 헤더의 서버에서 클라이언트로 토큰을 전달하지만 클라이언트의 헤더를 구문 분석 할 수 없음

Question

사용자 인증을 위해 JWT를 사용하려고합니다. 클라이언트는 Relay가있는 React 애플리케이션입니다. GraphQL이 제공하는 엔드 포인트를 통해 Rails 백엔드와 대화하고 있습니다.

레일 측면에서 CORS를 설정하여 응답에 내 헤더가 노출되었는지 확인했습니다. 또한 Authorization에서 내 JWT를 설정 한 다음 반작용 측면에서

class Api::GraphsController < ActionController::Base 

def create 
    headers['Access-Control-Allow-Origin'] = '*' 
    headers['Access-Control-Allow-Methods'] = 'POST, GET, PUT, DELETE, OPTIONS' 
    headers['Access-Control-Allow-Headers'] = 'Origin, Content-Type, Accept, Authorization, Token' 
    headers['Access-Control-Max-Age'] = "1728000" 
    headers['Access-Control-Expose-Headers'] = 'content-length' 

    #set a fresh token after every request 
    headers['Authorization'] = "WOW.WoW.Wow" 

    render json: Schema.execute() 
end 

, 내가 (여기에서 예 - https://github.com/nodkz/react-relay-network-layer/blob/master/README.md#middlewares) 내 릴레이 미들웨어 계층의 옵션을 설정했습니다. 그러나 이것은 내 헤더에 액세스 할 수없는 곳입니다. res.headers을 인쇄하면 Header {}이 표시됩니다.

const options = [ 
    urlMiddleware({ 
    url: (req) => getEndpoint() 
    }), 
    retryMiddleware({ 
    fetchTimeout: 60000, 
    retryDelays: (attempt) => [7000], 
    forceRetry: (cb, delay) => { window.forceRelayRetry = cb }, 
    statusCodes: [500, 503, 504] 
    }), 
    next => req => { 
    req.credentials = 'same-origin'; // provide CORS policy to XHR request in fetch method 
    const resPromise = next(req); 
    resPromise.then(res => { 
     let headers = res.headers //Headers is empty 
     let user = res.json.data.user //Body is sent properly 

     return res; 
    }) 
    .catch((e) => { 
     console.log('=============error===========', e); 
    }) 

    return resPromise; 
    } 
] 

Chrome 개발자 도구를 보면 인증 토큰이 올바르게 설정되어 있습니다.

어떻게 노출 내 클라이언트 응용 프로그램에서 인증 토큰을받을 수 있나요?

Answer 1

resPromise 란 무엇입니까? req가 약속이면 작동 할 것입니다.

next => req => { 
     req.then(res => { 
     console.log(res.headers); 
    }); 
}