티스토리 뷰

아래는 발표준비 & 발표대본


1. 텍스트에디터에 이미지파일첨부시 이미지가 에디터에 안뜸 summernote onimageupload
summernote에서 제공하는 callback함수를 다시 분석해서 다시 코드를 짰다.. => 해결
base64로 저장되면 엄청 길게 나와서 db 저장 -> db무리-> summernote onimageupload 라는 함수를  사용하여 파일명/파일사이즈만 따로 추출
 -> db저장하는 방식으로 변경 (저장할때 파일명 중복방지를 위해 따로 검사코드) 
String savename = image.getOriginalFilename(); => 오리지널 파일명 저장

2. base64 -> 파일명으로 저장 리나언니 카톡참고
summernote는 base64로 인코딩 후 저장하는 방식이여서 이미지 파일 관리가 어려움
그래서 이미지를 업로드 했을때 지정한 경로에 이미지를 저장하고 화면에 띄워주는 기능을 구현함

써머노트에서는 몇개의 callback 함수를 지원하는데, 그 중 이미지를 업로드할 때 사용할 수 있는 callback 함수인
 onImageUpload 란 함수를 사용하여 이미지를 특정 경로에 업로드 후 고유한 url를 리턴하는 방식으로 해결함

3. 파일첨부 시 글 등록하지않아도 업로드 폴더에 이미지가 저장되는 issue
- 파일첨부하여 글작성하다가 취소버튼을 누를 경우, 파일명을 들고 dao와 연동시켜서
해당 파일명이 업로드폴더에 있으면 삭제해주는 메서드로 해결하였습니다.

4. vcode : 게시글마다 고유코드를 지정해주는 컬럼을 테이블에 추가해주고
new Date().getTime().toString(36)
글 등록버튼을 눌렀을때 시간을 36진수로해서 vcode로 저장해서 게시글 db등록/파일테이블의 연결성 확보
//vcode로 seq값 가져와서 파일테이블의 pseq 비교해서 
//방금 내가 등록한 게시물 찾으려고 씀



5 고캠핑API 키워드검색, 검색결과리스트페이지 출력
각자 다른 컴퓨터 환경에 따른 속도차이와 서버의 불안정함으로 인해 api를 db에 저장하게 되었습니다.
저희는 수도권 캠핑장 사이트이기때문에 서울시/인천시/경기도에 해당하는 캠핑장의 데이터를 추려서 가져왔고,

이때 어떤 태그의 데이터값이 하나라도 null 이면 오류가 나서 try catch를 사용하여 
null일 경우는 "default" 라는 임의의 값을 넣어주었고,

그 데이터를 arraylist에 담아 불러와서 테이블에 insert 시켜주었습니다.

getparmeter로 키워드검색어를 받아와서 그 검색어가 포함되는 데이터들을 불러올수있도록 하였습니다.

7. 카카오맵 API
- 여러개 마커를 지도에 올리는데 마커마다 오버레이를 생성/제어에 지금 오류
- for문에 넣으니까 오류나고 빼면 오류
- var i 배열에 넣어서 해결

8. 날씨 API
- 기상청API 이용
- URL로 불러오는데 인터넷 속도/서버상황 에 따라 다르기때문에
- 데이터불러오는 시간 단축방법 찾는중

6. cpage / 말머리 변경
- ajax로 말머리 변경 데이터 불러옴
이미 만들어진 페이징 메서드 사용하고자 했고,
말머리 선택 시 말머리에 해당되는 리스트 가져옴

근데 말머리가 안바뀌는 오류
근데 그게그냥 css selectpicker jquery 안먹음 오류였다 

9. 댓글 오류 ( 병찬이가 카톡에 보낸 사진 참고)
- div 자동으로 닫히는 현상 = HTML 친절
append 한줄한줄말고 한번에 + 로 연결해서 해결
- 댓글 json ajax 사용 

10. 댓글삭제

댓글단 회원의 ucode 와 삭제버튼을 누른 회원의 ucode를 비교하고, 
그 값이 같으면 댓글의 seq를 확인하고 해당 댓글을 삭제한다.

11 차주 일정
- [8/19 (금)까지] home 화면 기상청 API 활용 데이터 추가, 고캠핑 API, 카카오 지도API를 이용한 검색 구현 완료

-----------------




1p. 
1조의 4주차 진행상황 발표를 맡은 안소연입니다.

2p. 
금주에는 summernote API를 통해 텍스트 에디터를 완성하고,
게시판 말머리 선택에 따른 페이지 변경, 
게시판 별 페이징,
글쓰기, 댓글쓰기/댓글삭제, 
고캠핑API를 통한 키워드 검색 부분까지 구현하였습니다.
기술부분은 JSON 을 추가로 사용하였습니다.

3p.
summernote로 구현한 텍스트 에디터입니다.
summernote는 이미지를 base64로 인코딩 후 저장하는 방식이라 이미지 파일 관리가 어려웠습니다.
 
4p
따라서,
썸머노트에서 지원하는 몇개의 callback 함수 중
이미지 업로드 시 사용가능한
onImageUpload 란 함수를 사용하여 이미지를 특정 경로에 업로드 후 파일명/파일사이즈만 따로 추출하고,
DB에 저장하는 방식으로 변경하였습니다. (저장할때 파일명 중복방지를 위해 따로 검사코드) 

5p
이미지 첨부시 텍스트 에디터에서는 이미지가 보이지 않는 이슈도 있었는데
마찬가지로 onImageUpload 함수를 통해
파일첨부 시 바로 저장된 이미지의 고유한 url를 리턴하여 화면에 띄워주는 방식으로 구현했습니다.

6p.
파일을 첨부만 해도 업로드 폴더에 저장이 되므로,
파일 첨부 후 등록이 아닌 취소버튼을 누를 경우, 파일명을 들고 dao와 연동시켜서
해당 파일명이 업로드폴더에 있으면 삭제해주는 메서드로 해결하였습니다. 


7p
파일테이블과 게시글과의 연결성 확보를 위해, 각 게시글 별 고유코드를 컬럼 vcode로 추가해 주었습니다.
글 등록버튼을 눌렀을때 시간을 36진수로 바꾸어 vcode로 저장해서 게시글을 db에 저장하고,
파일을 첨부하여 글을 등록할 경우
해당 게시글 vcode의 seq와 파일의 pseq를 비교하여, 값이 같다면 파일이 insert 될 수 있도록 하였습니다.

8p.
각자 다른 컴퓨터 환경에 따른 속도차이와 서버의 불안정함으로 인해 api를 db에 저장하게 되었습니다.
저희는 수도권 캠핑장 사이트이기때문에 서울시/인천시/경기도에 해당하는 캠핑장의 데이터를 추려서 불러왔고,

이때 
어떤 태그의 데이터값이 하나라도 null 이면 오류가 나서 try catch를 사용하여 
값이 null일 경우는 "default" 라는 임의의 값을 넣어주었습니다.

그리고 그 데이터를 arraylist에 담아 불러와서 테이블에 insert 시켜주었습니다.

9p.
키워드 검색부분은
request.getparmeter로 키워드를 받아와서 select 문을 통해 그 검색어가 포함되는 데이터를 불러올수 있도록 하였습니다.

10p.
기상청 API를 통해 날씨정보를 받아오는 기능은 현재
인터넷 속도 / 서버상황에 따라 달라지는 데이터 출력시간의   단축방법을 찾고 있습니다.

11p.
ajax로 말머리 변경 데이터를 불러왔고, 이미 만들어진 페이징 메서드 사용하고자 했습니다.
말머리 선택 시 말머리에 해당되는 리스트를 가져오고, 페이지 변경시에도  말머리값과 cpage값을 같이 가져가도록 하였습니다.
( subjectvalue의 id = subjectInput )

12p.(ajax로 json을 받아옴)
댓글 작성 구현 중 div(디아이브이) 가 자동으로 닫혀서 디자인이 이상해지는 이슈가 있었는데, 
append한 div(디아이브이) 태그가 실수로 닫히지 않았다고
판단한 html이 태그를 자동으로 닫아버려서 생긴 오류였습니다.
플러스로 연결해주어서 해결하였습니다.

13p.
댓글단 회원의 ucode 와 삭제버튼을 누른 회원의 ucode를 비교하고, 
그 값이 같으면 댓글의 seq를 확인하여 해당 댓글을 삭제합니다.

14p.
차주 일정입니다.
API를 활용한 모든 기능들을 완성할 예정입니다.

이제 사이트 시연을 하겠습니다.

-----------


미리 피피티뒤에 아캠두잇 들어가서 띄워놓고 피피티끄지않은 상태에서 인터넷버튼 클릭하기
=> 사이트 시연할것
1. 키워드 검색 : 서울 검색하기
2. 게시판 말머리 선택 보여주기
3. 글쓰기 들어가서 글쓰기..
4. 후기게시판 2PAGE가서 댓글지우고 쓰기)



1. 홈화면에서 키워드(서울)를 검색하면 해당하는 캠핑장 리스트가 출력됩니다.
데이터에 대표이미지가 없는 경우 저희로고를 넣은 대체이미지를 넣어주었습니다.

2. 게시판 진입시 첫 디폴트 화면은 후기게시판이고,

3. 다른 말머리선택시 해당 리스트로 변경됩니다.

4. 글쓰기에서 입력칸을 전부 채우면 정상 등록됩니다.

(후기게시판 2PAGE가서 댓글지우고 쓰기)
5. 다른사용자의 댓글은 지워지지않고, 내가 쓴 댓글만 삭제됩니다.


이상입니다.

혹시 질문 있으신가요?


 

너무너무 떨려서 손까지 떨렸지만

칭찬을 받아서 기분이 매우매우 좋았다고 한다

 

열심히 하자!!!!!!!

 

공지사항
최근에 올라온 글
최근에 달린 댓글
Total
Today
Yesterday
링크
«   2025/05   »
1 2 3
4 5 6 7 8 9 10
11 12 13 14 15 16 17
18 19 20 21 22 23 24
25 26 27 28 29 30 31
글 보관함