axios.get(<url>, {withCredentials : true} );
공식문서를 생활화하자 정말로... 블로그 틀린거 너무 많음
블로그에 올린 코드들도 공식문서꺼 복붙한 경우가 대부분이고,
잘못된 경우도 엄청많아서 무지성으로 블로그만 밑고 코딩하다가 엄청 고생했네...
app.use(cors(
{
origin: 'https://localhost:3000',
credentials: true,
}
));
옵션들 확실히 이해하기
uri 중 도메인을 기준으로 판별한다.
도메인의 public suffix(.com, co.kr, .net)를 제외한 값이 동일하면 sameSite에 해당한다.
아래의 값은 모두 sameSite이다.
https://www.dokydoky.com
http://dokydoky.net
https://ww2.dokydoky.co.kr
http : 스키마
naver.com : 도메인
80: 포트
스키마 && 도메인 && 80
이어야 origin이 동일
app.use(
session({
secret: '@codestates',
resave: false,
saveUninitialized: true,
cookie: {
domain: 'localhost',
path: '/',
maxAge: 24 * 6 * 60 * 10000,
sameSite: 'none',
httpOnly: true,
secure: true,
},
})
);
라우터 내에서 처리하지 못한 에러는 에러핸들링 미들웨어로 전달해주면 된다.
try {
// some async db func
} catch (err) {
console.err(err);
next(err);
}
// app.js error handling router
app.use("/", (err, req, res, next) => {
res.status(500).json({
code:500,
message:"Sever Error"
})
});
너무너무 고민하면서 시간을 보냈다. 덕분에 안까먹을거다.
http-only 옵션으로 서버에서 보낸 쿠키는 client 자바스크립트에서 접근할 수 없다.
그냥 접근 못한다. 방법이 없다. 라이브러리도 없고, 걍 못함.
Done. End of story.
하지만 axios로 요청을 보낼때는 요건에 맞으면 자동으로 함께 보내진다.
그러니까 해당 쿠키값을 리액트에서 확인하려고 두세시간동안 삽질한게 허무하게 해결되었다.
원래 못하는거고, 알아서 쿠키에 실어서 보내지는 거였다. 그러니가 axios에서 요청 보낼때 withCredentials만 잘 설정해주면 서버로 보내진다. 클라이언트 javascript에서 접근을 못할 뿐이다.