jsp template 에 추가한 내용
<%@ page import="java.util.*" %>
<% request.setCharacterEncoding("utf-8"); %>
- 이후에 더 추가될 예정
24script
<%
List<String> list = (List<String>) application.getAttribute("list");
if (list == null) {
list = new ArrayList<>();
application.setAttribute("list", list);
}
String txt = request.getParameter("text");
if (txt != null && !txt.isEmpty()) {
list.add(txt);
}
%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<form action="">
<textarea name="text" id="" cols="30" rows="10"></textarea>
<input type="submit" value="전송">
</form>
<hr>
<%
for (int i = 0; i < list.size(); i++) {
%>
<div><%= (i+1) + "번" %> : <%= list.get(i).replace("<", "<").replace(">", ">") %></div>
<%
}
%>
</body>
</html>
* arraylist, hashmap 과 같은 collection 은 https://tokkicode.tistory.com/26?category=987176 (java19) 참고
* abc.isEmpty() : abc 가 비어있는지를, 비어있다면 true 리턴하여 알려줌 - !abc.isEmpty() 라면 비어있지 않을 때 true 리턴
abc != null 과 같음
입력한 내용은 text, request.getParameter 로 txt 에 저장, 빈 문자열이 아니라면 list 에 추가
리스트는 list 로 선언되었고
이 코드는 텍스트를 받아서 전송받을 때마다 리스트에 추가. 그리고 이를 반환하여 출력해주는 코드. 끝없이 이어진다.
25input-attr
input 태그의 가능한 속성 attribute 들 !
<input type="text" name="param1" required value="필수값"> <br>
<input type="text" name="param2" value="초기값"> <br>
<input type="text" name="param3" disabled value="디스에이블드값"> <br>
<input type="text" name="param4" readonly value="읽기 전용값"> <br>
<input type="text" name="param5" placeholder="힌트 예)이름을 입력하세요."> <br>
<input type="text" name="param7" pattern="[0-9]{5}" > <br>
required value, value, disabled value, readonly value, placeholder, pattern
26 그냥 로그인 창 만들기
27 get, post 차이 설명
28 get 예시
29 post 예시
*참고
<input type="text" name="age">
<input type="submit" value="로그인">
name 은 나중에 값:<%= request.getParameter("age") %> 처럼 쓰이고
value 는 페이지에 어떻게 표시될 지 설정 (전송 버튼이 로그인 버튼으로 표시됨)
30login
abc.equals("cde") 는 변수 abc 에 저장된 값이 cde 인지 확인하여 boolean 타입으로 결과 반환
out.print("로그인 성공"); 이 코드로 출력하게 할 수 있음을 잘 확인하자
주의! 해당 코드는 자바 코드이므로 <% %> 안에 작성되었음
31login
if (userid != null && password != null) {
if (userid.equals("myid") && password.equals("mypassword")) {
out.print("로그인 성공");
} else {
out.print("<script>");
out.print("alert('아이디나 패스워드가 일치하지 않습니다')");
out.print("</script>");
}
이 코드에서 <script>alert('아이디나 패스워드가 일치하지 않습니다')</script> 에 주목
script 가 자바 코드에서 html로 넘어간 뒤 읽혀서 페이지에 나타남 (jsp → html → 페이지)
따라서 유효함
32signup 회원가입 창 만들기
33,34 ?? 33은 그냥 회원가입 창
→33의 form 에 역시 action 속성 값으로 경로가 걸려있음 (34로) 그래서 연결된다 (34가 33을 받아올 수 있는 것이다)
단 아래와 다른 점은 경로를 작성할 때 request.getContextPath() 를 사용하지 않았다는 것이다
35login-form, 36login-process
<form action="<%= request.getContextPath() %>/01jsp/36login-process.jsp" method="post">
<input type="text" name="id" placeholder="아이디">
<br>
<input type="password" name="pw" placeholder="암호">
<br>
<input type="submit" value="로그인">
</form>
JSP02 - memo 게시글에 경로지정 할 때 request.getContextPath() 가 많이 쓰인다고 했는데, 여기에서 쓰인 것을 볼 수 있다
ContextPath 메소드
정확히는 form 태그에서 action 속성 값이 "<%= request.getContextPath() %>/01jsp/36login-process.jsp" 로 작성되었음
경로에 포함된다고 보면 됨
이 메소드의 의미는?
→ form 태그의 action 속성 값이 경로로 지정되었으며, 입력된 경로의 파일과 이 파일은 연결되어진다!
35 파일 실행 시 로그인 화면 나타나며, 이를 전송 (로그인) 하면
성공/실패 여부에 따라 다른 페이지가 보여지는데, 이것을 36 파일이 한다
36 파일은 다음과 같이 작성되어있음
<%
String id = request.getParameter("id");
String pw = request.getParameter("pw");
if (id != null && pw != null) {
if (id.equals("myid") && pw.equals("mypassword")) {
%>
<h1>로그인 성공</h1>
<%
} else {
%>
<h1>아이디나 패스워드가 일치하지 않습니다.</h1>
<a href="<%= request.getContextPath() %>/01jsp/35login-form.jsp">로그인화면으로 돌아가기</a>
<%
}
}
%>
37
context root 와 context path 는 같은 말임
수정 관련일듯
'course 2021 > JSP' 카테고리의 다른 글
JSP06 - 05attribute (0) | 2021.11.17 |
---|---|
JSP05 - 04path (0) | 2021.11.17 |
JSP04 - 03module (0) | 2021.11.17 |
JSP02 - memo (0) | 2021.11.17 |
JSP01 (0) | 2021.11.10 |
jsp template 에 추가한 내용
<%@ page import="java.util.*" %>
<% request.setCharacterEncoding("utf-8"); %>
- 이후에 더 추가될 예정
24script
<%
List<String> list = (List<String>) application.getAttribute("list");
if (list == null) {
list = new ArrayList<>();
application.setAttribute("list", list);
}
String txt = request.getParameter("text");
if (txt != null && !txt.isEmpty()) {
list.add(txt);
}
%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<form action="">
<textarea name="text" id="" cols="30" rows="10"></textarea>
<input type="submit" value="전송">
</form>
<hr>
<%
for (int i = 0; i < list.size(); i++) {
%>
<div><%= (i+1) + "번" %> : <%= list.get(i).replace("<", "<").replace(">", ">") %></div>
<%
}
%>
</body>
</html>
* arraylist, hashmap 과 같은 collection 은 https://tokkicode.tistory.com/26?category=987176 (java19) 참고
* abc.isEmpty() : abc 가 비어있는지를, 비어있다면 true 리턴하여 알려줌 - !abc.isEmpty() 라면 비어있지 않을 때 true 리턴
abc != null 과 같음
입력한 내용은 text, request.getParameter 로 txt 에 저장, 빈 문자열이 아니라면 list 에 추가
리스트는 list 로 선언되었고
이 코드는 텍스트를 받아서 전송받을 때마다 리스트에 추가. 그리고 이를 반환하여 출력해주는 코드. 끝없이 이어진다.
25input-attr
input 태그의 가능한 속성 attribute 들 !
<input type="text" name="param1" required value="필수값"> <br>
<input type="text" name="param2" value="초기값"> <br>
<input type="text" name="param3" disabled value="디스에이블드값"> <br>
<input type="text" name="param4" readonly value="읽기 전용값"> <br>
<input type="text" name="param5" placeholder="힌트 예)이름을 입력하세요."> <br>
<input type="text" name="param7" pattern="[0-9]{5}" > <br>
required value, value, disabled value, readonly value, placeholder, pattern
26 그냥 로그인 창 만들기
27 get, post 차이 설명
28 get 예시
29 post 예시
*참고
<input type="text" name="age">
<input type="submit" value="로그인">
name 은 나중에 값:<%= request.getParameter("age") %> 처럼 쓰이고
value 는 페이지에 어떻게 표시될 지 설정 (전송 버튼이 로그인 버튼으로 표시됨)
30login
abc.equals("cde") 는 변수 abc 에 저장된 값이 cde 인지 확인하여 boolean 타입으로 결과 반환
out.print("로그인 성공"); 이 코드로 출력하게 할 수 있음을 잘 확인하자
주의! 해당 코드는 자바 코드이므로 <% %> 안에 작성되었음
31login
if (userid != null && password != null) {
if (userid.equals("myid") && password.equals("mypassword")) {
out.print("로그인 성공");
} else {
out.print("<script>");
out.print("alert('아이디나 패스워드가 일치하지 않습니다')");
out.print("</script>");
}
이 코드에서 <script>alert('아이디나 패스워드가 일치하지 않습니다')</script> 에 주목
script 가 자바 코드에서 html로 넘어간 뒤 읽혀서 페이지에 나타남 (jsp → html → 페이지)
따라서 유효함
32signup 회원가입 창 만들기
33,34 ?? 33은 그냥 회원가입 창
→33의 form 에 역시 action 속성 값으로 경로가 걸려있음 (34로) 그래서 연결된다 (34가 33을 받아올 수 있는 것이다)
단 아래와 다른 점은 경로를 작성할 때 request.getContextPath() 를 사용하지 않았다는 것이다
35login-form, 36login-process
<form action="<%= request.getContextPath() %>/01jsp/36login-process.jsp" method="post">
<input type="text" name="id" placeholder="아이디">
<br>
<input type="password" name="pw" placeholder="암호">
<br>
<input type="submit" value="로그인">
</form>
JSP02 - memo 게시글에 경로지정 할 때 request.getContextPath() 가 많이 쓰인다고 했는데, 여기에서 쓰인 것을 볼 수 있다
ContextPath 메소드
정확히는 form 태그에서 action 속성 값이 "<%= request.getContextPath() %>/01jsp/36login-process.jsp" 로 작성되었음
경로에 포함된다고 보면 됨
이 메소드의 의미는?
→ form 태그의 action 속성 값이 경로로 지정되었으며, 입력된 경로의 파일과 이 파일은 연결되어진다!
35 파일 실행 시 로그인 화면 나타나며, 이를 전송 (로그인) 하면
성공/실패 여부에 따라 다른 페이지가 보여지는데, 이것을 36 파일이 한다
36 파일은 다음과 같이 작성되어있음
<%
String id = request.getParameter("id");
String pw = request.getParameter("pw");
if (id != null && pw != null) {
if (id.equals("myid") && pw.equals("mypassword")) {
%>
<h1>로그인 성공</h1>
<%
} else {
%>
<h1>아이디나 패스워드가 일치하지 않습니다.</h1>
<a href="<%= request.getContextPath() %>/01jsp/35login-form.jsp">로그인화면으로 돌아가기</a>
<%
}
}
%>
37
context root 와 context path 는 같은 말임
수정 관련일듯
'course 2021 > JSP' 카테고리의 다른 글
JSP06 - 05attribute (0) | 2021.11.17 |
---|---|
JSP05 - 04path (0) | 2021.11.17 |
JSP04 - 03module (0) | 2021.11.17 |
JSP02 - memo (0) | 2021.11.17 |
JSP01 (0) | 2021.11.10 |