“Proxy error: Could not proxy request xxx from yyy” from local ReactJS app
package.json
},
"proxy": "http://localhost:8080/",
"secure": false
}http라서 그런듯, 보안 설정을 false로 하면 되는듯??
Content type 'application/x-www-form-urlencoded;charset=UTF-8' not supported
Content type 'application/x-www-form-urlencoded;charset=UTF-8' not supported
오랜만에 웹 프로젝트를 진행하다가 위와 같은 오류가 발생하였습니다.
확인을 해보니 Controller에서 해당 오브젝트 앞에 @RequestBody가 선언되어 있었으며,
"application/x-www-form-urlencoded"를 사용할때는 @RequestBody를 제거해야 스프링에서 인식합니다.
[출처] Content type 'application/x-www-form-urlencoded;charset=UTF-8' not supported|작성자 Simpolor
리액트에서 axios global config를 아래와 같이 변경..
axios.defaults.headers.post['Content-Type'] = 'application/json; charset=UTF-8'; //json으로 던지기 위해서..
https://github.com/axios/axios#global-axios-defaults
axios.interceptors.request.use(request => {
console.log('Starting Request', JSON.stringify(request, null, 2))
return request
})
axios.interceptors.response.use(response => {
console.log('Response:', JSON.stringify(response, null, 2))
return response
})https://stackoverflow.com/questions/41751235/how-to-log-all-axios-calls-from-one-place-in-code
axios promise 반환 실수..
yield call response 값 undefined 문제가 발생했다. 분명 백엔드서버단에서는 문제가 없는데 왜 이런 문제가 나오는지 곰곰히 생각한 결과.. 약 3시간 소요...
프론트서버에서 axios promise 반환 해주는것을 깜빡했다..
export const recommentSave = ({ commentId, content }) => {
console.log('commentId', commentId, 'content', content);
//아아아앙아아아앙아!!!!!!! return을 안 해줬구나!!!!!!!
return client.post(`/comment/recomment/${commentId}`, JSON.stringify(content));
};//유저 이미지 업로드
export const userImg = ({ userId, data }) => {
// for (var pair of data.entries()) {
// console.log(pair[0] + ', ' + pair[1]);
// }
return client.put(`/user/${userId}/profileImageUrl`, data, config); //Json화 시켜줘서 오류가 떳구나!!! multipart인데!!! return문 또 빼먹었네..
};addCorsMappings 관련 에러
allowedOrigins cannot contain the special value "*"
에러 로그
java.lang.IllegalArgumentException: When allowCredentials is true, allowedOrigins cannot contain the special value "*"since that cannot be set on the "Access-Control-Allow-Origin" response header. To allow credentials to a set of origins, list them explicitly or consider using "allowedOriginPatterns" instead.
해결
- 스프링부트에서 CORS 설정할 때
.allowCredentials(true)와.allowedOrigins("*")는 동시에 설정 못하도록 업데이트되었다고 함. 모든 주소를 허용하는 대신 특정 패턴만 허용하는 것으로 적용해야한다고 변동되었음..allowedOrigins("*")대신.allowedOriginPatterns("*")를 사용하면 에러는 해결이 된다. .allowedOriginPatterns("https://*.domain.com")처럼 변경하면 https:microservice.division.domain.com 와 같은 도메인을 허용하게 됨.
참고
