@RestController //***
public class BoardController {
	@Autowired
	private boardService bService;
	
	@RequestMapping("boardList")
	public ModelAndView boardList(@RequestParam(value="page",required=false) Integer page, ModelAndView mv) {
		//Pagination
		int currentPage = 1;
		if(page!=null) {
			currentPage = page;
		}
		int listCount = bService.getPageCount();
		PageInfo pi = Pagination.getPageInfo(currentPage,listCount);
		
		int offset = pi.getboardLimit()*(pi.getCurrentPage()-1);
		RowBounds rb = new RowBounds(offset, pi.getboardLimit());
		
		List<Board> boardList = bService.getBoardList(rb);
		if(boardList!=null) {
			mv.addObject("boardList",boardList).addObject("pi",pi);
			mv.setViewName("boardList");
		}else {
			throw new BoardException("Board list loading Fail");
		}	
		return mv;
	}
	
	@RequestMapping("boardInsertView")
	public ModelAndView boardInsertView(ModelAndView mv) {
		mv.setViewName("boardInsert");
		return mv;
	}
	
	@RequestMapping("boardInsert")
	public ModelAndView insertBoard(@ModelAttribute Board b,@RequestParam("srcImg")MultipartFile uploadFile, 
									HttpServletRequest request, ModelAndView mv) {
		if(!uploadFile.getOriginalFilename().equals("")) {
			String renameFileName = saveFile(uploadFile,request);
			if(renameFileName!=null) {
				b.setOriginalFileName(uploadFile.getOriginalFilename());
				b.setRenameFileName(renameFileName);
			}
		}
		int result = bService.insertBoard(b);
		if(result>0) {
			mv.addObject("b",b);
			mv.setViewName("boardDetail");
			return mv;
		}else {
			throw new BoardException("Board insert Fail");
		}
	}
	
	public String saveFile(MultipartFile file, HttpServletRequest request) {
		String root = request.getSession().getServletContext().getRealPath("resources");
		String savePath = root + "\\buploadFiles";
		
		File folder = new File(savePath);
		if(!folder.exists()) {
			folder.mkdirs();
		}
		SimpleDateFormat sdf = new SimpleDateFormat("yyyyMMddHHmmssSSS");
		String originalFileName = file.getOriginalFilename();
		String renameFileName = sdf.format(new Date(System.currentTimeMillis()))+"."+
								originalFileName.substring(originalFileName.lastIndexOf(".")+1);
		String renamePath = folder + "\\" + renameFileName;
		try {
			file.transferTo(new File(renamePath));
		} catch (IllegalStateException e) {
			e.printStackTrace();
		} catch (IOException e) {
			e.printStackTrace();
		}
		return renameFileName;
	}
	
	@RequestMapping("boardDetail")
	public ModelAndView bdetail(@RequestParam("boardId") int boardId, @RequestParam("page") Integer page, ModelAndView mv) {
		Board b = bService.selectBoard(boardId,true);
		System.out.println("board:::::"+b);
		if(b!=null) {
			mv.addObject("b",b);
			mv.addObject("page",page);
			mv.setViewName("boardDetailView");
		}else {
			throw new BoardException("게시글 상세보기 실패");
		}
		return mv;
	}
	

<script>
	const canvas = document.querySelector('.canvas');
	const context = canvas.getContext('2d');
	const saveBtn = document.querySelector('#saveBtn');
	
	//이벤트 리스너 등록
	canvas.addEventListener('mousedown', downHandler);
	canvas.addEventListener('mousemove', moveHandler);
	canvas.addEventListener('mouseup', upHandler);
	saveBtn.addEventListener('click', createImage);
	
	let drawing; // 그려지는동안 상태 :true,false
	let colorVal = 'black'; //브러시 색깔
	//true일때만 그려지게 하기
	function downHandler() {
	  drawing = true;
	}
	//마우스클릭이 끊어지면 false
	function upHandler() {
	  drawing = false;
	}
	//마우스가 움직이는 동안에 계속되도록하기
	function moveHandler(e) {
	  if (!drawing) return;
	  context.fillStyle = colorVal;
	  context.beginPath();
	  //그려지는 위치 x,y좌표, 브러시 반지름
	  context.arc(e.layerX, e.layerY, 6, 0, Math.PI*2, false);
	  context.fill();
	}
	//이미지 저장
	function createImage() {
	  const url = canvas.toDataURL('image/png', 'image/octet-stream');
	  srcImg.attr('value',url);
	  console.log("imgsrc:",url);
	  debugger;
	}
	//캔버스 영역 지우기
	function resetImg(){
	  context.clearRect(0,0,canvas.width,canvas.height);
	}

</script>