상세 컨텐츠

본문 제목

2023.03.15

Spring

by 연을 2023. 3. 15. 17:27

본문

728x90

※로그인, 회원가입 연결

<코드>

[bbscontroller]

package com.human.springboot;

import java.util.ArrayList;

import org.json.JSONArray;
import org.json.JSONObject;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.ResponseBody;

import jakarta.servlet.http.HttpServletRequest;
import jakarta.servlet.http.HttpSession;

@Controller
public class BBSController {
	@Autowired
	private IDAO idao;
	
	@GetMapping("/list")
	public String dolist(HttpServletRequest req,Model model) {
		HttpSession sinfo = req.getSession();
		String a=(String) sinfo.getAttribute("id");
		if(a==null) {
			model.addAttribute("loginfo","<a href='/login'>로그인</a>&nbsp;<a href='/signon'>회원가입</a>");
		}else {
			String nickname=idao.nickname(a);
			sinfo.setAttribute("nickname",nickname);
			model.addAttribute("loginfo",nickname+"&nbsp;<a href='/logout'>로그아웃</a>");
			model.addAttribute("bbs",idao.getlist());
		}
		
		//model.addAttribute("signon",idao.getSingon());
		return "list";
	}
	//로그인 기능 구현
	@GetMapping("/login") //로그인 화면
	public String dologin() {
		return "login";
	}
	@PostMapping("/dologin") //로그인 값 가져오기
	public String doLogin(HttpServletRequest req) {
		String id=req.getParameter("id");
		String pwd=req.getParameter("password");
		HttpSession session=req.getSession();
		int n=idao.login(id,pwd);
		if(n==1) {
			session.setAttribute("id", id);
			session.setAttribute("pwd", pwd);
			return "redirect:/list";
		}else {
			return "loginfail";
		}
	}
	@GetMapping("/logout") //로그아웃
	public String doLogout(HttpServletRequest req) {
		HttpSession session=req.getSession();
		session.invalidate();
		return "redirect:/list";
	}
	@GetMapping("/signon") //회원가입
	public String Signon() {
		return "signon";
	}
	@PostMapping("/dosignon") //회원가입 값 가져가기
	public String doSignon(HttpServletRequest req,Model model) {
		String id=req.getParameter("id");
		String password=req.getParameter("password");
		String nickname=req.getParameter("nickname");
		String gender=req.getParameter("gender");
		String[] interest=req.getParameterValues("interest");
		String str=new String();
		for(int i=0;i<interest.length;i++) {
			if(!str.equals("")) {
				str+=",";
			}
			str += interest[i];
		}
		idao.signinsert(id, password, nickname, gender, str);
		return "redirect:/list";
	}

	@PostMapping("/check_id") //아이디 중복체크
	@ResponseBody
	public String Check(HttpServletRequest req) {
		String id=req.getParameter("id");
		int idcheck=idao.checkid(id);
		String n="ok";
		if(idcheck==0) {
			n="not ok";
		}else{
		}
		return n;
	}
}

[bbs.xml]

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE mapper
	PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
	"http://mybatis.org/dtd/mybatis-3-mapper.dtd">
	
<mapper namespace="com.human.springboot.IDAO">
	<select id="getlist" resultType="com.human.springboot.bbsDTO"> //writer추가
		select seqno,title,created,updated,readcount,writer from BBS order by seqno asc
	</select>
	<insert id="doInsert" >//writer 추가
		insert into BBS(seqno,title,content,created,readcount,writer)
		values(bbs_segno.nextval,#{param1},#{param2},to_char(sysdate,'yyyy-MM-dd HH:MI:ss'),0,#{param3})
	</insert>
	//회원가입
	<select id="getSingon" resultType="com.human.springboot.SingonDTO">
		select id,password,nickname,gender,interest from singon
	</select>
    //회원가입한 값 넣어주기
	<insert id="signinsert">
		insert into singon(id,password,nickname,gender,interest,id_seq) 
		values(#{param1},#{param2},#{param3},#{param4},#{param5},idseq.nextval)
	</insert>
    //로그인 값 가져오기(db에 없으면 로그인 안되게)
	<select id="login" resultType="int">
		select count(*) from singon where id=#{param1} and password=#{param2}
	</select>
    //아이디 중복체크
	<select id="checkid" resultType="int">
		select count(*) from singon where id=#{param1}
	</select>
    //닉네임 가져오게하기
	<select id="nickname" resultType="string">
		select nickname from singon where id=#{param1}
	</select>

</mapper>

[IDAO]

package com.human.springboot;

import java.util.ArrayList;

import org.apache.ibatis.annotations.Mapper;

@Mapper
public interface IDAO {
	ArrayList<bbsDTO> getlist();
	void doInsert(String x1,String x2,String x3);
	void doView(String x1,String x2,String x3,String x4,String x5);
	void view(int x);
	ArrayList<bbsDTO> getPost(int seqno);
	void dellist(int x);
	void doupdate(String x1,String x2,int x3);
	void viewcount(int x);
	void dateupdate(int x);
	//로그인 기능
	ArrayList<SingonDTO> getSingon();
	void signinsert(String x1,String x2,String x3,String x4,String x5);
	int login(String x1,String x2);
	int checkid(String x1);
	String nickname(String x1);
	
}

[SingonDTO]

package com.human.springboot;

import lombok.Data;

@Data
public class SingonDTO {
	String id;
	String password;
	String nickname;
	String gender;
	String interest;
	int id_seq;
}

[login.jsp]

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Login</title>
</head>
<style>
#wrap{
	width:800px;
	margin:auto;
}
body{
	background:darkslategray;
}
table{
	margin-left: auto;
    margin-right: auto;
    margin-top: 400px;
    background:#FFFFFF;
    border-radius:5px;
}
#submit{
	border:1px solid darkslategray;
	padding:10px;
	width:100%;
	border-radius:5px;
	background:darkslategray;
	color:#FFFFFF;
}
#reset{
	border:1px solid darkslategray;
	padding:10px;
	width:100%;
	border-radius:5px;
	background:darkslategray;
	color:#FFFFFF;
}
</style>
<body>
<div id=wrap>
<form method="post" action="/dologin" id='frmlogin'>
    <table>
        <tr>
            <td><input type="text" style="width: 200px; height:40px;" placeholder="ID" name=id id=id></td>
        </tr>
        <tr>
            <td><input type="password" style="width: 200px; height:40px;" placeholder="PASSWORD" name=password id=password></td>
        </tr>
        <tr align="center" width="100px">
            <td><input type=submit id=submit value='로그인' ></td>
        </tr>
        <tr align="center" width="100px">
         	<td><input type=reset id=reset value='취소'></td>
        </tr>
        <tr>
            <td align="right"><a href="/signon">회원가입</a></td>
        </tr>
    </table>
</form>
</div>
</body>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document)
.on('submit','#frmlogin',function(){
	if($('#id').val()==''){
		alert('아이디를 입력하세요');
		return false;
	}else if($('#password').val()==''){
		alert('비밀번호를 입력하세요');
		return false;
	}
})
.on('click','#reset',function(){
	location.href="/list";
})
</script>
</html>

[loginfail.jsp]

로그인 실패했을때 화면

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<style>
#wrap{
	width:800px;
	margin:auto;
}
</style>
<body>
<div id=wrap>
<table>
<tr><td>로그인에 실패하셨습니다.<a href="/login">다시 로그인하기</a></td></tr>
</table>
</div>
</body>
</html>

[signon.jsp]

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>회원가입</title>
</head>
<style>
#wrap{
	width:800px;
	margin:auto;
}
table{
	margin-left: auto;
    margin-right: auto;
    margin-top: 300px;
    border-radius:5px;
}
#submit{
	border:1px solid darkslategray;
	padding:10px;
	width:100%;
	border-radius:5px;
	background:darkslategray;
	color:#FFFFFF;
}
#reset{
	border:1px solid darkslategray;
	padding:10px;
	width:100%;
	border-radius:5px;
	background:darkslategray;
	color:#FFFFFF;
}
</style>
<body>
<form method="post" action="/dosignon" id='frmSignin'>
<table>
<tr><td>ID</td><td><input type="text" id=id name=id placeholder="ID" class="input_id">
					<font id="checkid" size="2"></font>
					<input type="hidden" name="idckecked"></td></tr>
<tr><td>PASSWORD</td><td><input type=password id=password name=password placeholder="PASSWORD" class='pw'></td></tr>
<tr><td>PASSWORDCHECK</td><td><input type=password id=passcode1 name=passcode1 placeholder="PASSWORDCHECK" class='pw'>
							<span id="same" size="5"></span></td></tr>
<tr><td>NICKNAME</td><td><input type="text" name=nickname id=nickname placeholder="NICKNAME"></td></tr>
<tr><td>GENDER</td><td><input type=radio name=gender id=gender value=male>남성
					   <input type=radio name=gender id=gender value=female>여성</td></tr>
<tr><td colspan="2" align="left">관심분야<br>
                <input id='interest' type="checkbox" name="interest" value="정치">정치&nbsp;
                <input id='interest' type="checkbox" name="interest" value="경제">경제&nbsp;
                <input id='interest' type="checkbox" name="interest" value="사회">사회<br>
                <input id='interest' type="checkbox" name="interest" value="문화">문화&nbsp;
                <input id='interest' type="checkbox" name="interest" value="종교">종교&nbsp;
                <input id='interest' type="checkbox" name="interest" value="제테크">제테크<br>
                <input id='interest' type="checkbox" name="interest" value="연예">연예&nbsp;
                <input id='interest' type="checkbox" name="interest" value="IT">IT&nbsp;
                <input id='interest' type="checkbox" name="interest" value="스포츠">스포츠<br><br></td></tr>
<tr><td colspan=2 align=center>
		<input type=submit id=submit name=submit value='전송'>
	</td></tr>
<tr><td td colspan=2 align=center>
		<input type=reset id=reset name=reset value='취소'>
	</td></tr>					   
</table>
</form>
</body>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document)
.on('blur','.input_id',function(){
	$.ajax({url:'/check_id',
		type:'post',
		dataType:'text',
		data:{id:$('#id').val()},
		success:function(result){
			if(result=="ok"){
				$('#checkid').html('사용불가능한 아이디입니다.');
				$('#checkid').attr('color','red');
			}else{
				$('#checkid').html('사용가능한 아이디입니다.');
				$('#checkid').attr('color','green');
			}
		},
		error:function(){
			alert("서버요청실패");
		}
	})
})
.on('submit','#frmSignin',function(){
	radio=$('input[type=radio][name=gender]:checked').val();
	check=$('input[type=checkbox][name=interest]:checked').val();
	if($('#id').val()==''){
		alert('아이디를 입력하세요');
		return false;
	}else if($('#password').val()==''){
		alert('비밀번호를 입력하세요');
		return false;
	}else if($('#nickname').val()==''){
		alert('닉네임을 입력하세요');
		return false;
	}else if(radio==null||radio==''){
		alert('성별을 입력하세요');
		return false;
	}else if(check==null||check==''){
		alert('관심분야를 하나라도 클릭하세요');
		return false;
	}
	else{
		location.href='/list';
	}
	return true; //submit계속진행

})
.on('keyup','.pw',function(){
	if($('input[name=password]').val()!=$('input[name=passcode1]').val()){
		$('#same').html('비밀번호가 일치하지 않습니다.');
		return false;//submit 중단
	}else{
		$('#same').html(null);
	}
})
.on('click','#reset',function(){
	location.href="/list";
})


</script>
</html>

[list.jsp]

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>List</title>
</head>
<style>
table{
	width:100%;
	border-collspse:collapse;
	line-height:24px;
}
td{
	text-align:center;
	width:50px;
	padding:10px;
}
#tblList tr:hover{
	background-color:#778899;
	color:#FFFFFF;
	
}
#wrap{
	width:800px;
	margin:auto;
}
a{
	text-decoration: none;
	color:darkslategray;
	align:right;
}
</style>
<body>
<div id=wrqp>
<h1 align=center>게시판</h1>
<table>
<!-- ${loginfo}의 값은 id가 없을땐 로그인과 회원가입 id가 있을땐 nickname과 로그아웃-->
<tr><td>${loginfo }</td></tr>
</table>
<table id=tblList>
<tr style="background-color:darkslategray;
	color:#FFFFFF;"><th>NO.</th><th>제목</th><th>글쓴이</th><th>작성일</th><th>조회</th>
<c:forEach items="${bbs}" var="bbs">
	<tr><td>${bbs.seqno}</td>
		<td>${bbs.title}</td>
		<td>${bbs.writer }</td>
		<td>${bbs.created}</td>
	 	<td>${bbs.readcount}</td></tr>
</c:forEach>
</table>
<input type=hidden id=seqno>
<!-- <button id=btnList>새로고침</button> -->
<a href="/new">새글쓰기</a>
</div>
</body>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document)
.ready(function(){
	$('#btnList').trigger
})
.on('click','#tblList tr',function(){
	let seqno=$(this).find('td:eq(0)').text();
	$('#seqno').val(seqno);
	document.location='/view/'+$('#seqno').val();
	return false;
})
.on('click','#btnList',function(){
	$.ajax({url:'/getList',type:'get',data:{},dataType:'JSON',
		beforeSend:function(){
			alert('AJAX starting');
		},
		success:function(data){
			$('table tr:gt(0)').remove();
			for(let i=0;i<data.length;i++){
				let str='<tr>';
				str +='<td>'+data[i]['seqno']+'</td>';
				str +='<td>'+data[i]['title']+'</td>';
				str +='<td>'+data[i]['created']+'</td>';
				str +='<td>'+data[i]['readcount']+'</td>';
				$('table').append(str);
			}
		}})
})

</script>
</html>

<결과>

 로그인 회원가입이 뜰때는
게시판의 list가 뜨지 않게 설정해놨다.
로그인 화면
id와 password가 같지 않을때,
id가 없는 경우
다 이 페이지로 나오게 했다.
로그인이 될 때 닉네임이 뜨고 list가 뜬다.
로그인 했을 때만 새글쓰기를 하도록 지정
로그인이 되서 새글쓰기에 들어가면
작성자에 닉네임이 들어온다.
test2는 이미 사용중인 아이디라 사용불가능 아이디가 뜬다.
test4는 db에 없는 아이디라 사용가능이 뜬다.
회원가입을 누르면 이렇게 db signon값에 들어간다.

어떻게..하긴..한거같음..

개힘들어..진짜..ㅜㅜ

 

728x90

'Spring' 카테고리의 다른 글

2023.03.17  (0) 2023.03.17
2023.03.16  (0) 2023.03.16
2023.03.13  (0) 2023.03.13
2023.03.10  (0) 2023.03.10
2023.03.09  (0) 2023.03.10

관련글 더보기

티스토리툴바