티스토리 뷰
▸ 에러 페이지 만들어보기
– 우리는 코드를 짜다보면 페이지를 찾을 수 없음의 404, 코드를 잘못 썼음의 500 에러 페이지를 자주 볼 수 있음.
그러나 사용자의 입장에서는 이러한 에러 페이지를 볼 수 없음.
– 다른 여러 사이트들을 둘러보면 '페이지를 찾을 수 없다'는 404페이지를 다채롭게 꾸며 놓음.
첫번째 이유는 에러페이지를 마주하는 사용자들의 놀람을 방지하기 위함이며,
두번째 이유는 에러의 이유가 그대로 노출되어 악의적으로 에러코드를 보고 다른 목적으로 사용할 수 있기 때문임.
ex )
1. 네이버 에러페이지 — https://www.naver.com/404
2. 레고 에러페이지 — https://www.lego.com/ko-kr/404
3. 슬랙 에러페이지 — https://slack.com/intl/ko-kr/404
→ 마우스를 움직이면 넓게 펼쳐진 동산을 볼 수 있으며, 닭과 돼지를 누르면 움직임. 전체적으로 귀여움.
4. Kualo 에러페이지 — https://www.kualo.com/404
→ 게임이 가능하도록 만들어 놓음. 생각보다 재밌음ㅎ
EX )
• 우리도 이제 에러페이지를 처리하는 법을 배워보겠음. 404에러가 발생했을 때,
• 깔끔하게 꾸며놓고 다른 기능을 하는 페이지를 사용자가 볼 수 있게끔 만들어 보자!
→ 해당 경로로 찾아가 web.xml 파일을 열고 에러 페이지를 처리하는 코드를 작성해줌.
...
</welcome-file-list>
<!-- 여기서는 코드 최소한으로 사용하기 -->
<!-- 에러페이지 처리 -->
<error-page>
<error-code>404</error-code>
<location>/error/404Err.jsp</location>
</error-page>
</web-app>
→ 해당 파일 안에서는 코드를 최소한으로만 사용해야 함.
→ error-page태그로 error-code 404가 발생했을 때 실행할 페이지를 location태그를 통해 넣어줌.
404 에러가 발생하면 '404Err.jsp' 파일을 실행하므로 해당 파일을 만들어줌.
<body>
<h1>404Err.jsp</h1>
<h2>관리자에게 문의하세요!</h2>
<h2>5초 후 다른페이지로 자동 이동됩니다!</h2>
<img src="https://media.giphy.com/media/1RkDDoIVs3ntm/giphy.gif">
<%
response.addHeader("Refresh", "5;http://www.naver.com");
%>
</body>
→ 404에러 발생시 출력할 문구를 넣고 <img>태그로 움직이는 이미지의 소스를 넣어줌.
→ response객체의 addHeader메서드를 사용하여 새로고침 후, 5초뒤에 네이버 페이지로 이동하게끔 설정함.
✓ 실행 결과


'JSP' 카테고리의 다른 글
게시판 만들기 (글 쓰기) (0) | 2023.04.10 |
---|---|
DB 사용하기 (DB, Table, Data설정 / PK / AI / Where조건절) (0) | 2023.03.03 |
세션(Session)과 쿠키(Cookie) (0) | 2023.02.23 |
액션 태그 (forward / include / 템플릿 페이지 작성) (0) | 2023.02.23 |
내장 객체 (영역 객체(Scope) / 속성(Attribute)) (0) | 2023.02.23 |
- Total
- Today
- Yesterday
- DB
- Git
- 데이터타입
- 인자
- 주석문
- mysql
- github
- 숫자형
- 업캐스팅
- 논리형
- 오버라이딩
- Dao
- Java
- 내장객체
- gitbash
- model2
- jsp
- Method
- 출력문
- Object
- 매개변수
- 제어문
- 로컬저장소
- 원격저장소
- 문자형
- 단일행함수
- javascript
- null
- JSTL
- 다형성
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |