응답 헤더 변경 방법

조회수 3368회

안녕하세요. Mybatis, Spring MVC 패턴으로 간단한 홈페이지를 제작중입니다.

다름이 아니라, 회원 insert를 하려고 하는데 막히는 부분이 있어서 글을 올립니다.

form 태그 안에 input 박스에 값을 입력하면

ajax 통신으로 비동기 처리로 컨트롤러에 값들을 전달하려고 합니다.

브라우저에서 개발자 도구 네트워크로 보니까 415 에러가 납니다.

content type 때문에 그런 것 같은데 이리 저리 살펴봐도 오류가 해결이 안되네요 ....

[캡쳐] 이미지 : 값을 입력하고 버튼을 클릭하여서 request를 보낼 때 화면입니다.

이미지

: json형태로 파라미터를 날리고 싶은데 제대로 담긴건지 궁금합니다.

[JSP 페이지]

<%@ page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib uri="http://tiles.apache.org/tags-tiles" prefix="tiles"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>

<title>회원 가입</title>
<script>
    $(document).ready(function() {
                $("#backBtn").on(
                        "click",
                        function() {
                            $('#bodyContainer').children().remove();
                            $('#bodyContainer').load("http://localhost:8080/memberManager/memberList");
                        });

                $("#submitBtn").on("click",function(event) {
                    event.preventDefault();
                    insertMember();



                });

                function insertMember() {
                    var iptTags = $("#insertForm :input");
                    var data = {}; // 비어있는자바스크립트객체 만듬
                    $.each(iptTags, function(index, inpTag) {
                        var paramName = $(this).attr("id");
                        var paramValue = $(this).val();
                        if (paramName) {
                            data[paramName] = paramValue;
                        }
                    });

                    alert("insertMember()진입");

                        $.ajax({
                            url : "/memberManager/insertMember",
                            method : "post",
                            data : data,
                            dataType : "json",
                            contentType : "application/json;charset=UTF-8",
                            success : function(respBody) {
                                if (respBody.success) {
                                    alert(respBody.message);
                                    $('#bodyContainer').load("http://localhost:8080/memberManager/memberList");
                                } else {
                                    alert(respBody.message);
                                }
                            }
                        }); 
                }
            });
</script>

<h3>회원 가입</h3>
<br>

<div class="memberForm"
    style="width: 300px; margin-left: 10px; margin-top: 10px;">

    <form id="insertForm" method="post">
        <table class="table">
            <tr>
                <th>아이디</th>
                <th><input id="memId" name="memId" class="form-control" type="text"
                    style="width: 200px; height: 30px;" placeholder="아이디를 입력하세요" /></th>
            <tr>
                <th>이름</th>
                <th><input id="memName" name="memName" class="form-control" type="text"
                    style="width: 200px; height: 30px;" placeholder="이름을 입력하세요" /></th>
            </tr>
            <tr>
                <th>비밀번호</th>
                <th><input id="memPass" name="memPass" class="form-control" type="text"
                    style="width: 200px; height: 30px;" placeholder="비밀번호를 입력하세요" /></th>
            </tr>
            <tr>
                <th>별명</th>
                <th><input id="memNickname" name="memNickname" class="form-control" type="text"
                    style="width: 200px; height: 30px;" placeholder="별명을 입력하세요" /></th>
            </tr>
            <tr>
                <th>직업</th>
                <th><input id="memJob" name="memJob" class="form-control" type="text"
                    style="width: 200px; height: 30px;" placeholder="직업을 입력하세요" /></th>
            </tr>
            <tr>
                <th>주소</th>
                <th><input id="memAddr" name="memAddr" class="form-control" type="text"
                    style="width: 200px; height: 30px;" placeholder="주소를 입력하세요" /></th>
            </tr>
            <tr>
                <th>이메일</th>
                <th><input id="memEmail" name="memEmail" class="form-control" type="text"
                    style="width: 200px; height: 30px;" placeholder="이메일을 입력하세요" /></th>
            </tr>
            <tr>
                <th>연락처</th>
                <th><input id="memNumber" name="memNumber" class="form-control" type="text"
                    style="width: 200px; height: 30px;" placeholder="연락처를 입력하세요" /></th>
            </tr>
            <input id="memPoint" name="memPoint" class="form-control" type="hidden"
                style="width: 200px; height: 30px;" value="0" />
            <tr>
                <th>생년월일</th>
                <th><input id="memBirth" name="memBirth" class="form-control" type="text"
                    style="width: 200px; height: 30px;" placeholder="생년월일을 입력하세요" /></th>
            </tr>
            <tr>
                <th><button id="submitBtn" class="btn btn-primary" style="width: 190px;">회원 가입</button></th>
                <th><button id="backBtn" class="btn btn-primary" style="width: 190px;" >뒤로 가기</button></th>
            </tr>
        </table>
    </form>
</div>

[Controller]

package com.naver.pjw.web;

import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;

import javax.inject.Inject;
import javax.servlet.http.HttpSession;

import org.slf4j.Logger;
import org.slf4j.LoggerFactory;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestBody;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.bind.annotation.ResponseBody;

import com.naver.pjw.commons.ServiceResult;
import com.naver.pjw.service.IMemberService;
import com.naver.pjw.vo.MemberVO;

/**
 * Handles requests for the application home page.
 */
@Controller
@RequestMapping("/memberManager")
public class MemberManagerController {

    @Inject
    IMemberService service;

    private static final Logger logger = LoggerFactory.getLogger(MemberManagerController.class);

    @RequestMapping("/memberList")
    public String memberManager(Model model) {

        List<MemberVO> memberList = new ArrayList<MemberVO>();

        memberList = service.getMemberList();

        model.addAttribute("memberList", memberList);

        System.out.println(memberList);

        // 전달 할 jsp
        return "memberManager";
    }

    @RequestMapping(value ="/memberForm")
    public String memberForm(){
        logger.info("회원 등록 페이지입니다.");


        return "memberForm";
    }

    @RequestMapping(value="/insertMember", method = RequestMethod.POST, produces = "application/json;charset=UTF-8")
    @ResponseBody
    public Map<String, Object> insertMember(
            @RequestBody MemberVO memberVO){
        logger.info("회원가입 진입 성공");
        Map<String, Object> respBody = new HashMap<String, Object>();

        ServiceResult result = service.createMember(memberVO);

        if(result ==ServiceResult.SUCCESS){
            respBody.put("success", true);
            respBody.put("message", "회원가입을 성공하였습니다.");
        }else{
            respBody.put("success", false);
            respBody.put("message", "회원가입을 실패하였습니다.");
        }

        return respBody;
    }


    @RequestMapping(value="/memberDetailInfo", method = RequestMethod.GET, produces = "application/json;charset=UTF-8")
    public String memberDetail(
            Model model,
            String memId){
        logger.info("회원 상세 정보 조회 진입.");
        System.out.println(memId);
        // 멤버 객체 생성
        MemberVO memberVO = new MemberVO();
//       getMember() 값을 memberVO 객체에 저장

        memberVO = service.getMemebr(memId);
        // 모델 객체에 값 저장
        model.addAttribute("memberVO", memberVO);

        return "memberDetailInfo";
    }

    @RequestMapping(value ="/memberLogin")
    public String login (
            String memId, String memPass, HttpSession session){

        Map<String, Object> respBody = new HashMap<String, Object>();

        MemberVO memberVO = service.getMemebr(memId);

        if(memberVO != null && memPass.equals(memberVO.getMemPass())){
            respBody.put("result", "success");
            respBody.put("message", "로그인 성공");
            respBody.put("sessionMember", memberVO);
            session.setAttribute("sessionMember", memberVO);
        }else{
            respBody.put("result", "false");
            respBody.put("message", "로그인 실패");
            session.setAttribute("memId", "");          
        }

        return "http://localhost:8080";
    }


}

  • (•́ ✖ •̀)
    알 수 없는 사용자

1 답변

  • $.ajax({
        url : "/memberManager/insertMember",
        method : "post",
        data : JSON.stringify(data),
        dataType : "json",
        contentType : "application/json;charset=UTF-8",
        success : function(respBody) {
            if (respBody.success) {
                alert(respBody.message);
                $('#bodyContainer').load("http://localhost:8080/memberManager/memberList");
            } else {
                alert(respBody.message);
            }
        }
    }); 
    

    data: data 부분을 변경해주세요. json string으로 만들어 보내야 합니다. requestbody로 받으려면

    • (•́ ✖ •̀)
      알 수 없는 사용자

답변을 하려면 로그인이 필요합니다.

프로그래머스 커뮤니티는 개발자들을 위한 Q&A 서비스입니다. 로그인해야 답변을 작성하실 수 있습니다.

(ಠ_ಠ)
(ಠ‿ಠ)