오늘 버그 - Vue PUT 요청으로 데이터 제출

Vue PUT 요청 방식으로 데이터 전송

1. 문제 설명: 백엔드의 인터페이스는 PUT 방식을 사용하고 전단의 제출 데이터는 PUT 방식을 사용해야 한다

2. 해결 방법:postget에 대응하는 제출 방식을 사용하면 된다.PUT 방식에 대응하여 제출한 type을post로 쓰고 하나 더method=PUT 가능

셋째, 이상의 방법은 원생적인ajax를 사용하지 않고 제출할 때, 아래의 방식으로 제출할 때 또 안 된다

넷째, 솔루션:

1. 문제 설명: 백엔드의 인터페이스는 PUT 방식을 사용하고 백엔드의 제출 데이터는 PUT 방식을 사용해야 한다.

@RequestMapping(value = "/updateOnePersonById",method = RequestMethod.PUT)
public Boolean updateOnePersonById(@RequestParam Map map){
     
...
}

만약 전단 제출 방식과 후단 지정 방식이 일치하지 않는다면 Resolved [org.springframework.web.Http Request Method NotSupported Exception: Request method'PUT'not supported]가 자주 나타납니다
Resolved [org.springframework.web.HttpRequestMethodNotSupportedException: Request method ‘POST’ not supported]
Resolved [org.springframework.web.HttpRequestMethodNotSupportedException: Request method ‘GET’ not supported]
위와 같은 오류는 제출 방식이 일치하지 않아 발생한 것이다
2. 해결 방법:postget에 대응하는 제출 방식을 사용하면 된다.PUT 방식에 대응하여 제출한 type을post로 쓰고 하나 더method=PUT
***이 데이터를 처리해야 합니다. json 열에 속성을 추가해야 합니다. ***Vue 쓰기: 데이터에 대상을 추가하고 폼 데이터를 저장합니다. 이 데이터를 제출할 때 를 추가해야 합니다.method : “PUT”

...
data: {
updateForm: {},
}
...

**//     data   ， json         ** 
this.updateForm['_method'] = 'PUT';
$.ajax({
				url: "http://localhost:8080/updateOnePersonById",
				type: "post",
				data: vm.updateForm,
				success: function(result) {
					console.log("updateOnePersonByIdMsg", result);
					if (result) {
						alert("    ");
						//    ，       
						vm.toPage(vm.pageInfo.pageNum);
					} else {
						alert("    ");
					}
				}
			});

3. 이상의 방법은 원생적인 aax를 사용하지 않고 제출할 때, 아래의 방식으로 제출할 때 또 안 된다.

Vue.prototype.$http = axios


const result= await this.$http.put("http://localhost:8080/updateOnePersonById",vm.updateForm);

axios 방식으로 제출할 때 안 될 때가 있어요.
4. 해결 방안:
todo... 맏형이 해결책을 제시하신 걸 환영합니다.
필자의 해결 방안
1) type은put2로 직접 쓰기) contentType: "응용 프로그램/json"을 설정하고 3) 제출한 데이터를 json 데이터: JSON으로 전환합니다.stringify(vm.updateRoleAndPermission),
4) 백엔드의 controller request Mapping에 method = Request Method를 추가합니다.PUT,produces = {“application/json;charset=UTF-8”}
5) 매개변수 수신@RequestBody 메모 사용
직접 측정하면 효과가 있다.