Book Store 수정사항 목록

Vue.js

1. bookStore 메인화면에서 책 클릭 시, 한번씩 깜박거리며 책NAV가 나오는 현상 수정

이제는 한번씩 깜박거리지 않고 잘 나온다!

 

Spring boot

(07.13)

1. 프로필 이미지 저장경로 & 이미지 이름 변경

 

저장경로를 BookStoreAPi 밑 profile_img로 

# file path
profileImg.path = C:/Spring/BookStoreApi/profile_img/

 

Member Service의 파일업로드 부분

   //프로필 등록
    public String saveProfile(String email, MultipartFile multipartFile) {
        Optional<Member> member = memberRepository.findByEmail(email);
        Member data = member.orElseThrow(() -> new RuntimeException("no data : find member by email"));

        String imgFileName = Timestamp.valueOf(data.getCreateDate().atStartOfDay()).getTime() + data.getMid() + "profile.jpg";
        Path imgFilePath = Paths.get(uploadFolder+imgFileName);

        if(multipartFile.getSize() !=0){
            try{
                Files.write(imgFilePath, multipartFile.getBytes());
            } catch (Exception e){
                e.printStackTrace();
            }
            data.updatePicture(imgFileName);
            Member result = memberRepository.save(data);
            return result.getProfilePicture() +"사진을 저장했습니다" ;
        }
        return null;
    }

파일 이미지 이름을 기존 mid+파일이름 에서 타임스탬프로 변환한 생성날짜 + mid + profile.jpg 형식으로 변경

프로필 사진은 계정당 하나이고 (새로 업로드 되면 이전 사진은 삭제) 

(임시)

댓글을 불러올때 member테이블에서 이미지를 검색해서 프로필 사진을 받아오는 것이 아니라

파일 이름으로 받아오기 때문에 이미지 이름을 통일시켰다.

(이유는 이미지 이름이 변경되면 사진을 찾을 수 없어서다)

 

>>

member테이블이랑 N:1관계로 빼올 수 있지만 이전에 코드들을 다 수정해야해서...

관계를 생성하고 JPA코드로 가져오면 중요한 개인정보까지 다 들고온다. 따라서 nativeQuery로

원하는 컬럼만 빼와야한다.

후에 시간이 되면 수정예정

 

 

 

(07.14)

2. Jar파일 빌드 후 로그아웃 처리시 undefined 에러 

로그아웃 처리시 successHandler 에서 로그아웃 토큰을 처리하는 것 까지 log에 찍힌걸 확인했는데 그 후에

웹 콘솔창에 undefined 에러가 발생하며 Store로 넘어가지 않았다.

이유는 핸들러에서 지정한 URL이 Vue에서 개발할때 사용한 URL이어서...

 	@Bean
    public LogoutSuccessHandler logoutSuccessHandler() {
		CustomLogoutSuccessHandler logoutSuccessHandler = new CustomLogoutSuccessHandler();
        // logoutSuccessHandler.setDefaultTargetUrl("http://localhost:8080/#/");
         logoutSuccessHandler.setDefaultTargetUrl("/"); //으로 바꿔줬다
        return logoutSuccessHandler;
    }

후에는 로그아웃 처리 후 Store에서 회원정보를 삭제처리까지 정상적으로 동작했다.

 

(07.27)

1. Vue.js - 책 상세보기 오류수정

내용 : 상새보기 하단의 책 추천에서 책을 선택하면 -> 선택한 책의 댓글과 추천을 가져와야 하는데 갱신이 안되는 현상 수정
해결 : comment 컴포넌트와 recommend컴포넌트에서 route값 변경을 감지하여 새로 데이터를 받아오도록 watch에 작성

 

2. delete in 쿼리 변경

Spring boot JPA : Delete In

 

 

3. 기존 img > v-img로 변경

 

<v-img
	...
>
    <template v-slot:placeholder>
      <v-row
          class="fill-height ma-0"
          align="center"
          justify="center"
      >
        <v-progress-circular
            indeterminate
            color="black lighten-5"
        ></v-progress-circular>
      </v-row>
    </template>
</v-img>

이미지 로딩중 이벤트를 넣기 위해서 기존 img를 vuetify 에서 지원하는 img태그로 변경해주었다.

v-img의 placeholder 슬롯에 동작을 추가하면 된다

 

 

(08.12)

프로필 사진 수정시 (업로드) 새로고침 현상 수정

BookStore 프로필 업로드 새로고침 현상 수정