Hoguz

오늘자 업데이트

# nav바 최적화 , 로그인시 문구 수정

# 로그인시 logout 버튼 생성

# 게시글 수정, 조회 구현

# 등록버튼 어디갔지...

책 보면서 찾아가면서 조금씩 개발하려 하니

무엇보다 가장 큰 문제는 에러...

분명 똑같이 했다고 생각했지만 살짝 다른 몇가지 때문에 발생한 에러는 시간을 많이 잡아 먹는다..

오늘의 첫번째 에러는 

Could not set parameters for mapping: ParameterMapping

글 수정 후 수정 버튼을 누르면 발생하는 에러였다.

처음에는 null이 많아서 그런건가 싶었는데.. 아뿔사 mapper에 parameterType이 int로 되어있었다(vo를 받아야 하는데)

이렇게 에러 하나 잡아간다..

페이지 조회, 수정, 삭제는 기존에 모달 형식으로 했기에 새롭게 다가왔다.

지금 가장 큰 문제가 uri 주소를 만드는 건데

Restful하게 만들자고 최대한 get, post, put, delete를 사용하려 하는데 이게 잘 안된다.

특히 put, delete..이건 따로 설정해줘야한다.

https://hue9010.github.io/spring/Spring-MVC-PUT,-DELETE-%EC%82%AC%EC%9A%A9%ED%95%98%EA%B8%B0/

위 링크를 참고하면 되는데...

나는 항상 안된다.

그래서 일단 글자 하나 줄여서 바꾸어놨다..

오늘 좀 신기했던 것은, 버튼의 클래스를 사용하여 form의 메서드와, action을 다르게 줄수 있다는 점.

아 추가적으로 등록하는 것 때문에 계속 리눅스를 만지게 되서 기분이 좋다.

한편으론 / 이 슬래쉬의 역할이 되게 궁금 했는데

http://booolean.tistory.com/400

이 분 블로그가 잘 정리되어있어서 .. 경로가 궁금하면 들어가보는게 좋다

서비스를 런칭 했으니 오늘부터 1일차.. 라고 생각중 ㅡ,.ㅡ;;

(언제부터 했는지 까먹어서...)

파일 업로드와 회원가입 만 덩그러니 올린채 돌아가고 있는 내 서비스..

일단 게시판을 구현 하고

마이페이지 구현 후 캘린더 기능을 만드려 한다.

어제 오늘 기본적인 것들만 좀 확인하고 있는데

제일 답답한 부분은 CSS 부분.. 모르는 것도 많고 안되는 것도 많고 해서 여기 건드리기 시작하면 시간을 정말 오랫동안 먹고 있는다.

About 부분 수정하려고 했으나 footer가 body랑 겹치는 현상이 발생해서 footer를 없앨까 고민 중.

게시판 구현을 위해 DB도 추가 및 수정을 했는데

문제가 하나 발생하였다.

tb_bbs를 파일 업로드 전용으로 했다가

category 칼럼만 추가하여 차후에 여러 목적으로 사용하게끔 변형하였다.

문제는 tb_bbs에 게시판 내용이 들어가는데, 이를 불러오게 되면 넘버링이 달라진다.

tb_file 처럼 tb_bbs를 extends 하는 다른 bbs 테이블을 만들까 고민 하다가

이를 view로 처리해보자 라는 생각으로 도전중...

오늘도 동쪽으로 구글님을 향해 절 세번 한다..

사진 올리면 두장씩 올라가고

자꾸 눕는다.. 이거 설정해놨는데 진짜 왜그러지

http://lets.todaysworkout.ga/

무료 도메인 호스팅을 통해 DNS도 연결 하였다.

프로젝트를 진행하면서 가장 긴장된 하루였다.

리눅스를 따라하면서 똑같이 안될때, 나만 안될때, 이런식의 쫄깃함이 존재해서 그런듯 하다.

다행히 이것저것 섞어서라도 할 수 있었다...

오늘은 war 파일을 배포하기 위한 세팅? 과 과정이 주였다.

지난번 빌더스의 경우 내가 이 부분을 담당하지 않았기에 이번에 많이 좀 해맸다.

특히 지난번 aws로 배포할때는 aws가 윈도우를 지원하여서.. 정말 편하게 진행했는데

이걸 리눅스로 하려니 그저 걱정만...

어제 jdk, tomcat까지 설치하였기에 오늘은 업로드 폴더 생성, 권한 부여, 그리고 war 배포.. 이렇게가 주였다.

1. 파일 업로드를 위한 경로를 생성하자

/usr 아래에 upload를 따로 만들었다(프로젝트 상에서도 경로를 바꿔줘야한다)

mkdir /usr/upload

* 그런데 파일 업로드의 경우에 보안상에 문제가 있기에 이를 꼭 염두해야한다고 한다..

나에겐 아직 과분한 부분이긴 하나 꼭 신경써야한다고 하니.. 흠..

2. 위에서 경로를 생성했어도 권한이 없다. 읽고, 쓰고 해야하는 권한...

실제로 내 코드상에선 일별로 폴더가 생성이 되야하기에 권한을 다 풀어줘야 했다.

2.1) 이를 진행하기 위해서 유저를 따로 생성해준다. 나는 어제 생성한 tomcat8이 있으므로 이는 skip...

sudo useradd 유저명

2.2) 위에서 생성한 유저로 권한을 부여

sudo chown -R tomcat8: 별칭 /usr/upload

2.3) 그리고 이 폴더에 대한 권한을 다 풀어준다.

chmod -Rf 777 /usr/upload

3. 마지막으로 war파일을 추출하여 서버에 올린다. 그리고 tomcat 설치 폴더 아래에 webapps에 그대로 넣어주고

톰캣을 껏다가 다시 키면 알아서 배포가 된다.

- 구글 클라우드는 업로드 기능이 있어서 이 부분은 딱히 어렵지 않았다

- 다만 파일을 올린후 mv로 옮기는데, 이게 옮겨지다가 내 실수로 인해 파일명이 바뀌는 경우도 있어서..

파일이 없어진것 처럼 보이기도 하였다.

- 그리고 ip 뒤에 포트를 없애기 위해 프로젝트 상에서 80으로 포트를 변경하였고 이를 제대로? 적용하기 위해서

war 파일명을 ROOT.war로 바꿔서 webapps에 넣었다.

(이 부분에 대해선 더 확인해봐야겠다)

- 리눅스 명령어를 많이 쳐봤는데 손에 익으면 진짜 편하겠다는 생각이 많이 든다.

- 자주 업데이트를 할때마다 계속 이렇게 해야하나 싶기도 하고.. 방법을 찾아봐야한다

(tomcat manager가 왜 안되는지 모르겠다, 설정도 잡아줬는데)

- 이제 앞으로 해야할 일은 기능 추가하고, 성능 더 빠르게 하고... 키워나가야지..

제목은 클라우드 서버 설정이지만 실제론 그냥 서버에 이것저것 설치하는 것이다.

하지만 리눅스와 안친한 나에게.. 그리고 대부분의 초심자에게.. 리눅스는 너무나 먼 존재이다.

http://tastydarr.tistory.com/245?category=710993

http://gblee1987.tistory.com/25?category=549227

위 두개는 리눅스에 설치하는 것에 대한 설명

http://archive.apache.org/dist/tomcat/tomcat-8/v8.5.31/bin/apache-tomcat-8.5.31.tar.gz

위는 아파치 주소이다.. 이것도 못찾았음 처음엔..

아래는 구글 클라우스 포트 설정에 대한 블로그

http://gusrb.tistory.com/50

나는 우분투 14.04로 설치를 진행했는데 이럴 경우 몇몇 안되는게 있다(지원이 안되는 버젼이라)

그렇기에 가능하면 상위 버젼으로 진행하길 바람.. 나는 왜 14로 했을까 ㅠㅠ

일단 14로 진행하면 pacakage로 jdk가 설치가 안되서

https://stackoverflow.com/questions/32942023/ubuntu-openjdk-8-unable-to-locate-package

위 링크 참조해서 진행하였다.

우분투에 설치해야하는 것은 이러하다.

1. JDK

2. tomcat

* 편집기(vim) 이정도... 매우 간단한데 되게 어려웠음.. ㅎㅎ;;

그리고 root 계정이 아닌 곳에서 진행해서 sudo로 항상 명령어를 줬어야했다.

이걸 거의 마지막에 깨닫음... 항상 root로 진행하자.

1. 우분투에선 apt가 설치 도우미이다(centos는 yum인가 그럼)

그러니 apt update부터 하자

sudo apt-get update

2. 편집기를 설치하자(vim) : 각종 환경설정 등의 문서 편집을 위한것. 별거 아님

sudo apt-get install vim

3. jdk을 설치하자 : 나는 jdk8로 플젝이 진행됬으므로 jdk8로 설치함

sudo apt-get install openjdk-8-jdk

근데 나는 이게 안되서 위에 스택오버플로우를 참고해서 진행하였다. unable package가 계속 떠서...

아마 우분투 버젼 문제인듯 하다.

그리고 3번 과정이 끝나면 버젼 확인

java -version

4. 톰캣을 다운 받자.

wget 톰캣 주소

위에 http 로 가서(http://archive.apache.org/dist/tomcat/tomcat-8/v8.5.31/bin) 여기서 tar.gz로 끝나는 확장자를 다운받자

아, 나는 8버젼이라서 8버젼을 찾았다.

그리고 deployer로 되잇는건 다운받으면 안된다. 뭔지 모르겠는데 빈약하다.

5. 알집을 풀자

tar -zxf 다운받은파일명.확장자

6. 여기서는 블로그를 막 섞어가면서 했는데

나는 바로 bin으로 가서 ./startup.sh 로 톰캣을 실행 시켰다.

7. 이제 내 클라우드 외부 ip:8080으로 접속을 하면 되는데...

포트를 안 열어놓는다면 접속이 안되니 포트를 열도록 하자(위에 블로그에 방법이 잘 설명되어있다.)

ip주소는 항구 주소, 포트는 선착장 번호... 

이제 남은건 업로드 폴더 만들고, 경로 만들고, war 파일 올려서 서비스 되는지 확인 후에 도메인 연결 하는 것이다.

와 말로 쓰니까 엄청 쉬워보인다.

비밀번호 복호화도 해결 하였고

자동 로그인 체크도 일단은 가능하게 둠.

실제 되는지는 더 두고봐야할듯.

지난번에 이상하게 에러가 나는 부분은 다른 객체를 가져와서 그렇게 됬는데..

어쨋든 1차적으로 뿌릴 준비는 끝남.

문제는 서버 설정...

이번에는 구글 클라우드로 도전!! 하는데

우분투에 jdk가 설치가 안됨.

unable to install...

두번째 걱정 되는건 파일 업로드 패스를 어떻게 잡아줘야할지..

기존엔 그냥 C드라이브로 했는데 이걸 우분투에서 잡아준다면 흠..

지난번에도 고생했떤 에러인데 오늘 또 등장하였다.

이 에러가 발생하는 근본적 원인은 트랜잭션이 이뤄지지 않아서이다

(로직을 설명하면 부모에게 insert 한 후, 부모의 값을 가져와서 다시 insert 하는 순서이다)

왜 잘 되던게 안되는가 했떠니..

context에서 component-scan을 기존에 ....controller 에서 .....* 으로 바꿔서였다.

아직도 이게 왜 그런지는 모르겠다...

추가로 오늘 자동 로그인 처리를 함.

근데 인터셉터로 안돌아가고 있어서 정리가 좀 필요함...

오늘 자동 로그인 + 암호화 하고

내일 네이버 서버 세팅 하면 서비스 가능할듯 ㅅ ㅅ

메인 부분을 바꿧다.

1. 네브바를 기존의 것에서 다르게 바꿈.

기존 네브바의 경우 업로드 버튼이랑 자꾸 충돌 아닌 충돌이 나서 기본 틀로..

2. 사진 업로드시 사진 크기에 따라서 사이즈를 재 조절하게끔 바꿈.

이게 실제 되긴 되는데 다양한 경우에 맞춰봐야해서 좀더 지켜봐야할 듯

현재 중간 결과.. ㅋㅋ 

의도치 않은 호야 게시판이 되고 있다.

썸네일 올리는 방식을 오리지날 방식으로 바꾸었고

쟤네가 왜 눕는지좀 알아내야함..

일주일을 해맸다. 정확히 말하면 5일.

결론을 얻은것 같았는데 다시 원점으로 돌아오기를 반복... 그래도 결국 답을 찾아냈다.

(스프링 버젼은 4.3, jdk는 1.8, tomcat은 8.0 버젼을 사용중임)

방법은 크게 두가지 이다.

하나는 servelt-context에 resourec 경로를 지정 하는 것

다른 하나는 reponseEntity로 응답 하는 것.

두개의 방법도 백단에서는 사실 문제가 안됬다.

문제가 된 부분은 jsp에서 보여줄때...

특히 첫번째 방법은 불가능 한줄 알았는데 가능하게 나와서 좀 놀랐다.

위에 처럼 리소스 경로를 등록해준다. 이거는 몰랐던게 아닌데 location이 다르다. file을 명시하고 뒤에 들어간다. 백슬래쉬가 3개라는 것도 포인트

그리고 다음은 위에 처럼 <spring:url value = '/image/파일명'/> 으로 불러온다. 이게 진짜 핵심..

이거를 이번에 구글링 하면서 처음 봤다. 위에서 /image는 결국 C:/test를 뜻한다. (실제로 경로와 파일이 있따)

** 그리고 spring을 사용 하려면 제일 위에 taglib을 설정해줘야한다.

<%@taglib uri="http://www.springframework.org/tags" prefix="spring"%> 

두번째 방법은 ResponseEntity이다.

실제로 카페에서 방법을 물어봤을때 두번째 방법을 사용하라고 하였다. 

크롬? 에서도 로컬 폴더에 접속하는 것을 원천적으로 막기 때문에 위에처럼 등록하고 사용해야 하는데, 아무래도 보안상의 이유때문에

두번째 방법을 선호하는 것 같다.

위 코드는 단순히 파일을 불러온다. 미리 등록해놓은 uploadpath를 통해서 경로를 확인 한 후에 있으면 맵으로 넣는다.

이 친구는 기존의 책에 있는 코드와 동일하다. 다만 requestParam으로 name을 받아와야 한다. 

<img src = "/display?name=${data.value.f_path}"/>

이렇게 사용해야 하기 때문

이러면 끝이다.

위 두방법으로 하면 아래처럼 사진이 나온다!!

자세한 코드는 깃헙에 올려두었다.

https://github.com/homekeeper89/friend_workout

현재 로그인, 이미지 업로드, DB 저장 등이 모두 다 구동 된다.

이제 핵심은 메인 페이지에서 업로드한 이미지들을 가져오면 된다.

매우 쉽게 생각했다.

이미 DB에 경로가 저장 되어있으니 그거 그대로 가져오면 되는 것 아닌가.

그런데 안된다.

아오 지금 이것때문에 이틀이 날라가고 있다.

크게 두가지로 접근 중이다.

하나는 어차피 이미지가 로컬경로에 있으니 로컬경로로 접근하여 가져오자.

-> Not allowed resource... 크롬에서 보안 문제로 바로 접속이 불가하다고 한다.

이를 수정하기위해 context path를 수정중인데 그래도 안된다..

두번째는 버퍼 스트림으로 그대로 읽어 오는 것인데

이것또 안된다. 컨트롤러에서 버퍼로 가지고 와도 이걸 jsp에서 어떻게 뿌려줘야할지 모르겠다...

ㅠㅠ

# 질문한 결과 로컬로 접근하는 것은 잘못됬으며

버퍼이미지를 그대로 갖고와서 뿌려주면 된다고 한다.

갖고오는것은 쉬운데 jsp에서 어떠헥 뿌려야할지 모르겠따.

# img 태그를 보면 src는 주소값이다.. 

나는 ResponseEntity byte[]로 가져온 값을 jsp 내에서 재조립 하려고 하는데 이게 잘 안된다.

<c:forEach items="${fdata}" var="data" varStatus="cnt">

<h2> ${data.value}</h2>

<img src = "data:image/jpeg;base64,${data.value}" alt="..." width="200" height="200" />

<img src="data:image/jpg;base64,<c:out value='${data.value}'/>" />

<img src="data:image/jpg;base64,${data.value}">

<h2> hell</h2>

    </c:forEach>

이런 식으로 구성중인데 되지 않는다.

아무래도 src 내에 컨트롤러를 불러와야하나보다.

http://hellogk.tistory.com/129

여기에 나와있는 방법을 참고해야겠따..

src에 컨트롤러를 불러오게 된다면 현재 파일을 가져와서 byte로 구성하는 로직을 바꿔야한다.

근데 또 문제 하나가 없는 파일이 있는 경우가 있어서.. 

위에 로직은 20개를 가져오고 그중에서 있는 파일만 접근해서 byte로 구성하게 했는데..

이걸 다시 바꾸면 어떻게 접근해야할지 감이 안잡힌다.

그냥 열심히 파일관리를 해야겠다 라는 생각이 든다..