익스프레스 반응 쿠키 문제

Question

그래서 여기서는 expressJ를 사용하여 NodeJS를 기반으로하는 애플리케이션을 백엔드 및 반응 프론트 엔드로 구축하고 있습니다. 백엔드에서는 현재 사용자가 로그인하여 이벤트를 만들 수 있습니다. 이 기능은 Postman을 사용하여 테스트되었으며 정상적으로 작동합니다.

이제 프론트 엔드에서 백엔드가 내가 권한이 없다고 알려줍니다. 재미있게도 크롬 확장을 사용하여 Postman의 쿠키로 저장된 쿠키 (프론트 엔드의 브라우저에서)를 바꿀 때 갑자기 작동합니다. 따라서 어떻게 든 쿠키가있는 어떤 것이 잘못 될 것입니다.

//Session used in express 
app.use(session({ 
    resave: true, 
    saveUninitialized: true, 
    secret: process.env.SESSION_SECRET, 
    store: new MongoStore({ 
    url: process.env.MONGODB_URI || process.env.MONGOLAB_URI, 
    autoReconnect: true 
    }), 
    name: 'UsE' 
})) 

프론트 엔드는 fetch polyfill을 사용하여 로그인 요청을합니다.

그런 다음 백엔드는 pasport를 사용하여 사용자를 인증하며 모든 것이 잘되어야합니다. 나는 여기에서 쟁점이 될 수있는 것에 관해서는 완전히 상실하고있다.

다음은 백엔드에 401을 다시 요청하는 코드입니다. 기본 fetch polyfill does not pass along cookies to the server으로

export const createEvent = (infos) => (dispatch) => { 
    dispatch(startFetching('createEvent')) 
    return fetch(baseURL +'/api/event', { 
     method: 'POST', 
     headers: { 
      'Accept': 'application/json', 
      'Content-Type': 'application/json' 
     }, 
     credentials: 'include', 
     body: JSON.stringify(infos) 
    }) 
    .then(response => response.json()) 
    .then(json => { 
     if (json.msg) { 
      dispatch(displayToast(json.msg)) 
     } 
     if(json.event) { 
      dispatch(addEvent(json.event)) 
      dispatch(push(`/event/${json.event._id}`)) 
     } 
     dispatch(endFetching('createEvent')) 
    }) 
} 

Answer 1

. 같은 원산지로 요청한 send cookies의 경우 fetch()에 전달하는 옵션에 credentials: 'same-origin'을 포함해야합니다.

업데이트 된 코드는 다음과 같아야합니다

fetch(baseURL + '/api/login', { 
      method: 'POST', 
      credentials: 'same-origin', 
      headers: { 
       'Accept': 'application/json', 
       'Content-Type': 'application/json' 
      }, 
      body: JSON.stringify({ 
       email, 
       password 
      }) 

}).then(response => { // ...