[React] Unexpected end of JSON input 오류 해결 🏃🏃🏃

회원가입 api 완성시키고 React에 연결시키는데 Unexpected end of JSON input가 발생했다.. JSON으로 파싱 하려고 했지만 해당 문자열이 JSON 형식에 맞지 않는다는 오류였다. 

 

일단 의심가는 부분은 아래 코드 부분이었는데 해당 부분이 서버에서 가져오는 데이터를 반환하는 곳이기 때문이다.

 

.then((res) => res.json())

 

근데 프론트에서 문제는 없어 보였고.. 해당 부분을 지우면 제대로 돌아갔지만 그건 아니잖아..! 그래서 검색하다가 회원가입 api의 Service 파일을 다시 보았고 웬걸.. 리턴 값을 넣어주지 않았었다.. 하하.. 회원가입 api를 호출하고리턴해서 받아오는 데이터가 없기 때문에 오류가 나는 거였다. Controller, Service 전부 리턴값으로 회원가입한 항목들을 아래 코드로 추가해 주었더니 오류 없이 해결되었다! 항상 리턴 값을 넣어줬는데 무슨 일인지 여기서 리턴값을 넣지 않아서 난 오류라니 너무 허무하지만 그래도 해결되어서 다행이다!

 

📌 Join.controller.ts

@Post('/user/sign-up')
  createUser(@Body() createUserDto: CreateUserDto): Promise<User> {
    return this.userService.createUser(createUserDto);
  }

 

📌 Join.service.ts(해당 코드는 리펙토리할 예정!)

async createUser(createUserDto: CreateUserDto): Promise<User> {
    const user = await this.userRepository.findOne({
      where: [{ id: createUserDto.id }, { nickname: createUserDto.nickname }],
    });

    if (user) {
      if (user.id) {
        throw new HttpException(`${user.id} 아이디 가 이미 존재합니다.`, 500);
      }
      if (user.nickname) {
        throw new HttpException(
          `${user.nickname} 닉네임이 이미 존재합니다.`,
          500,
        );
      }
    }

    const bcryptPassword = await bcrypt.hash(createUserDto.password, 10);
    createUserDto.password = bcryptPassword;
    const createUser = this.userRepository.save(createUserDto);
    return createUser;
  }