diff --git a/client/src/_reducers/user.js b/client/src/_reducers/user.js index e24b149..5615374 100644 --- a/client/src/_reducers/user.js +++ b/client/src/_reducers/user.js @@ -1,15 +1,17 @@ import { createSlice, createAsyncThunk } from "@reduxjs/toolkit"; import axios from "axios"; +const httpClientForCredentials = axios.create({ + baseURL: "https://nodestudy-34u2.onrender.com", + // 서버와 클라이언트가 다른 도메인일 경우 필수 + withCredentials: true, +}); const asynsLoginFetch = createAsyncThunk( "userSlice/asynLoginFetch", async (formdata) => { - const resp = await axios.post( - "https://nodestudy-34u2.onrender.com/api/users/login", - formdata, - { - withCredentials: true, // 쿠키 전송을 허용하는 옵션 - } + const resp = await httpClientForCredentials.post( + "/api/users/login", + formdata ); return resp.data; } @@ -28,9 +30,7 @@ const asynsRegisterFetch = createAsyncThunk( ); const asynsAuth = createAsyncThunk("userSlice/asynsAuth", async () => { - const response = await axios.get( - "https://nodestudy-34u2.onrender.com/api/users/auth" - ); + const response = await httpClientForCredentials.get("/api/users/auth"); return response.data; }); @@ -50,6 +50,9 @@ export const userSlice = createSlice({ builder.addCase(asynsLoginFetch.fulfilled, (state, action) => { state.value = action.payload; state.status = "complete"; + httpClientForCredentials.defaults.headers.common[ + "Authorization" + ] = `Bearer ${action.payload.accestoken}`; }); builder.addCase(asynsLoginFetch.rejected, (state, action) => { state.status = "fail"; diff --git a/client/src/components/views/RegisterPage/RegisterPage.js b/client/src/components/views/RegisterPage/RegisterPage.js index 369f9d1..9463e19 100644 --- a/client/src/components/views/RegisterPage/RegisterPage.js +++ b/client/src/components/views/RegisterPage/RegisterPage.js @@ -47,7 +47,6 @@ function RegisterPage() { return ( -

cloudfront 캐시 무력화 확인

Sign Up diff --git a/server/index.js b/server/index.js index ff135b7..58b5c07 100644 --- a/server/index.js +++ b/server/index.js @@ -87,10 +87,11 @@ app.post("/api/users/login", async (req, res) => { sameSite: "None", secure: true, }; - res - .cookie("x_auth", userdata.token, options) - .status(200) - .json({ loginSuccess: true, userId: userdata._id }); + res.cookie("refreshtoken", userdata.token, options).status(200).json({ + accestoken: userdata.token, + loginSuccess: true, + userId: userdata._id, + }); } catch (err) { return res.status(400).send(err); } diff --git a/server/middleware/auth.js b/server/middleware/auth.js index 52fb11f..c6f76de 100644 --- a/server/middleware/auth.js +++ b/server/middleware/auth.js @@ -2,7 +2,14 @@ const { User } = require("../models/User"); // 인증 처리를 하는곳 let auth = async (req, res, next) => { // 클라이언트에서 토큰을 가져온다 - let token = req.cookies.x_auth; + let token = req.headers.authorization; + if (token) { + const userdata = await User.findByToken(token); + req.user = userdata; + return next(); + } else { + // refresh 토큰으로 access 토큰 재발급 + } try { // 토큰을 복호화 한후 유저를 찾는다. const userdata = await User.findByToken(token);