My First Blog Project (15) : 게시판 글쓰기

로그인 한 후에 글쓰기를 누르면  board/saveForm으로 간다.

saveForm이 열리고 글쓰기 완료를 누르면 board.js로 가서 data를 /api/board로 날린다.

title,content를 가지고 BoardApiController에 가서, principal을 통해 user정보를 가지고  boardService가 실행된다.

boardService에서 저장을 실행 후 정상적으로 완료되면 정상완료 응답이 온다.

 board.js 에서 done을 실행하고 끝난다. 

 

WEB-INF/views/board/saveForm.jsp

<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>

<%@ include file="../layout/header.jsp" %>

<div class="container">
    <form>
      <div class="form-group">
        <label for="title">Title</label>
        <input type="text" class="form-control" placeholder="Enter Title" id="title">
      </div>
        <div class="form-group">
            <label for="content">Content</label>
            <textarea class="form-control summernote" rows="5" id="content"></textarea>
        </div>
    </form>
    <button id="btn-save" class="btn btn-primary">글쓰기 완료</button>
</div>
    <script>
      $('.summernote').summernote({
        placeholder: 'Hello Bootstrap 4',
        tabsize: 2,
        height: 300
      });
    </script>

<script src="/js/board.js"></script>
<%@ include file="../layout/footer.jsp" %>

board.js

let index = {
    init: function(){
        $("#btn-save").on("click",()=>{
            this.save();
        });
    },

    save:function(){

        let data = {
            title: $("#title").val(),
            content: $("#content").val()
        };

        $.ajax({
            type:"POST",
            url:"/api/board",
            data: JSON.stringify(data),
            contentType: "application/json; charset=utf-8"
        }).done(function(resp){
            alert("글쓰기가 완료되었습니다.");
            location.href = "/";
        }).fail(function(error){
            alert(JSON.stringify(error));
        });
    }
}

index.init();

controller/api/boardApiController.java

package com.cos.blog.controller.api;

import com.cos.blog.config.auth.PrincipalDetail;
import com.cos.blog.dto.ResponseDto;
import com.cos.blog.model.Board;
import com.cos.blog.service.BoardService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.http.HttpStatus;
import org.springframework.security.core.annotation.AuthenticationPrincipal;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestBody;
import org.springframework.web.bind.annotation.RestController;

@RestController
public class BoardApiController {

    @Autowired
    private BoardService boardService;

    @PostMapping("/api/board")
    public ResponseDto<Integer> save(@RequestBody Board board, @AuthenticationPrincipal PrincipalDetail principal) { // username, password, email
        boardService.글쓰기(board,principal.getUser());
        return new ResponseDto<Integer>(HttpStatus.OK.value(), 1);

    }



}

BoardController.java

package com.cos.blog.model;

import lombok.AllArgsConstructor;
import lombok.Builder;
import lombok.Data;
import lombok.NoArgsConstructor;
import org.hibernate.annotations.ColumnDefault;
import org.hibernate.annotations.CreationTimestamp;

import javax.persistence.*;
import java.sql.Timestamp;
import java.util.List;

@Data
@NoArgsConstructor
@AllArgsConstructor
@Builder
@Entity
public class Board {

    @Id
    @GeneratedValue(strategy = GenerationType.IDENTITY)
    private int id;
    @Column(nullable = false,length = 100)
    private String title;

    @Lob //대용량 데이터에 사용
    private String content;


    // 조회수
    private int count;

    @OneToMany(mappedBy = "board",fetch = FetchType.EAGER)
    //mappedBy : 연관관계의 주인이 아니다.(난 FK가 아니에요, DB에 칼럼을 만들지 마세요)
    //fetch = FetchType.LAZY : 엄청 많이 가져오니까, 필요하면 가져오고 아니면 안가져올게
    private List<Reply> reply;

    @ManyToOne(fetch = FetchType.EAGER)
    //Many =Many, User=One
    //fetch = FetchType.EAGER : user정보는 하나니까 바로 가져올게
    @JoinColumn(name="userId")
    //필드이름은 userId로 만들어지고, 연관관게는 manytoone
    //User를 참조하고, 자동으로 FK가 만들어진다
    private User user;
    @CreationTimestamp
    private Timestamp createData;
}

service/BoardService.java

package com.cos.blog.service;

import com.cos.blog.model.Board;
import com.cos.blog.model.User;
import com.cos.blog.repository.BoardRepository;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;
import org.springframework.transaction.annotation.Transactional;

@Service
public class BoardService {

    @Autowired
    private BoardRepository boardRepository;

    @Transactional
    public void 글쓰기(Board board, User user){
        board.setCount(0);
        board.setUser(user);
        boardRepository.save(board);
    }

}