홈>
웹 개발에 익숙하지 않고 json 본문이 첨부 된 가져 오기 요청을하는 데 문제가 있습니다. 지금 본문없이 페치 호출을하면 페치가 내 API (연결된 로그)에 연결하고 데이터베이스에서 값을 검색하여 문제없이 프런트 엔드로 다시 보냅니다. 그러나 가져 오기 요청에 두 번째 매개 변수로 본문 객체를 추가하면 가져 오기가 API에 연결되지 않습니다. 오류가 출력되지 않고 기다릴뿐 아니라 내 API는 연결된 오류를 기록하지 않습니다.
코드는 다음과 같습니다. 이것은 작동합니다 :
//this.props.chosenInterests is an object
async sample(){
//url-friendly string
const university = this.props.chosenUniversity.replace(/\s/, '+');
const query = '/interest/' + university;
try{
const response = await fetch(query, {});
if(response.ok){
const jsonResponse = await response.json();
globalVar = jsonResponse;
this.forceUpdate();
}
else{
throw new Error('Request Failed!');
}
}
catch (error){
console.log(error);
}
}
그렇지 않은 동안 :
//this.props.chosenInterests is an object
async sample(){
//url-friendly string
const university = this.props.chosenUniversity.replace(/\s/, '+');
const query = '/interest/' + university;
try{
const response = await fetch(query, {
method: 'POST',
headers: {
'Content-Type': 'application/json',
'Accept': 'application/json'
},
body: JSON.stringify(this.props.chosenInterests)
});
if(response.ok){
const jsonResponse = await response.json();
globalVar = jsonResponse;
this.forceUpdate();
}
else{
throw new Error('Request Failed!');
}
}
catch (error){
console.log(error);
}
}
여기 내 API가 있습니다 :
//already mounted router at /interest
interestRouter.get('/:university', (req, res, next) => {
const university = req.params.university.replace(/\+/g, ' ');
console.log('Connected.');
db.all('SELECT * FROM Table WHERE Table.university = $university', {$university : university},
(error, result) => {
if(error){
next(error);
}
else{
res.json(result);
}
}
)
});
도움이 될 것입니다. 왜 오류가 발생하지 않는지 혼란스러워합니다.
- 답변 # 1
관련 자료
- node.js - 로컬 개발 Express REST API + react SPA에 쿠키가 설정되지 않았습니다
- reactjs - 반응을 위해 graphql에서 데이터 가져 오기
- javascript - axios를 사용하여 React 앱에서 네트워크없이 작업
- javascript - 고유 키 경고없이 React를 사용하여 머티리얼 UI 그리드를 렌더링하려면 어떻게해야합니까?
- javascript - 반응에서 표현으로의 오류 404 POST 양식 데이터
- json - API 반응 네이티브에서 개체 목록 가져 오기
- reactjs - react - jsx없이 컴포넌트 통합시 오류
- javascript - React useEffect로 데이터 가져 오기 및 조건부 렌더링
- javascript - React stack navigation, 경로없이 상태를 전달하는 방법
- reactjs - 반응에서 표현으로 버튼 값 전달
- javascript - git없이 반응 앱을 만드는 방법 (git 건너 뛰기)?
- javascript - GraphQL 쿼리가 React에서 성공적으로 가져 오지 않습니다
- javascript - React는 가져 오지 않고 작동합니다
- reactjs - eslintrcjs for React 17 and JSX without import 'react'
- reactjs - indexhtml 대신 Express에서 사용 경로를 반응
관련 질문
- reactjs : 모든 약속이 성공하기를 기다리는 중
- javascript : 콘솔에서 'Uncaught (in promise) SyntaxError'를 해결하는 방법은 무엇입니까?
- javascript : 음악 앱을 만들고 있습니다. 재생 업데이트 /계산 방법
- javascript : 비동기 약속 onClick ()의 우선 순위를 지정하는 방법은 무엇입니까?
- node.js : sequelize를 사용하여 ID를 기반으로 행 값 업데이트
- node.js : Express와 동일한 출처에서 React를 제공 할 때 React에서 요소를 렌더링하는 데 문제가 있습니다.
- node.js : 요청 된 리소스에 "Access-Control-Allow-Origin"헤더가 없습니다 — localhost
- javascript : 약속 해결 함수가 정의되지 않음을 반환합니다.
- node.js : Express 서버에서 React 앱을 렌더링하면 이점이 있습니까?
- mysql : 새 게시물을 추가 한 후 내 뉴스 피드를 업데이트하려면 어떻게해야합니까?
POST가 실패한 이유는 Express 스크립트가 POST가 아닌 GET을 찾고 있기 때문입니다. 다음과 같이 변경하면
그러면 req.body에서 POST 본문을 볼 수 있습니다.