44,000원
다른 수강생들이 자주 물어보는 질문이 궁금하신가요?
- 미해결Slack 클론 코딩[백엔드 with NestJS + TypeORM]
중간 테이블 질문
엔티티 작성할 때 @ManyToMany와 @JoinTable을 사용해서 중간 테이블을 설정해주고, 따로 또 ~Members엔티티를 작성해서 중간 테이블을 설정해줬는데 이게 겹치는 문제는 없나요? 워크 벤치에 생성된 중간 테이블은 하나밖에 없던데 그건 @JoinTable에 의해 생성된 중간 테이블인가요? 직접 작성한 중간 테이블인 ~Members엔티티인가요?
- 해결됨Slack 클론 코딩[백엔드 with NestJS + TypeORM]
서비스 중 API 수정이 어렵다는 부분에 궁금한 점이 있습니다
7:47부터 말씀하시는 내용에 대한 질문입니다.API 설계가 잘못되었더라도 서비스 도중이면 수정하기가 어렵다고 하셨는데요.예시로 보여주신 것처럼 API 내에서 쓰이는 함수는 섣불리 건들면 안된다는건 이해가 되었습니다. 그런데 (':url/members/:id')에서 (':url/users/:id')로 고치는 것과 같이 URL 수정에는 어떤 이유로 어려움이 있는지가 궁금합니다.제가 생각하기에는 개발자가 아닌 일반적인 사용자들은 프론트엔드에서 버튼과 같은 UI를 클릭해서 이용하지, 위 URL을 전부 입력해서 사용하는 경우는 잘 없지 않을까? 라고 생각이 들거든요.혹시 같이 작업 중인 동료 개발자들에게 혼란을 줄 수 있는 이유에서일까요?
- 미해결Slack 클론 코딩[백엔드 with NestJS + TypeORM]
app.use(passport.initialize()) 질문
궁금한거 있으면 일단 ChatGPT에 검색해서 보고 있는데"NestJS의 Passport 통합에서는 PassportModule의 설정을 사용하여 Passport 초기화 및 세션 관리를 추상화합니다. 즉, PassportModule을 사용하면 내부적으로 passport.initialize()는 처리됩니다.그러나 passport.session()과 관련하여서는 다르게 동작합니다. passport.session() 미들웨어는 세션을 관리하기 위해 필요한 작업을 수행합니다. 이 미들웨어는 사용자의 요청마다 Passport를 통해 세션에서 사용자 정보를 복원하는 역할을 합니다. NestJS에서 세션 기반 인증을 사용할 때는 passport.session() 미들웨어를 수동으로 추가해주어야 합니다.따라서, 당신의 질문에 답하면, NestJS에서 passport.initialize()는 PassportModule을 사용함으로써 내부적으로 처리되지만, passport.session()은 명시적으로 추가해주어야 합니다.즉, app.use(passport.session())는 필요하며, app.use(passport.initialize())는 PassportModule 사용시에는 필요하지 않습니다."라고 하더군요. app.use(passport.initialize())는 필요가 없나요?
- 미해결Slack 클론 코딩[백엔드 with NestJS + TypeORM]
로그로 남겨야하는 항목을 어디까지로 해야할까요?
안녕하세요 제로초님.강의 잘 보았습니다.유저가 http request를 보냈을 때 해당 요청에 대한 로깅을 하려고 하는데 남겨야하는 정보에대한 고민이 있어 문의드립니다.한번의 요청에는 수업시간에 기재해주신 정보 이외에 여러정보가 있는걸로 알고있습니다.header(jwt token정보 등), body, param, query, response body 등 여러정보중 어떤 것을 로그에 포함해서 남겨주는게 좋을지 가늠이 되지 않아서 조언을 구하고 싶습니다!
- 해결됨Slack 클론 코딩[백엔드 with NestJS + TypeORM]
login Cookie 전송에 관해 질문이 있습니다.
현재 Sleact 프로젝트를 Nestjs로 백앤드 개발을 완료하여 개인 도메인으로 배포중 이고 현재 Sleact 프론트단을 Vite 와 React-query 를 이용해서 다시 제작중에 Login의 쿠키가 정상적으로 넘어 오지 않는 에러가 있었습니다.해당 에러는 배포중인 api는 개인 도메인이고 프론트 단은 localhost 여서 sameSite 에러가 발생 한거였는데아래와 같이 secure: true 설정을 하게되면 Api 서버는 https 이고 localhost 는 http 여서 실패하게되고 cookie: { httpOnly: true, sameSite: 'none', secure: true, },아래와 같이 secure: false 설정을 하게되면 인용구 문구가 뜨면서 실패하게 됩니다. cookie: { httpOnly: true, sameSite: 'none', secure: false , },samesite none 속성은 있지만 samesite=none 을 사용하는데 필요한 secure 속성은 없으므로 set-cookie 헤더를 통해 쿠키를 설정하려는 시도가 차단되었습니다현재는 api를 localhost로 추가로 실행하여 front 단에서 현재 개발환경에 따라 dev 일때는 localhost 개발 단에서는 개인도메인으로 요청하도록 해서 해결햇는데, localhost 에서 배포된 api를 받아 사용할때 어떻게 처리하는게 올바른 방법인가요?
- 미해결Slack 클론 코딩[백엔드 with NestJS + TypeORM]
서버에 여러명이 동시 접속 시 잘못된 개인정보 전송 오류
안녕하세요 제로초님~ 금일 질문드리고자 하는 내용은 제 ec2 에 띄워둔 nest.js 서버에 여러명이 동시에 접속 시, 서버의 오작동에 관한 내용입니다.nest.js 로 개발을 하면서 여러 사람이 서버에 동시에 로그인을 하면, 로그인한 당사자가 아닌 다른 사람의 회원정보가 나타나는 버그를 발견했습니다. 그래서 인터셉터를 사용하여 사용자에게 응답을 보내기 전 한번 더 검증을 진행하는 방식으로 해결을 했지만, 여러 의문점들을 해결하지 못하여 질문드립니다.1. 인터셉터를 사용하여 위 문제를 해결한 것이 올바른 접근 방식일까요? 팀원들에게 물어보니 인터셉터를 적용한 후에 위 같은 현상이 사라졌다고는 합니다.2. 이러한 문제가 나타나는 이유가 무엇일까요? 제 예상으로는 Node.js 가 싱글스레드라서 여러 요청이 한번에 몰려오면 비동기 부분이 꼬여서 나타나는 문제일까 생각했습니다. 그런데 챗지피티에게 물어보니 오히려 싱글스레드, 싱글톤이면 꼬일 일이 없다고 해서 더 혼란스럽네요. ============================================깃허브 저장소 컨트롤러 부분 : https://github.com/fog-of-war/dev-be/blob/dev/src/users/users.controller.ts#L63서비스 부분 : https://github.com/fog-of-war/dev-be/blob/dev/src/users/users.service.ts#L72가드 부분 : https://github.com/fog-of-war/dev-be/blob/dev/src/auth/guard/at.guard.ts#L13전략 부분 : https://github.com/fog-of-war/dev-be/blob/fff2d70af55ba51d1b3649006774b4d2aec7d566/src/auth/strategy/at.strategy.ts#L12인터셉터 부분 : https://github.com/fog-of-war/dev-be/blob/dev/src/common/interceptor/user-sub-check.interceptor.tsGetCurrentUser 데코레이터 부분 : https://github.com/fog-of-war/dev-be/blob/dev/src/auth/decorator/get-current-user-id.decorator.ts#L4============================================아래의 글은 제가 해결해보면서 적은 블로그 글입니다. ### 1. 로그로 찍어보기일단 로그로 어떻게 된 일인지 확인해봤다.```ts@UseGuards(ATGuard) @Controller("users") export class UsersController { constructor( private userService: UsersService, private logger: LoggerService ) {} /** 나의 정보 가져오기/ 마이페이지, 메인페이지 사용 */ @Get("me") async getMe(@GetCurrentUserInfo() user) { // 1. 여기선 user_id : 3 으로 출력되나 this.logger.log("1️⃣ 1. 자신의 회원정보 호출한 사람 ", user["sub"]); const result = await this.userService.findUserById(user["sub"]); // 2. 여기선 user_id : 2 의 정보를 출력 후 user_id : 3 에게 응답 this.logger.log("2️⃣2. 자신의 회원정보 호출 결과", result); return result; } }user_id : 3 이 'users/me' 요청을 했을때 1️⃣ 로그에서는 정상적으로 요청한 사람의 정보를 출력했다.그러나 서비스 계층 비즈니스 로직을 지난 뒤인 2️⃣ 로그에서는 user_id : 2 의 정보를 출력했다.엑세스토큰 소유자의 것이 아닌 동시에 접속한 다른 사람의 정보를 전달한 것이다.혼자 로컬에서 여러 계정으로 로그인해가며 작업을 할 땐 이런 현상이 없었기에, Node.js 의 싱글스레드 방식 때문이 아닐까 예상했다.### 2. 비슷한 사례 찾아보기"로그인하면 다른 사람 정보가"···리디, 개인정보 유출 사고[https://v.daum.net/v/20230329083313717](https://v.daum.net/v/20230329083313717)올리브영 개인정보 노출 사건, 무슨 일이 일어났을까?[https://www.boannews.com/media/view.asp?idx=114594](https://www.boannews.com/media/view.asp?idx=114594)리디북스의 경우 CDN 서버 캐시 설정 오류, 올리브영의 경우 CDN 오류 였다고 한다. 현재 내 서버는 CDN 방식을 사용하지 않고 있다.올리브영, 아직 조사 중이라 상세 내용 공개 어려워그러면서 “CDN(콘텐츠 배포 네트워크)에서 일시적인 오류가 발생해 일부 고객들의 정보가 노출된 것”이라고 설명했다. CDN이 엉키면 사용자가 특정 콘텐츠를 요청했을 때, 엉뚱한 결과가 출력되는데, 바로 그런 일이 일어났다는 것이다.Open AI 의 경우 Redis 라이브러리 버그[https://www.clien.net/service/board/news/17984872](https://www.clien.net/service/board/news/17984872)클리앙의 경우 Redis 라이브러리 버그[https://www.clien.net/service/board/annonce/17922106](https://www.clien.net/service/board/annonce/17922106) Open AI 와 클리앙의 경우 레디스 라이브러리 버그로 발생했다고 한다. 하지만 내 서버에 레디스를 설치하기 전에도 해당 버그는 발생했었다. 정확한 원인이 파악되었습니다.저희가 서버에서 세션을 저장하고 있는 redis(일종의 메모리db)가 한계수치 이상의 부하를 받으면 인덱스가 깨지는 현상이 발생한다고 합니다.국내 대형 쇼핑몰 두곳에서 최근 유사한 증상이 있어 관련자들에게 문의해본 바 저희와 같은 증상이었습니다. 이번의 여러 조치 중 redis 통신 최적화 작업도 진행하였기에 다시 재발되지 않을 것입니다.더 줄일 수 있는 요소가 있으므로 추가적인 작업을 진행할 예정입니다.### 3. 해결 방안클라이언트에게 데이터를 돌려보내기 전에 한 번 더 검증을 진행하기로 했다.들어오는 모든 요청을 인터셉터가 먼저 확인하고, 해당 엔드포인트가 Access Token 을 사용하는 메서드라면 user_id 를 originalUserSub 라는 변수에 기록해둔다.그리고 응답을 반환하기 전, 반환 값에 들어있는 user_id 와 originalUserSub 의 동일 여부를 검증한다.만약 검증을 통과하지 못한다면 해당 요청을 무효화하고 다시 실행하게끔 로직을 구성했다.import { Injectable, NestInterceptor, ExecutionContext, CallHandler } from '@nestjs/common'; import { Observable } from 'rxjs'; import { switchMap } from 'rxjs/operators'; import { LoggerService } from '../../logger/logger.service'; @Injectable() export class UserSubCheckInterceptor implements NestInterceptor { constructor(private readonly logger: LoggerService) {} intercept(context: ExecutionContext, next: CallHandler): Observable<any> { const request = context.switchToHttp().getRequest(); const user = request.user; const originalUserSub = request.user.sub; return next.handle().pipe( switchMap(async (data) => { if (user['sub'] && data.user_id) { if (data.user_id && originalUserSub !== undefined && data.user_id !== originalUserSub) { // user["sub"] 값이 변경되었으므로 해당 메서드를 다시 호출합니다. this.logger.log("UserSubCheckInterceptor : user['sub'] 가 동일하지 않습니다 " + originalUserSub + "!==" + data.user.user_id) return await next.handle().toPromise(); } } return data; }), ); } }https://github.com/fog-of-war/dev-be/blob/dev/src/common/interceptor/user-sub-check.interceptor.ts
- 해결됨Slack 클론 코딩[백엔드 with NestJS + TypeORM]
개발환경과 배포환경시 다른 의존성을 주입하는 예제
질문보다는 코드 리뷰에 가까운데 강의 내용중에 나온 테스트 코드와 실제 배포시 다르게 적용할 경우 예제를 작성해 보았습니다.이해한 내용이 맞는지 또는 보안이나 수정할 만한 내용이 있는지 알려주시면 감사합니다.//app.service.ts import { Injectable } from '@nestjs/common'; export interface IAppService { getSecret(): string; } @Injectable() export class AppService implements IAppService { getSecret(): string { return '실제 배포 환경'; } } @Injectable() export class Test_AppService implements IAppService { getSecret(): string { return '개발 테스트 환경'; } } //app.module.ts import { Module } from '@nestjs/common'; import { AppController } from './app.controller'; import { AppService, Test_AppService } from './app.service'; import { ConfigModule } from '@nestjs/config'; @Module({ imports: [ConfigModule.forRoot({ isGlobal: true })], controllers: [AppController], providers: [ { provide: 'AppService', useClass: process.env.NODE_ENV === 'production' ? AppService : Test_AppService, }, ], }) export class AppModule {} //app.controller.ts import { Controller, Get, Inject } from '@nestjs/common'; import { IAppService } from './app.service'; @Controller() export class AppController { constructor(@Inject('AppService') private readonly appService: IAppService) {} @Get() getHello(): string { return this.appService.getSecret(); } }
- 해결됨Slack 클론 코딩[백엔드 with NestJS + TypeORM]
의존성 주입시 객체가 반복적으로 생성될 수 있다고 했는데 해결방법이 어떻게 되는건가요?
강의 내용중 어떤것들은 DI 때마다 객체가 생성될수가 있고그럴 경우 웹소캣 객체같은 경우 문제가 생길수 있다고 하셧는데Nest 에서 그것을 해결하기 위해 자동으로 Module 단에서 Provider에 추가시 자동으로 객체를 하나만 만든후 재사용하여 (싱글톤과 유사하게 작동) 등을 통해 해결을 해주는것인지아니면 직접 해당 Class에서 싱글톤으로 생성을 해줘야 하는건지 궁금합니다.
- 미해결Slack 클론 코딩[백엔드 with NestJS + TypeORM]
서비스 배포 관련 궁금한 부분이 있어 질문드립니다.
서비스 배포 관련 궁금한 부분이 있어 질문드립니다. 1. 현재 ubuntu 에 nginx 와 pm2 설치 해서 nestjs를 테스트 진행하고 있는데 특별한 이상은 없어 보이는데실제 서비스에도 pm2를 사용하게 안전성에 문제가 없는지 궁금 합니다. 2. 검색을 하다보니 Bun 1.0 이 있던데 이거 실제 서비스에 사용할수 있는지 궁금합니다.
- 해결됨Slack 클론 코딩[백엔드 with NestJS + TypeORM]
pm2cluster 검색중 궁금한점이 있습니다.
안녕하세요 제로초님.nestjs를 pm2로 관리하는것 관련해서 검색하다가 머리속에서 정리가 되지 않는 내용이 있어서 질문드립니다. nestjs는 node기반이기 때문에 단일 쓰레드로 동작하고, 사용가능한 cpu 코어가 4개가 있더라도 1개만 사용하기 때문에 서버의 성능을 전체적으로 사용할 수 없다.라는 내용을 검색중에 보게되었는데요!위의 문제를 해결하기 위해서 사용하는 방법이pm2 cluster 기능 또는 docker를 활용하는것이라 찾았습니다.위의 내용이 제대로 찾은게 맞다면 제로초님께서는 어떤 방식으로 문제를 해결하시는지 알려주실 수 있을까요?
- 해결됨Slack 클론 코딩[백엔드 with NestJS + TypeORM]
try문 밖에서 에러 발생시 트랜잭션이 release가 안됩니다.
12:00 시작된 join 매서드를 만들고 실행을 시켜보니 에러 처리를 하면 커넥션 pool이 종료되지 않는거 같습니다. 이메일이 중복된 user를 insert하려 할 때 new ForbiddenException이 실행이 됩니다. 하지만 finally문이 실행이 안되는거 같습니다.async join(email: string, nickname: string, password: string) { const queryRunner = this.dataSource.createQueryRunner(); await queryRunner.connect(); await queryRunner.startTransaction(); const user = await queryRunner.manager .getRepository(Users) .findOne({ where: { email } }); if (user) { throw new ForbiddenException('이미 존재하는 사용자입니다'); } const hashedPassword = await bcrypt.hash(password, 12); try { const returned = await queryRunner.manager.getRepository(Users).save({ email, nickname, password: hashedPassword, }); const workspaceMember = queryRunner.manager .getRepository(WorkspaceMembers) .create(); workspaceMember.User = returned.id; workspaceMember.Workspace = 1; // throw new NotFoundException('롤백해봐'); await queryRunner.manager .getRepository(WorkspaceMembers) .save(workspaceMember); await queryRunner.manager.getRepository(ChannelMembers).save({ User: returned.id, ChannelId: 1, }); await queryRunner.commitTransaction(); return true; } catch (error) { console.error(error); await queryRunner.rollbackTransaction(); throw error; } finally { console.log('이거 실행됨?'); await queryRunner.release(); } }'이거 실행됨?' 이라는 문자가 출력이 되지 않습니다. 여러번 반복한 후 pgAdmin에서 database activity를 살펴보니 커넥션 pool이 release되지 않고 idle 상태로 되어있습니다.이 때문에 서버의 pool이 가득차서 서버가 종료됩니다. user의 중복검사도 try문 안에 넣으면 해결되는거 같습니다. 🟩 혹시 존재하는 사용자 로직을 try문 밖에 빼신 이유가 있는지 궁금합니다.
- 해결됨Slack 클론 코딩[백엔드 with NestJS + TypeORM]
socket.io 사용 시 cors 에러 with react
안녕하세요 제로초님~! 최근에 socket.io 문제를 해결해주셔서 감사합니다. 제로초님 덕분에 몇주간 있었던 불면증이 사라졌습니다. 이번에 드리고자 하는 질문은 백엔드 api 서버와 리액트 로컬호스트의 websocket 연결에서 cors 에러가 사라지지 않고 있다는 것입니다.프론트와 백엔드 둘다 localhost로 사용했을땐 문제 없이 잘 작동하였으나, 백엔드 api 서버와 프론트(리액트) http://localhost:3000 로 연결하려 하니 cors 에러가 사라지질 않네요.백엔드 api 서버주소는 https://api.yubinhome.com/ 이고, traefik 을 사용해 https 인증을 받고 있습니다.제가 어떤 부분을 놓친 것인지 함께 봐주실 수 있을까요? 에러메시지 Access to XMLHttpRequest at 'http://api.yubinhome.com/socket.io/?EIO=4&transport=polling&t=Ohzm2CT' from origin 'http://localhost:3000' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: Redirect is not allowed for a preflight request. GET http://api.yubinhome.com/socket.io/?EIO=4&transport=polling&t=OhzmhTk net::ERR_FAILED 요청헤더 응답헤더 시도 해 본 방법1. 공식 문서에 나온대로 api url 에 직접 연결해보니 서버가 작동하고 있는 것은 확실해보입니다.소켓io 공식문서 cors : https://socket.io/docs/v3/handling-cors/#troubleshooting2. 서버측 origin, credetials 를 설정하였습니다. origin : "*" 가 문제인가 싶어 http://localhost:3000 url 을 직접 주었습니다. 클라이언트 측에는 withCredentials: true 을 설정해주었습니다.백엔드 api 서버 코드https://github.com/fog-of-war/dev-be/blob/dev/src/events/events.gateway.ts@WebSocketGateway({ cors: { origin: "http://localhost:3000", methods: ["GET", "POST"], allowedHeaders: ["authorization", "Authorization"], credentials: true, }, namespace: /\/ws-.+/, transports: ["websocket", "polling"], })리액트 코드https://github.com/fog-of-war/dev-fe/blob/46a8de3a13de4039e9aa511a07cfeea23d8a85fa/src/components/Notifications/NoticeNotifications.tsxREACT_APP_API_URL=https://api.yubinhome.com/REACT_APP_SOCKET_URL=ws://api.yubinhome.com/v1/ws-alertlet socket: any = null; socket = io(socketUrl + "-" + userId, { withCredentials: true, extraHeaders: { Authorization: `Bearer ${sanitizedToken}`, }, });
- 해결됨Slack 클론 코딩[백엔드 with NestJS + TypeORM]
socket.io 사용시 랜덤하게 객체가 emit 됩니다.
안녕하세요 제로초님~ 백엔드 개발자 지망생이자 제로초님의 팬인 신유빈입니다.1개월 가량 하기 문제를 구글링 하며 여러 경우의 수를 찾아보았지만 이유를 찾지 못하여 질문드립니다.질문드리고자 하는 내용은 이렇습니다.socket.io 로 이벤트를 emit 할때, 같은 메서드를 사용함에도 객체에 따라 클라이언트에 전송될 때도 있고, 전송되지 않을 때도 있는데 그 원인을 찾지 못하고 있습니다.현재 저는 신규게시물 혹은 댓글이 작성되었을때 모든 사용자에게 알림을 emit 하고자 합니다.현재 3가지의 경우 중 A만 성공중인 상태입니다.A : 테스트를 위하여 handleConnection 메서드에서 소켓에 연결한 사용자의 정보 객체를 message 로 전송시 성공B : 게시물 작성 시 생성한 알림 메시지 객체를 message 로 전송시 실패C: 댓글 작성 시 생성한 알림 메시지 객체를 message 로 전송시 실패모든 케이스에서 클라이언트에게 메시지를 성공적으로 보내려면 어떻게 해야할지 도움을 주실 수 있을까요?// 실행 동영상 https://youtu.be/AgLmcV53EvM// 코드깃허브 저장소 전체 코드https://github.com/fog-of-war/dev-be/blob/zerocho/README.mdEventsGatewayhttps://github.com/fog-of-war/dev-be/blob/zerocho/src/events/events.gateway.ts#L55 // fow-be/src/events/events.gateway.ts /** 웹소켓 연결시 */ handleConnection(@ConnectedSocket() socket: Socket, client: any) { const interval = setInterval(() => { const userInfo = socket.userInfo; this.sendMessage(userInfo); }, 5000); socket.on("disconnect", () => { clearInterval(interval); }); } /** 메시지 전송 */ sendMessage(message?: any) { console.log(" \n 🌠 sendMessage \n", message); this.server.emit("message", message); return Promise.resolve("Message sent successfully"); } AlertServicehttps://github.com/fog-of-war/dev-be/blob/zerocho/src/alert/alert.service.ts#L12 // fow-be/src/alert/alert.service.ts // B: 게시물 작성시 실행되는 알림 서비스 코드 async createNotifyAlert(id: number) { const data = { alert_place_id: id, alert_type: "NOTIFY" as Type }; const alert = await this.prisma.alert.create({ data: data }); const result = await this.makePostAlertMessage(id); await this.eventsGateway .sendMessage(result) .then((response) => { // console.log("🌠 Notification sent successfully:", response); }) .catch((error) => { console.error("🌠 Error sending notification:", error); // 전송 실패 또는 오류가 발생한 경우에 실행할 로직을 여기에 추가 }); return result; }// fow-be/src/alert/alert.service.ts // C : 댓글 작성시 실행되는 알림 서비스 코드 async createActivityAlert(id: number) { const data = { alert_comment_id: id, alert_type: "ACTIVITY" as Type }; const alert = await this.prisma.alert.create({ data: data }); const result = await this.makeCommentAlertMessage(id); await this.eventsGateway .sendMessage(result) .then((response) => { // console.log("🌠 Notification sent successfully:", response); }) .catch((error) => { console.error("🌠 Error sending notification:", error); }); return result; } // 출력결과# A : 클라이언트에 전송 성공 🌠 sendMessage { sub: 2, user_email: 'shin.yubin18@gmail.com', iat: 1695983169, exp: 1695986769 } # B : 클라이언트에 전송 실패 🌠 sendMessage { place_id: 1, place_name: '코엑스', region_name: '강남구', post_id: 65, post_created_at: 2023-09-29T10:27:28.371Z, post_image_url: 'https://fog-of-war.s3.ap-northeast-2.amazonaws.com/랜드마크/1코엑스.jpeg' } # C : 클라이언트에 전송 실패 🌠 sendMessage { user_nickname: '구글신유빈', user_image_url: 'https://fog-of-war.s3.ap-northeast-2.amazonaws.com/defaultProfile.png', comment_id: 15, comment_text: '우왕', comment_created_at: 2023-09-29T10:52:24.960Z }
- 미해결Slack 클론 코딩[백엔드 with NestJS + TypeORM]
socketio 질문 있습니다.
안녕하세요. 마이크로 서비스를 만들어 보고있습니다. 서버끼리는 gRPC 통신을 사용하고, 클라이언트는 게이트웨이를 통해서 HTTP통신을 하는 형태로 만들고있습니다.요구사항은 이제 어느정도 다 구현이 된 상태인데요. 데이터베이스의 데이터를 모두 보여주는 화면에서 새로운 데이터가 입력됐을때 실시간으로 보여주기 위해서 웹 소켓을 사용하려고 합니다.그래서 게이트웨이에 웹소켓 게이트웨이를 추가했습니다. import { Inject, OnModuleInit } from '@nestjs/common'; import { MessageBody, SubscribeMessage, WebSocketGateway, WebSocketServer, } from '@nestjs/websockets'; import { Server } from 'socket.io'; import { CounselServiceClient } from './../../../proto/src/counsel'; import { ClientGrpc } from '@nestjs/microservices'; import { firstValueFrom } from 'rxjs'; @WebSocketGateway({ cors: { origin: '*' } }) export class EventsGateWay implements OnModuleInit { counselService: CounselServiceClient; constructor(@Inject('COUNSEL_PACKAGE') private clientCounsel: ClientGrpc) {} onModuleInit() { this.counselService = this.clientCounsel.getService<CounselServiceClient>('CounselService'); } @WebSocketServer() server: Server; @SubscribeMessage('getAllCounselAdmin') async getAllCounselAdmin() { const result = await firstValueFrom( this.counselService.getAllCounselAdmin({}) ); this.server.emit('allCounselAdminData', result); } @SubscribeMessage('getCounselAdmin') async getCounselAdmin(@MessageBody() data: any) { const counselId = data.counselId; const result = await firstValueFrom( this.counselService.getCounselAdmin({ counselId }) ); this.server.emit('counselData', result); } }이게 지금 웹소켓 게이트웨이의 코드입니다. 클라이언트와 연결하기 위해서'use client'; import { useEffect, useState } from 'react'; import { CounselProto } from './../../../proto/src/counsel'; import axios from 'axios'; import Long from 'long'; import Link from 'next/link'; import { io } from 'socket.io-client'; export const statusInfoMap: { [key: number]: string } = { 1: '', 2: '', 3: '', 4: '', 5: '', }; export default function GetAllCounselByAdmin() { const [counselData, setCounselData] = useState<CounselProto[]>([]); const [isLoading, setIsLoading] = useState(false); useEffect(() => { const socket = io('http://localhost:3000'); socket.on('connect', () => { console.log('Connected to the server'); }); socket.on('allCounselAdminData', (data) => { console.log('Received data: ', data); setCounselData(data); }); socket.on('disconnect', () => { console.log('Disconnected from the server'); }); return () => { socket.disconnect(); }; }, []); return ( <div> {isLoading ? ( <p>Loading...</p> ) : ( <> <h1>모든 상담 내역 조회</h1> <table> <thead> <tr> <th>[상담 기록 번호]</th> <th>[상담 접수 내용]</th> <th>[상담 진행 상황]</th> <th>[상담 접수 날짜]</th> <th>[고객 고유 번호]</th> <th>[고객 성함]</th> <th>[고객 연락처]</th> </tr> </thead> <tbody> {counselData?.map((item, i) => ( <tr key={i}> <td> <Link href={`/admin/counsel/${item.counselId}`}> {item.counselId} </Link> </td> <td>{item.content}</td> <td>{statusInfoMap[item.statusInfo]}</td> <td>{item.createdAt.toLocaleString()}</td> <td>{item.counselUserId}</td> <td>{item.name}</td> <td>{item.phone}</td> </tr> ))} </tbody> </table> </> )} </div> ); }이렇게 적고 서버를 실행해서 해당 페이지에 접속을 하니까 콘솔에 Connected to the server라고는 뜨는데, 데이터가 꽂히지 않고있습니다.서버로 부터 데이터를 못 받아오고있는것같은데요. 어떤 부분을 손대야할지 모르겠습니다. 해당 소켓 게이트웨이는 공식문서를 참고해서 적었습니다..
- 미해결Slack 클론 코딩[백엔드 with NestJS + TypeORM]
dataSource
AND `TABLE_NAME` = 'channels' UNION SELECT * FROM `INFORMATION_SCHEMA`.`REFERENTIAL_CONSTRAINTS` WHERE `CONSTRAINT_SCHEMA` = 'sleact' AND `TABLE_NAME` = 'channelchats' UNION SELECT * FROM `INFORMATION_SCHEMA`.`REFERENTIAL_CONSTRAINTS` WHERE `CONSTRAINT_SCHEMA` = 'sleact' AND `TABLE_NAME` = 'users' ) `rc` ON `rc`.`CONSTRAINT_SCHEMA` = `kcu`.`CONSTRAINT_SCHEMA` AND `rc`.`TABLE_NAME` = `kcu`.`TABLE_NAME` AND `rc`.`CONSTRAINT_NAME` = `kcu`.`CONSTRAINT_NAME` query: SELECT VERSION() AS `version` query: SELECT * FROM `INFORMATION_SCHEMA`.`COLUMNS` WHERE `TABLE_SCHEMA` = 'sleact' AND `TABLE_NAME` = 'typeorm_metadata' query: DROP INDEX `UserId` ON `workspacemembers` query failed: DROP INDEX `UserId` ON `workspacemembers` error: Error: Cannot drop index 'UserId': needed in a foreign key constraint query: ROLLBACK [Nest] 81848 - 2023. 09. 20. 오전 12:47:04 ERROR [TypeOrmModule] Unable to connect to the database. Retrying (9)... QueryFailedError: Cannot drop index 'UserId': needed in a foreign key constraint at Query.onResult (/Users/yujinseung/Desktop/Slack/slack_s/src/driver/mysql/MysqlQueryRunner.ts:222:33) at Query.execute (/Users/yujinseung/Desktop/Slack/slack_s/node_modules/mysql2/lib/commands/command.js:36:14) at PoolConnection.handlePacket (/Users/yujinseung/Desktop/Slack/slack_s/node_modules/mysql2/lib/connection.js:478:34) at PacketParser.onPacket (/Users/yujinseung/Desktop/Slack/slack_s/node_modules/mysql2/lib/connection.js:97:12) at PacketParser.executeStart (/Users/yujinseung/Desktop/Slack/slack_s/node_modules/mysql2/lib/packet_parser.js:75:16) at Socket.<anonymous> (/Users/yujinseung/Desktop/Slack/slack_s/node_modules/mysql2/lib/connection.js:104:25) at Socket.emit (node:events:513:28) at addChunk (node:internal/streams/readable:324:12) at readableAddChunk (node:internal/streams/readable:297:9) at Socket.Readable.push (node:internal/streams/readable:234:10) [Nest] 81848 - 2023. 09. 20. 오전 12:47:04 ERROR [ExceptionHandler] Cannot drop index 'UserId': needed in a foreign key constraint QueryFailedError: Cannot drop index 'UserId': needed in a foreign key constraint at Query.onResult (/Users/yujinseung/Desktop/Slack/slack_s/src/driver/mysql/MysqlQueryRunner.ts:222:33) at Query.execute (/Users/yujinseung/Desktop/Slack/slack_s/node_modules/mysql2/lib/commands/command.js:36:14) at PoolConnection.handlePacket (/Users/yujinseung/Desktop/Slack/slack_s/node_modules/mysql2/lib/connection.js:478:34) at PacketParser.onPacket (/Users/yujinseung/Desktop/Slack/slack_s/node_modules/mysql2/lib/connection.js:97:12) at PacketParser.executeStart (/Users/yujinseung/Desktop/Slack/slack_s/node_modules/mysql2/lib/packet_parser.js:75:16) at Socket.<anonymous> (/Users/yujinseung/Desktop/Slack/slack_s/node_modules/mysql2/lib/connection.js:104:25) at Socket.emit (node:events:513:28) at addChunk (node:internal/streams/readable:324:12) at readableAddChunk (node:internal/streams/readable:297:9) at Socket.Readable.push (node:internal/streams/readable:234:10)이런오류가 뜹니다..! 뭐가 문제인지 모르겠습니당..https://github.com/jinseung0327/slack_clone혹시나 해서 깃허브 주소까지 올립니닷..!
- 해결됨Slack 클론 코딩[백엔드 with NestJS + TypeORM]
트랜잭션 로직을 공통처리 하는 방법으로 적절할까요?
## 트랜잭션 서비스 @Injectable() export class TransactionService { constructor(private readonly dataSource: DataSource) {} async transaction(callback) { const queryRunner = this.dataSource.createQueryRunner(); await queryRunner.connect(); await queryRunner.startTransaction(); try { await callback(queryRunner); await queryRunner.commitTransaction(); return true; } catch (error) { console.error(error); await queryRunner.rollbackTransaction(); throw error; } finally { await queryRunner.release(); } } }## 트랜잭션 모듈 (글로벌) @Global() @Module({ providers: [TransactionService], exports: [TransactionService], }) export class TransactionModule {}## 사용예제 async join(email: string, nickname: string, password: string) { const user = await this.usersRepository.findOne({ where: { email } }); if (user) { throw new HttpException('이미 존재하는 사용자입니다.', 401); } const hashedPassword = await bcrypt.hash(password, 12); await this.transactionService.transaction(async (queryRunner) => { const result = await queryRunner.manager.getRepository(Users).save({ email, nickname, password: hashedPassword }); const sleact = await queryRunner.manager.getRepository(Workspaces).findOne({ where: { name: 'Sleact' } }); await queryRunner.manager.getRepository(WorkspaceMembers).save({ UserId: result.id, WorkspaceId: sleact.id }); const channel = await queryRunner.manager .getRepository(Channels) .findOne({ where: { name: '일반', WorkspaceId: sleact.id } }); await queryRunner.manager.getRepository(ChannelMembers).save({ UserId: result.id, ChannelId: channel.id }); }); } 안녕하세요 제로초님.트랜잭션 관련해서 로직 작성하다가 실행부를 제외하고는 너무 공통되는 것 같아서 방법을 고민하다가 위 소스처럼 처리하면 어떨까 싶어 작성해보았습니다.트랜잭션 서비스를 생성해서 공통이되는 트랜잭션 로직을 모아두고, 콜백함수를 받아서 처리하는 형태로 해보았는데요!일단 동작은 정상적으로 하는데, 이렇게 했을 때 발생할만한 문제가 있을지 짐작이 가지 않아서 문의 남깁니다!위와같은 로직으로 트랜잭션을 공통처리 했을 때 생길만한 사이드이펙트가 있을까요?
- 해결됨Slack 클론 코딩[백엔드 with NestJS + TypeORM]
Dto 생성시 유틸리티 타입을 사용할수 있나요?
DB를 기반하여 Users엔티티를 만들었을떄 join함수에서 사용할 DTO를 만들기위해 Users를 상속받아 Pick이나 Omit을 사용하여 일부 데이터만 사용하고 싶습니다.리액트의 유틸리티 타입처럼 기본 클래스에서 일부만 상속을 받는 방법이 있을까요?
- 미해결Slack 클론 코딩[백엔드 with NestJS + TypeORM]
passport-jwt 유저 정보 가져오기 로직
안녕하세요. 저번에는 jwt 인증 전략에 대해서 질문했었는데요. 해결이 됐습니다.이번에는 passport-jwt의 jwt.strategy.ts 의 가드 전략에서 로그인한 유저의 정보를 가져와야 하는데요.미리 정해놓은 페이로드의 id를 가져오니 유저의 id는 나왔는데 유저의 나머지 정보는 어떻게 가져오는건가요?가져오는 방법과 가져오게되는 로직이 궁금합니다.
- 미해결Slack 클론 코딩[백엔드 with NestJS + TypeORM]
jwt, local authguard에 관해서
안녕하세요. 저번에 NESTJS를 이용해서 MSA환경에서 gRPC프로토콜을 이용하는 시스템을 만들고있다고 질문했었는데, jwt와 local을 이용한 인증전략을 구성하는데 문제가 생겨서 ,질문 남깁니다.서버는 gateway를 통해 클라이언트와 통신하고, 각 서버끼리는 gRPC를 통해 통신하고, 클라이언트와는 HTTP통신을 합니다.jwt, local 가드는 게이트웨이의 각 모듈(user의 컨트롤러 등)에서 사용되기때문에 게이트웨이 모듈의 프로바이더에 JwtStrategy, LocalStrategy를 작성해놨는데Nest can't resolve dependencies of the LocalStrategy, Nest can't resolve dependencies of the JwtStrategy의 오류가 납니다.인증 전략을 가져오는데 문제가 생긴거같은데, 게이트웨이가 아닌 서버의 모듈에 추가해야하는건가요?일반적인 방법이 궁금합니다. 검색을 해보면 다 auth모듈을 만들어서 사용하는데, 저는 그냥 strategy파일만 만들어서 inject하려고 합니다...
- 해결됨Slack 클론 코딩[백엔드 with NestJS + TypeORM]
HttpExceptionFilter에 단순 HttpException 예외처리도 필요하지 않나요?
HttpExceptionFilter에서 에러처리시exception.getStatus() 로 err 변수값을 넣을떄HttpException 의 경우 string 타입BadRequestException, UnauthorizedException 와 같이 미리 정의된 경우 { message: any; statusCode: number } 타입class-validator의 경우 { error: string; statusCode: 400; message: string[] } 타입의 3가지 형태가 되는데이번강의에서 string 타입 자체를 제거하셧는데 HttpException 를 사용하게되면 에러 메시지가 제대로 안 날라 가게 됩니다. class-validator를 도입하면서 HttpException 케이스를 제거 하신거 같은데 해당 예외도 포함은 되어있어야 하지 않나요?class-validator 가 완전히 HttpException 를 대체하게 한다면 HttpException를 사용못하게 막을 방법이 있을까요?import { ExceptionFilter, Catch, ArgumentsHost, HttpException, } from '@nestjs/common'; import { Response } from 'express'; @Catch(HttpException) export class HttpExceptionFilter implements ExceptionFilter { catch(exception: HttpException, host: ArgumentsHost) { const ctx = host.switchToHttp(); const response = ctx.getResponse<Response>(); const status = exception.getStatus(); const err = exception.getResponse() as | string | { message: any; statusCode: number } | { error: string; statusCode: 400; message: string[] }; //class-validator if (typeof err !== 'string' && err.statusCode === 400) { return response.status(status).json({ success: false, code: err.statusCode, data: err.message, }); } //HttpException if (typeof err == 'string') { return response.status(status).json({ success: false, code: status, data: err, }); } //BadRequestException, UnauthorizedException return response.status(status).json({ success: false, code: status, data: err.message, }); } }