물고기 개발자의 블로그

웹 사이트에서 PC 환경에서 접속했는지

모바일에서 접속했는지 확인하기위해 적는 코드로 주로

반응형웹일때 모바일로 들어왔을때 스크립트 나 css 조작을 다르게 해야할때 사용했던것같다

최근 개발 중 PC, MOBILE 을 구분하여 처리하는 로직에서 오류가 발생하였습니다.

결제 모듈을 호출하는 부분에서 PC 모듈을 호출해야 하지만 MOBILE 모듈을 호출하여 발생한 문제였습니다.

지금까지 잘 되던게 왜 갑자기 안될까?

의문을 갖고 PC, MOBILE 구분 함수를 찾아보았습니다.

함수는 아래와 같이 코딩되어 있었습니다.

(인터넷에서 많이 볼 수 있는 코드죠..)

-- JavaScript

var filter = "win16|win32|win64|mac";

var vWebType = "";

if (navigator.platform ) {

if (filter.indexOf(navigator.platform.toLowerCase()) < 0) {

vWebType = "MOBILE";

} else {

vWebType = "PC";

}

}

-- 사용자 User-Agent 는 아래와 같았습니다.

mozilla/5.0 (macintosh; intel mac os x 10_12_3) applewebkit/537.36 (khtml, like gecko) chrome/56.0.2924.87 safari/537.36

예전에는 User-Agent 로 MOBILE 인지 아닌 지 체크를 많이 했었는데 (아닌가요..? -.-;;) 모바일 디바이스의 종류가 매우 방대해짐에 따라 

PC, MOBILE 체크 시에 MOBILE 인지 아닌지 보다는 PC 인지 아닌지 여부로 체크를 하는 게 보편화된 것 같습니다.

아무튼 지금까지는 위 처럼 사용되는 로직에 문제가 없다가 왜 갑자기 발생된 걸까요?

찾아보니 PC 종류 하나가 빠져있었습니다.

Javascript Navigator 의 Platform 정보로 조회 되는 PC 기기는 아래 5가지 종류입니다.

Win16 : 16비트 윈도위기반 컴퓨터

Win32 : 32비트 윈도위기반 컴퓨터

Win64 : 64비트 윈도위기반 컴퓨터

MacIntel  :  인텔CPU 를 가진 매킨토시 컴퓨터

Mac : 매킨토시컴퓨터

위의 5가지의 디바이스 정도가 PC 로 접속 시 조회 가능한 Navigator Platform 의 값입니다.

이 외의 것은 모바일로 봐도 될 거라고 합니다.

이렇게 찾아보니 하나가 빠졌더군요. 

MacIntel  :  인텔CPU 를 가진 매킨토시 컴퓨터

.... 매킨토시는 매킨토신데 CPU 가 인텔 꺼랍니다..

var filter = "win16|win32|win64|mac|macintel";

로 변경하여 처리 완료되었네요.

참고로 Navigator Object 의 Properties 관련 내용 메모해 보겠습니다.

콘솔이나 알럿으로 확인 가능하겠습니다.

ex: console.log(navigator.userAgent);

navigator.appCodeName : 웹브라우저 코드이름

navigator.appName : 웹브라우저 이름

navigator.appVersion : 웹브라우저 버전

navigator.cookieEnabled : 웹브라우저 쿠키 사용 가능 유무

navigator.language : 웹브라우저 언어

navigator.onLine : 사용자 온라인 상태 여부

navigator.platform : 플랫폼

navigator.userAgent : 브라우저 구분값(웹브라우저 이름 전체)

출처: http://thingsthis.tistory.com/162 [여행과 일상]

PC에서 모바일 페이지로 이동하기 입니다.

보통 PC와 모바일 버전이 따로 있는 경우 ( 레이아웃 반응형이 아닌 별도의 페이지의 있는 경우) 에는 모바일 페이지 URL을 따로 사용한다.

m.url.com 이라던지 url.com/m/main.do 등의 컨셉을 사용할 때 적용하는 방법!

모바일 디바이스를 확인하는 소스는 매우 흔한듯..

다음과 같이 적용하면 매우 쉽게! 적용 가능~

메인 JSP 파일이나, JAVA에서 적용하면 될 듯 쉽다..(JSP에서만 해봄..)

출처: http://devofhwb.tistory.com/50 [이든의 생활코딩]

Jquery 셀렉터로 특정 단어로 시작해서 특정 단어로 끝나는

(ex: a-xxxx-b)

값을 지정할수있다

예제

추가로 자주 사용하는 셀렉터를 정리해 보았다

2.JSP

이외에도 맵 리스트등의 데이터도

getAttribute로 객체형태로 받아서 캐스팅만 잘해주면 손쉽게 받을수있었다

아래는 링크드 리스트를 만드는 방법에 대해 설명한다

출처: https://blog.perfectacle.com/2017/08/06/linked-list-making/

List는 데이터를 순차적으로 저장하므로 선형 구조(한 줄로 계속 되며, 데이터가 끊어지지 않음)이다.
또한 여기서 말하는 노드는 하나의 데이터 덩어리라고 보면 될 것 같다.

LinkedList란…?

LinkedList는 스택의 다음과 같은 단점을 극복하고자 만들어졌다.

• 노드의 끝 부분을 제외한 곳에 데이터 삽입
  스택은 끝 부분에만 데이터를 삽입할 수 있으므로 중간에 데이터를 삽입할 방법이 존재하지 않았다.
  LinkedList는 배열의 이러한 단점을 노드(배열의 각 요소)가 다음 주소지를 알게 함으로써 그 단점을 극복하였다.

하지만 신은 공평하듯, 이 LinkedList에도 다음과 같은 장/단점이 있다.

• 데이터의 접근 속도가 느리다.
  LinkedList는 다음 노드에 대한 참조만을 가지고 있다.
  따라서 255 번째 노드의 데이터를 불러오려면 처음부터 순차적으로 255 번째 노드까지 접근해야한다.
  배열에 비해 이러한 접근 속도가 매우 느리다.
• 다음 노드에 대한 참조만 있을 뿐, 이전 노드에 대한 데이터는 없다.
  따라서 이전 노드의 값을 가져올 수는 없다.
  이는 Doubly Linked List라는 이중 링크드 리스트라는 자료구조를 만들어 해결하였다.
• 처음 노드에서 마지막 노드로, 혹은 마지막 노드에서 처음 노드로 가려면 시간이 오래 걸린다.
  Doubly Linked List를 이용해도 순차적인 접근 밖에 되지 않기 때문에 어쨌든 계속해서 노드들을 타고 타고 끝이나 처음으로 이동해야 한다.
  이러한 단점을 극복하기 위해 처음 노드에 대한 이전 참조를 마지막 노드로, 마지막 노드에 대한 다음 참조를 처음 노드로 이어줘 원형 구조로 만든 Doubly Circular Linked List가 있다.

따라서 이 LinkedList를 잘 살리려면 중간에 삽입/삭제가 빈번하며 검색을 자주 하지 않는 자료를 담을 때 사용해야한다.

만들어보자!

먼저 기본적인 Node부터 만들어보았다.

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
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56

class Node {
    private Object value;
    private Node next;
    Node(Object o) {
        this.value = o;
    }
    public Object getValue() {
        return value;
    }
    public void setValue(Object o) {
        this.value = o;
    }
    public Node getNext() {
        return next;
    }
    public void setNext(Node next) {
        this.next = next;
    }
    boolean isLast() { // 마지막 노드인지
        return this.next == null;
    }
    public boolean equals(Node node) { // 내용물과 참조하는 애가 같은지
        return value.equals(node.getValue()) && next == node.getNext();
    }
}
class NodeTest {
    public static void main(String[] args) {
        Node n = new Node(2);
        Node n2 = new Node(2);
        Node n3 = new Node(2);
        Node n4 = new Node(3);
        n.setNext(n4); // n 다음에 n4
        n2.setNext(n4); // n2 다음에 n4
        n3.setNext(n); // n3 다음에 n
        System.out.println(n.equals(n2)); // true
        System.out.println(n.equals(n3)); // false
        System.out.println(n.isLast()); // false
        System.out.println(n4.isLast()); // true
        // 지금 구조(List)는 n3(2) 다음에 n(2) 다음에 n4(3) 순으로 연결(Linked)돼있다.
        // 초기 노드를 지정해주고, 계속해서 다음 노드를 참조하는 걸 증감식에 적어줌,
        for(Node node = n3; true; node = node.getNext()) { // 탈출 조건이 있는 무한 반복문
            // 마지막 노드여도 출력까지는 해줘야함.
            System.out.println(node.getValue()); // 2 2 3
            if(node.isLast()) break;
        }
    }
}

그 다음엔 LinkedList를 만들어보았다.

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
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114

class LinkedList {
    private Node[] nodes;
    private int idx; // 현재 리스트의 몇 번째 요소까지 노드가 들어왔는지 확인하는 변수
    LinkedList() {
        this(10); // 기본적으로 10개를 만들어주자, 너무 작게 만들면 복사하는 처리 비용이 많이 들테니...
    }
    LinkedList(int size) {
        nodes = new Node[size];
    }
    void add(Object o) { // 맨 끝에 삽입하는 경우
        int size = size();
        Node node = new Node(o);
        // 꽉차지 않았다면
        if(idx != size)  nodes[idx] = node; // 현재 인덱스에 노드 삽입.
        else { // 꽉 찼으면
            Node[] tmpNodes = new Node[size+10]; // 나중에 또 금방 복사하지 않게 적절하게 큰 배열을 만들자.
            for(int i=0; i<size; i++) tmpNodes[i] = nodes[i]; // 기존의 값들을 새로운 배열에 복사
            tmpNodes[idx] = node; // 새로운 값 삽입
            nodes = tmpNodes; // 복사한 배열을 원본 배열 변수로 갈아치우기
        }
        if(idx == 0) {
            idx++;
            return; // 하나만 넣은 거면 참조 관계를 수정할 필요가 없음.
        }
        nodes[idx-1].setNext(nodes[idx++]); // 이전 노드의 참조를 현재 노드로 변경
    }
    void add(int idx, Object o) { // 인덱스를 지정해 해당 지점에 삽입하려는 경우
        // List는 선형구조이므로 데이터를 삽입해야할 인덱스보다 더 뒤에 노드를 삽입하는 것은 불가능하다.
        // 당연히 배열의 인덱스를 벗어나는 음수도 불가능하다.
        if(this.idx < idx || idx < 0) throw new ArrayIndexOutOfBoundsException("올바른 인덱스를 입력해주세요!");
        // 배열의 중간에 노드를 삽입하는 게 아닌 경우
        if(idx == this.idx) this.add(o);
        else { // 배열의 중간에 노드를 삽입하는 경우
            int size = size();
            Node node = new Node(o);
            // 꽉 차지 않았다면 기존과 동일한 사이즈의 배열 생성, 아니라면 넉넉히 길이가 10 더 긴 배열 생성.
            Node[] tmpNodes = idx != size ? new Node[size] : new Node[size+10];
            // 복사할 배열을 직접 넘겨줘서 추가하기.
            for(int i=0; i<idx; i++) tmpNodes[i] = nodes[i]; // idx 이전까지는 그대로 복사
            for(int i=idx; i<this.idx; i++) { // last까지 복사
                tmpNodes[i+1] = nodes[i]; // idx 이후는 한 칸씩 밀어서 복사
            }
            tmpNodes[idx] = node; // 새로운 배열에 지금 들어온 노드 삽입
            nodes = tmpNodes; // 복사한 배열을 원본 배열 변수로 갈아치우기
            nodes[idx].setNext(nodes[idx-1].getNext()); // idx 노드는 중간에 끼어들었으므로 idx 노드 이전 노드의 참조를 가리켜야함.
            nodes[idx-1].setNext(nodes[idx]); // idx 이전 노드의 참조는 idx 노드를 가리키고 있어야함.
            this.idx++;
        }
    }
    void remove() {
        nodes[--idx] = null; // 마지막 노드 삭제 후 인덱스 1 낮춤.
        nodes[idx-1].setNext(null); // 이전 노드가 마지막 노드이므로 참조할 노드가 없음.
    }
    void remove(int idx) {
        Node[] tmpNodes = new Node[size()]; // 배열을 한 칸씩 땡겨야하므로 새롭게 배열 생성.
        Node node = getNode(idx).getNext(); // idx 번째 노드가 갖고 있는 참조 노드
        for(int i=0; i<idx; i++) tmpNodes[i] = nodes[i]; // idx 이전까지 복사
        for(int i=idx+1; i<this.idx; i++) tmpNodes[i-1] = nodes[i]; // idx 이후로 또 복사
        nodes = tmpNodes; // 복사한 배열을 원본 배열 변수로 갈아치우기
        nodes[idx-1].setNext(node);
        this.idx--;
    }
    Object get(int idx) {
        Node node = getNode(idx);
        return node == null ? null : node.getValue();
    }
    Node getNode(int idx) {
        Node node=nodes[0];
        // idx까지 계속 다음 참조 노드를 구함.
        for(int i=0; i<idx; i++, node=node.getNext());
        return node;
    }
    int size() {
        return nodes.length;
    }
}
class LinkdedListTest {
    public static void main(String[] args) {
        LinkedList l = new LinkedList();
        l.add(1);
        l.add("a");
        System.out.println(l.get(0)); // 1
        // 0번째 노드를 구하고 그 참조 노드를 구하고 값을 얻기
        System.out.println(l.getNode(0).getNext().getValue()); // a
        for(int i=0; i<10; i++) l.add(i); // 1 a 0 1 2 3 4 6 7 8 9
        System.out.println(l.get(11)); // 9
        l.add(11, 22);
        System.out.println(l.get(11)); // 22
        LinkedList l2 = new LinkedList();
        l2.add(1);
        l2.add(2);
        l2.add(3);
        l2.add(4);
        System.out.println(l2.get(3)); // 4
        l2.remove();
        System.out.println(l2.get(3)); // null
        System.out.println(l2.get(1)); // 2
        l2.remove(1);
        System.out.println(l2.get(1)); // 3
    }
}

틀린 게 많을지는 모르겠지만…
일단은 구현을 했다는 것에 의의를 두고 나중에 다시 수정해야겠다.

기본적으로 JSTL은 자바 코드를 다루기에 적합한 커스텀 태그 라이브러리이고

Javascript는 웹 브라우저에서 사용되는 스크립트 프로그래밍 언어이고 

내장객체에도 접근이 가능하다는 장점이있다

웹개발을 하다보면 두가지를 같이 써야할상황도 있고 이부분에 헷갈려 하기 쉽다

일단은 두가지를 같이 사용할수있는 예제가 있어서 가져와보았다

출처: http://blog.naver.com/PostView.nhn?blogId=typeofb&logNo=191469973

해당 방식으로 사용할수있는데

기본적으로 자바스크립트와 JSTL의 작동 순서를 알고 코딩해야 에러를 줄일수있다

서버가 작동할때

순서로 작동하기때문에 Javascript 에서는 Jstl나 el 태그의 값을 다루는데에 제한적일수밖에없다

(X)

이런식으로 Jquery 값을 jstl에서는 다룰수가없다 

(O)

다만 스크립트가 로드되기 전부터 존재하는 el값은 스크립트에서 조작이 가능하다

다른 예제

출처: http://wfreud.tistory.com/51 [wfreud 개인 라이브러리]

XXXXcontroller.java 에서

다음과 같이 getUserInfo에 값을 담아 보냈을 때

1. getAttribute로 값 받기

이 방법은 비추…

해당 클래스를 매번 import해야되고, 나중에 소스 파악도 힘듦

2. el표현언어 or jstl 이용  

jstl 이용 시

Value에 <c:out ~~> " 태그를 이용해서 써주면 된다

3. [추가 20141008]자바스크립트에서 받고 싶다면????

뷰(jsp)페이지에서 jstl 태그 이용하지 않고

model에 담긴 List 를 자바스크립트에서 처리하고 싶다면????

 직접은 아니더라도 받을 수는 있음!!!!

3. 자바스크립트 내에서 값 받기

1) jstl을 이용해서 받기

controller에서 List<ServerInfo>  형태로 값을 'serverinfo'에 담아 넘겨줬을 경우

여기서는 json 배열을 만들고자 했다

그래서,

jstl 구문으로 값을 받고 ->받은 값을 json Object에 넣고 -> 배열에 다시 넣음

그럼

[[a:xxx,b:sss],[a:xxx,b:sss],[a:xxx,b:sss]] 형태의 값이 된다.

여기서 object 선언을 jstl 바깥쪽에 넣으면 똑같은 값이 들어간다...

object는 하나의 객체이기 때문에!!!!!

추가될때마다 오브젝트를 만들어서 넣어주도록 해야함

2) javascript 배열을 이용해서 받기

Controller단에서 Model은 request 에 값을 가지고 있음..

model에 있는 값을 받을려면 페이지 전환되어야 그 값을 받아올 수 있음

ajax 요청 같은 경우 

페이지 전환없이 같은페이지에서 받는 것이기 때문에 

컨트롤러에서 model  값에 넣어서 넘겨주면 안돼고.. 

return 값에 넣어 다음과 같이 클라이언트 단에 넘겨줘야함 

받을때는 그냥 다음과 같이 받으면 됨

여기서 .. 리턴 타입이 List<Beacon> 라면...

자바의 List는 자바스크립트에서는 배열로 받음 

Beacon은 object로 접근이 가능하다 

이클립스를 계속 쓰다보면 이런식으로

변경사항이 없는데 'Initializing Java Tooling' has encountered a problem 오류가 뜰때가 있다

딱히 해결방법을 몰랐었다가 검색으로 해결한 방법인데 공유하고자 한다

1. 폴더로 이동

workspace 가 있는 폴더로 이동한다 (이클립스 폴더 X)

\workspace\.metadata\.plugins\org.eclipse.core.resources\.projects

해당 경로에서 생성된 파일들을 모두 지워주자 (.project 하위폴더 전부삭제)

그리고 이클립스를 재시작해보면

아까와 다른 경고가 뜰것이다

\Dev\workspace\.metadata\.plugins\org.eclipse.core.resources\.projects\RemoteSystemsTempFiles\.markers.snap 

(지정된 경로를 찾을 수 없습니다)

해당 경우는 해당 위치에 RemoteSystemsTempFiles,Server 폴더만 생성해주면

해결이 된다

참고 : http://hunit.tistory.com/193

        http://codedragon.tistory.com/5005

+ 2018/01/08 추가

해당 방법을 사용하면 에러는 고쳐지지만

기존에 설정했던 SVN과 GIT 설정등이 있을경우 전부 사라져 버리기때문에

해당 방법 사용전 프로젝트들을 백업 시켜두고

연동된 프로젝트가 있었다면 방법 사용후엔 연결이 끊겨있기때문에

 재연결이나 import를 시켜주어야한다

이클립스의 설정은 윈도우 레지스트리에 보관되지 않습니다. 워크스페이스 폴더를 보면 .metadata 폴더가 있습니다. 여기에 이클립스에서 설정했던 내용들이 들어가 있습니다.

.metadata

이 얘기는 workspace를 바꾸면 설정을 다시해 줘야 한다는 뜻입니다.
또한 이클립스를 업그레이드해도 이전에 쓰던 작업환경의 설정을 그대로 가져갈 수 있다는 뜻이기도 합니다.

살짝 .metadata 폴더 내용을 보면 다음과 같습니다.

.metadata 폴더

이 중에 각각의 플러그인 설정값은 .plugins 아래 보관이 됩니다.
.log 파일은 이클립스 내부에서 발생하는 오류들의 스택트레이스 로그가 보관됩니다. 플러그인 충돌이나 기타 이클립스가 오작동을 할 경우 이 안에 있는 내용을 토대로 구글링 해보면 운 좋게 해결법을 찾을 수 있습니다.

이클립스가 종료된 상태에서 .metadata 를 지우면 설정은 다시하셔야 됩니다. 이클립스의 검색 인덱스 파일도 여기에 보관이 되기 때문에 혹시나 이클립스 워크스페이스가 무거워졌다고 느껴지면 한 번 지웠다가 다시 설정하는 것도 나쁘지는 않습니다.


출처: http://okjsp.tistory.com/1165643079 [OK 괜찮아, fInD YoUr FuN, eNjOy iT!]

이클립스(Eclipse)를 새 PC에 설치해서 구동하려고 했더니, 다음과 같은 오류 메시지가 떴습니다.

이 오류 메시지가 뜨면 이클립스 실행 자체가 되지 않습니다.

회사에서도 그렇고, 이전 PC에서도 그렇고, 별 문제 없이 잘 실행 되었던 것으로 기억하는데..(사실 잘 기억은 안나네요. 처음 설치하고 고생했는지는 너무 오래전 일이라. 보통 한 번 잘 세팅해놓고, 왠만해서는 변경하지 않으니... ㅎㅎㅎ)

Java was started but returned exit code=13 로 시작하는 긴 오류 메시지가 떴습니다. 블라블라~

보통 가장 빈번한 경우는 OS 비트와 이클립스의 지원 비트 버전이 다른 경우입니다.

OS는 64비트인데, 이클립스는 32비트용을 다운로드 받아 설치한 경우이지요.

이 때의 문제는 간단히 이클립스를 OS 버전에 맞는 것으로 다시 다운로드 받아 설치하면 됩니다.

그리고 다른 케이스가 있는데, 이클립스가 실행하면 javaw.exe 파일(JDK 내에 있음)을 찾아 실행시키는데, 해당 파일을 찾지 못한 경우입니다. (제가 겪은 케이스입니다.)

이 때에는 직접 설치한 JDK폴더의 javaw.exe 파일 경로를 eclipse.ini 파일에 지정해주면 됩니다.

참고로 javaw.exe 파일은 java.exe 파일과 그 기능이나 동작은 동일하지만, 단지 Console Window 를 띄우지 않는 다는 차이점만 있습니다. (즉, Java.exe 와 동일하게 동작하지만, 어떠한 상태 정보등을 명령 프롬프트(콘솔 창)에 출력하지 않습니다. 단 오류가 발생하는 경우라면 오류 메시지 박스(대화 상자)를 띄워줍니다.)

그리고 java.exe 파일은 자바 프로그램을 구동시키기 위한 자바 런타임 환경(Java Runtime Environment)을 제공 뿐만 아니라 웹 브라우저에서 Java 기반의 플러그인을 실행할 수 있도록 하기 위한 백그라운드 프로세스로 실행되는 프로그램입니다. 그렇기 때문에 Java 프로그래밍에는 필수 요소입니다.

Eclipse가 설치된 폴더로 가서 eclipse.ini 파일을 메모장 등의 텍스트 편집 도구로 불러옵니다.

그리고 아래와 같이 -vmargs 윗쪽에 javaw.exe 파일 경로를 입력하여 줍니다. 사용자마다 JDK 설치 폴더가 다를테니, 자신의 시스템에 설치된 경로를 확인하여 입력하시면 됩니다.

아래 -vmargs 는 -vm (Virtual Machine)으로 구동될 javaw.exe의 인자 정보들을 의미하므로 위의 -vm 코드는 반드시 -vmargs 보다 상단에 작성하여야 합니다.

참고로 해당 포스팅은 Eclipse Juno 버전과 Kepler 버전에서 확인되었습니다.

출처: http://ooz.co.kr/140 [이러쿵저러쿵]

개인 프로젝트를 하면서 스프링 타일즈를 적용해보았던걸 토대로 작성해봅니다

스프링 타일즈는 

뷰단의 탑,사이드메뉴,하단,메인 등을 페이지 include 방식으로 나누는 

기존구조를 쉽게 적용하기 위한 템플릿 프레임워크입니다

장점은 include 디자인을 변경하면 페이지를 전체적으로 수정해야하는 번거로움을 없애고

일관적인 페이지 관리를 가능하도록합니다

대략적인 순서를 보자면

- pom.xml 에 tiles 관련 dependency 추가

- servlet-context.xml 파일에 타일즈 View Resolver 를 추가

- tiles 관련 설정 xml 추가

- 기본 레이아웃 jsp 추가

입니다.

1. pom.xml dependency 추가

버전은 3.0.5로 맞췄습니다

2.servlet-context.xml 파일에 타일즈 View Resolver 빈 추가

여기서 중요한 부분은 order 속성을 최우선을 1번으로 지정한 것인데

tiles 를 가장 우선적으로 로드시킨다는 설정이므로

order 속성을 사용하는 다른곳은 설정값을 다르게 줘야합니다

다음 설정에 이유를 설명합니다

3. /WEB-INF/tiles/tiles-def.xml  설정

해당 설정부분은 타일즈 layout을 적용 하는 화면과

적용하지않는 화면(ex :로그인) 을 구분지어 볼것입니다

(1) header 에는 디자인이없는 공통 라이브러리들이 참조 될것이고 로그인 페이지는 header만 참조되었습니다

    경로는 구성에 맞게 설정하면 된다, definition 의 template 속성이 기본적으로 틀이 잡힐 레이아웃 jsp이고

    그곳에 put-attribute를 넣는 방식으로 설정됩니다

    두번째 extends 쪽 definition 을 살펴보면  name 에 매핑을 걸고 해당매핑일때 참조될 jsp의 주소를 가리킵니다

    중요한건 /login/login 라는 매핑이 들어왔을경우 put-attribute의 경로에는 *(에스테리크) 를 {1} 에 넣어줄수있게됩니다

    그러므로 /WEB-INF/jsp/login/login.jsp 를 찾아들어가게됩니다

(2) 사용하지않을 title 같은 디자인은 value를 "" 로 넣어주면 됩니다

    아예 코드줄에서 빼버려도 상관 없을것같긴한데 시도해 보지는 않았습니다

    2번의 매핑은 약간 복잡한데 말그대로 로그인을 제외한 모든루트에 매핑할때 가능한 구조입니다

    예를 들어 /community/community 매핑이 들어올경우 /WEB-INF/jsp/community/community.jsp

    로 치환시킵니다 물론 body의 매핑과 파일명을 맞춰주어야하죠

위의 코드가 완전히 정확한건아니지만 나름대로 이것저것 테스트해보면서 적용해보았던 코드입니다 

여기서 약간 의문이 들어야하는데

보통 톰캣 구동시에 web.xml 의 welcom-file 경로 => 컨트롤러의 @RequestMapping경로를 타는데

타일즈에서 매핑을 쓸수있는 이유는

<property name="order" value="1" />

2번에서 설정한 해당 우선순위 때문입니다

보통은 컨트롤러에서 ViewResolver를 이용해 jsp view를 결정해버리는데 그 우선권을 가로챈 형태인것입니다

작동방식을 이해못하고 처음에 코드만 붙이다가 에러만 뿜어서 고생좀 했습니다

순서를 정리해보자면 이렇습니다.

4. 3번의 경로에 JSP 생성

    해당 루트로 생성해주시면됩니다

baseLayout.jsp

타일즈 태그를 삽입한 모습입니다 jstl과 비슷한 형태입니다

loginLayout.jsp

로그인은 메뉴가 필요없으므로 body만 넣은 모습입니다

include-header.jspf 는 공통 라이브러리들이고 레이아웃jsp들에만 include 해놓으면 

다른데에 추가할필요없이 모든화면에 적용됩니다 이점은 매우 편리한것같습니다.

6 컨트롤러

컨트롤러에는 크게 설정할 부분은 없습니다 view를 해당 파일위치에 맞게만 설정해주면 됩니다

여기서 setViewName만 설정해놓으면

title header footer menu 4개는 항상 따라다니며 body의 링크를 타게됩니다

테스트를 해보시길 바라며

이상 포스팅마치겠습니다.