240513(@JsonNaming, @JsonProperty)

FE - BE 협업

 => Jackson Library

    - JSON <-> Java Object

    - 부가적 : Snake <-> Camel

    - 대표적인 어노테이션

    @JsonNaming / @JsonProperty

    : 어떨 때 사용할까? 예시 코드(Controller, Domain Object) 

 

 

 

- 카멜 케이스(Camel Case)

• 첫 글자는 소문자로, 중간 글자들은 대문자로 시작하는 표기법
• ex) memberId, memberName, memberPhoneNumber

- 스네이크 케이스(Snake Case)

• 첫 글자는 소문자로, 중간 글자들은 언더바(_)가 포함되는 표기법
• ex) member_id, member_name, member_phone_number

 

 

userId 로 요청한 데이터는 user_id 파라미터로 저장이 되지 않는 것을 확인할 수 있습니다.

- 이유는 요청한 key 이름(user_id)와 응답 객체(userId)의 파라미터 명이 다르기 때문에 발생한 문제입니다.

🔔 @JsonProperty 사용 예시

package com.example.shoppingmall.Member;

import com.fasterxml.jackson.annotation.JsonProperty;
import com.fasterxml.jackson.databind.PropertyNamingStrategies;
import com.fasterxml.jackson.databind.annotation.JsonNaming;
import lombok.Getter;
import lombok.Setter;

@Getter
@Setter
//@JsonNaming(value = PropertyNamingStrategies.SnakeCaseStrategy.class)
public class Member {
    @JsonProperty("user_id")
    private String userId;
    private String pw;
    private String name;
    private String email;
    private String contact;

    @Override
    public String toString() {
        return "Member{" +
                "userId='" + userId + '\'' +
                ", pw='" + pw + '\'' +
                ", name='" + name + '\'' +
                ", email='" + email + '\'' +
                ", contact='" + contact + '\'' +
                '}';
    }
}

 

위 사진에서와 같이 이번에는 userId 까지 정상적으로 파싱 되어 전달된 것을 확인할 수 있습니다.

그러나, 1~2개 정도인 경우에는 해당 어노테이션을 사용하여 해결할 수 있겠지만

10~20개 이상이 된다면 필드 하나하나 추가하는 것은 코드도 길어지고 유지보수 면에서도 번거로운 작업이 됩니다.

이럴 때에 사용하는 것이 @JsonNaming 어노테이션입니다.

 

🔔 @JsonNaming 사용 예시

UserRequestDto에 있는 변수명들이 카멜케이스로 작성되어 있을 때 Request Body 값을 스네이크 케이스로 요청한다면

변수명이 일치하지 않아 값이 제대로 전달되지 않는다.

 

 

이럴 때 Jackson Library를 추가하여 @JsonNaming을 사용한다면...!

아래 예시처럼 카멜케이스로 작성되어있더라도 Postman에서 스네이크 케이스로 요청한다면

package com.example.shoppingmall.Member;

import com.fasterxml.jackson.databind.PropertyNamingStrategies;
import com.fasterxml.jackson.databind.annotation.JsonNaming;
import lombok.Getter;
import lombok.Setter;

@Getter
@Setter
@JsonNaming(value = PropertyNamingStrategies.SnakeCaseStrategy.class)
public class Member {
    private String userId;
    private String pw;
    private String name;
    private String email;
    private String contact;

    @Override
    public String toString() {
        return "Member{" +
                "userId='" + userId + '\'' +
                ", pw='" + pw + '\'' +
                ", name='" + name + '\'' +
                ", email='" + email + '\'' +
                ", contact='" + contact + '\'' +
                '}';
    }
}

 

 

 

값이 잘 전달된다...!

 

❓ ID 중복 검사

1) 중복 체크를 FE쪽에서 어떻게 할까? => ajax + jqueury : final 프로젝트

2) 회원가입 시킬 때 BE에서 중복체크를 해야 할까?

=> Client에서 중복 체크 요청 시와 실제 회원가입 시 db의 상태가 동일하지 않을 수 있으므로 중복 체크 시 해당 id에 대한 선점을 통해 db에 해당 id가 존재하지 않음을 보장할 수 있으나, 여러 id에 대한 중복 체크 요청등을 고려하면 실제 회원 가입 시점에서 다시 중복체크를 수행하는 것이 효율적이라고 생각한다.(김x우님의 의견 참조)

 

* 중복 체크 로직 구현

1) 중복 체크 API

2) 회원가입 요청 API가 오면 중복체크 로직 추가 구현(중복에 걸리면 if로 분기)

 

* FE & BE : 웹 취약점 악성 행위를 예방하는 방법.

• SQL injection
• XSS
• CSRF

 

❓ 비밀번호 암호화(로그인) FE vs BE