getServerSideProps 문제 질문있습니다.
379
0
cookie가 있는걸로 봐서는 프론트에서 인식을 못하고 있는것 같다고 하셔서 살펴보는데 찾지를 못하겠습니다..
일단 pages/index,js의 getServerSideProps 는 문제가 없어 보입니다.
```javascript
export const getServerSideProps = wrapper.getServerSideProps((store) => async ({ req }) => {
const cookie = req ? req.headers.cookie : ''; // req가 있다면 cookie에 요청에 담겨진 cookie를 할당한다.
axios.defaults.headers.Cookie = ''; // 요청이 들어올 때마다 초기화 시켜주는 것이다. 여기는 클라이언트 서버에서 실행되므로 이전 요청이 남아있을 수 있기 때문이다
if (req && cookie) {
axios.defaults.headers.Cookie = cookie; // 서버일때랑 cookie를 써서 요청을 보낼 때만 headers에 cookie를 넣어준다
}
store.dispatch({
type: LOAD_MY_INFO_REQUEST, // user
});
store.dispatch({
type: LOAD_POSTS_REQUEST, // post
});
store.dispatch(END);
await store.sagaTask.toPromise(); // store/configureStore.js > store.sagaTask
}); // 이 부분이 Home 보다 먼저 실행됨
```
그리고 reducer 또한 문제가 없어 보입니다.
case LOAD_MY_INFO_REQUEST:
draft.loadMyInfoLoading = true;
draft.loadMyInfoDone = false;
draft.loadMyInfoError = null;
break;
case LOAD_MY_INFO_SUCCESS:
draft.loadMyInfoLoading = false;
draft.me = action.data;
draft.loadMyInfoDone = true;
break;
case LOAD_MY_INFO_FAILURE:
draft.loadMyInfoLoading = false;
draft.loadMyInfoError = action.error;
break;
이어서 saga user 입니다.
function loadMyInfoAPI() {
return axios.get('/user'); // GET(Browser)
}
function* loadMyInfo() {
try {
const result = yield call(loadMyInfoAPI);
console.log(result);
yield put({
type: LOAD_MY_INFO_SUCCESS,
data: result.data,
});
} catch (err) {
console.error(err);
yield put({
type: LOAD_MY_INFO_FAILURE,
error: err.response.data,
});
}
}
routes/user 입니다.
router.get('/:userId', async (req, res, next) => {
try {
const fullUserWithoutPassword = await User.findOne({
where: { id: req.params.userId },
attributes: {
exclude: ['password'], // 원하는 정보만 가져오거나 가져오지 않겠다 / 현재: pw 빼고 다 가져오겠다
},
include: [
{
model: Post,
attributes: ['id'],
},
{
model: User,
as: 'Followers',
attributes: ['id'],
},
{
model: User,
as: 'Followings',
attributes: ['id'],
},
], // 가져올 정보중 뺄 것들
});
if (fullUserWithoutPassword) {
const data = fullUserWithoutPassword.toJSON();
data.Posts = data.Posts.length; // 개인정보 침해 예방
data.Followers = data.Followers.length;
data.Followings = data.Followings.length;
res.status(200).json(data);
} else {
res.status(404).send('존재하지 않는 사용자입니다.');
}
} catch (err) {
console.error(err);
next(err);
}
});
추가로 middleware 입니다.
exports.isLoggedIn = (req, res, next) => {
if (req.isAuthenticated()) {
next(); // 비어있으면 다음 미들웨어로 간다
} else {
res.status(401).send('로그인이 필요합니다.');
}
};
exports.isNotLoggedIn = (req, res, next) => {
if (!req.isAuthenticated()) {
next(); // 비어있으면 다음 미들웨어로 간다
} else {
res.status(401).send('로그인하지 않은 사용자만 접근이 가능합니다.');
}
};
살펴본 결과 로직은 문제가 없어보이는데 혹시 front에서
getServerSideProps 문법이 강의와 다른데 라이브러리 사이트를 보고 적용했던겁니다. 제가 너무 헤매고 있어서 보시고 조언 주신다면 감사하겠습니다...
network 401
답변 9
0
혹시 서버 실행 시 npx pm2 start app.js 말고
npx pm2 start npm -- start 인가요..? 이렇게하니
로그인은 문제가 없지만 게시글을 쓰고 팔로우 페이지 가는데 문제가 생깁니다..
0
서버 실행 명령어는 npm start 입니다.
0
npm start를 하면 package.json에 적힌 start 스크립트가 그대로 실행되는 것입니다.
0
npx pm2 reloasd all 후에 로그인이 됩니다 그런데 새로고침하면 화면상 로그인이 풀려있고 같은 문제가 반복됩니다..
0
죄송합니다
0
백엔드 서버의 process.env.NODE_ENV가 production이 아니라서 Domain이 api.coding-factory.site로 들어간 것 같습니다. .coding-factory.site로 들어가야 프론트와 공유되거든요.
백엔드 서버를 종료하고 재시작하셔야 하는데 그 명령어에 process.env.NODE_ENV=production이 들어있나요?
0
네..
0
이 사진 말고 Cookies 탭 올려주세요.
0
app.use(
session({
saveUninitialized: false,
resave: false,
secret: process.env.COOKIESCRET,
cookie: {
httpOnly: true,
secure: false,
domain: process.env.NODE_ENV === 'production' && '.coding-factory.site',
},
})
); // dotenv
false 입니다..
0
이 이미지에서 Cookies 탭 한 번 보여주세요.
0
시키는대로 해봤는데 똑같습니다... aplication 탭 > Cookie 에서 connect.sid는 없었습니다..
0
백엔드에서 app.use(session 관련 코드 보여주세요. 혹시 secure: true인가요?
0
지금 Request Headers의 Cookie를 보시면 connect.sid가 있습니다. 이게 있으면 로그인된 상태라는 것입니다.
일단 개발자도구 Application 탭 -> Cookie -> 자신의 사이트 에서 connect.sid 쿠키를 지워보세요. 그러면 로그인이 될 것입니다.
그 후에 새로고침을 해서 로그인이 유지되는지 확인해보세요.
넥스트 버젼 질문
로그인시 401 Unauthorized 오류가 뜹니다
무한 스크롤 중 스크롤 튐 현상
특정 페이지 접근을 막고 싶을 때
createGlobalStyle의 위치와 영향범위
인라인 스타일 리렌더링 관련
vsc 에서 npm init 설치시 오류
nextjs 15버전 사용 가능할까요?
화면 새로고침 문의
RTK에서 draft, state 차이가 있나요?
Next 14 사용해도 될까요?
next, node 버전 / 폴더 구조 질문 드립니다.
url 오류 질문있습니다
ssh xxxxx로 우분투에 들어가려니까 port 22: Connection timed out
sudo certbot --nginx 에러
Minified React error 콘솔에러 (hydrate)
카카오 공유했을 때 이전에 작성했던 글이 나오는 버그
프론트서버 배포 후 EADDRINUSE에러 발생
npm run build 에러
front 서버 npm run build 중에 발생한 에러들
서버 실행하고 브라우저로 들어갔을때 404에러
css 서버사이드 랜더링이 적용되지 않아서 문의 드립니다.
팔로워 3명씩 불러오고 데이터 합쳐주는걸로 바꾸고 서버요청을 무한으로하고있습니다.
해시태그 검색에서 throttle에 관해 질문있습니다.
