api가 안불러와지네요...
콘솔창에서 아래와 같이 입력해서 확인해보면 데이타가 잘 들어옵니다.
근데 강사님이 작성하신 utils.js 파일을 넣고 실행을 하면 데이타가 들어오지 않는거 같아서요
혹시 뭐가 잘못된걸까?
fetch('https://cataas.com/cat?json=true')
.then((response) => response.json())
.then((data) => console.log(data));위의 소스로 확인해보면 데이타가 들어옵니다.
//(1)utils.js에서 API함수 추가
const fetchCat = async (text) => {
const OPEN_API_DOMAIN = "https://cataas.com";
const response = await fetch(`${OPEN_API_DOMAIN}/cat/says/${text}?json=true`);
const responseJson = await response.json();
return `${OPEN_API_DOMAIN}/${responseJson.url}`;
console.log(fetchCat);
};//(2)수정
async function updateMainCat(value){ //수정
const newCat = await fetchCat(value); //추가
setMainCat(newCat); //수정
const nextCounter = counter +1;
setCounter(nextCounter);
jsonLocalStorage.setItem("counter", nextCounter);
}
function handleFormSubmit(e){
e.preventDefault();
setErrorMessage("");
if(value ===""){
setErrorMessage("빈 값으로 만들 수 없습니다.");
return;
}
updateMainCat(value); //(3)수정
}
며칠동안 계속 안되길래 무료 API 라 연결이 안될수 있다고 해서 기다리다가 며칠이 지나도 계속 안되는 상태여서 확인해보니 연결이 안되는거 같지는 않아서요,
실제고양이 api 데이터 받아오는 강의부분의 소스인데요, 생성버튼을 누르면 이미지에 엑박표시가 나면서
콘솔창에 보면 Failed to load resource 라고 뜹니다.
답변 4
3
위에 분 말씀대로 url 프로퍼티가 사라졌습니다
그래서 Json결과로 cat의 이미지를 찾아보았는데요
_id 프로퍼티로 주소를 넘겨줄 경우 동일한 결과를 가져올 수 있었습니다
fetchCat의 리턴을 이렇게 수정했습니다
// 변경 전
return `${OPEN_API_DOMAIN}/${responseJson.url}`
// 변경 후
return `${OPEN_API_DOMAIN}/cat/${responseJson._id}/says/${text}`
해결이 되셨으면 좋겠습니다! 화이팅!!
0
모두 감사합니다. 정확하게 답변 주셨어요.
강의 코드와 노트 수정했습니다.
https://github.com/milooy/cat-jjal-maker/blob/main/answers/29-useEffect.html#L48
이 코드 참고해서 fetchCat 함수를 변경해주시면 됩니다.
0
${OPEN_API_DOMAIN}/${responseJson.url}
이제는 responseJson안에 url 이라는 속성이 없어서 불러 올 수가 없다구요. 그래서 콘솔 찍어보시고 알아서 잘라내서 사용하시면 됩니다.
0
그 동안 open api 에서 json으로 들어오는 속성값을 변경하여서 안되는 것입니다.
responseJson.url 여기서 url 이라는 속성이 없기때문에 undefinded 로 나오며 주소역시 'https://cataas.com/undefinded' 로 나오니 엑박으로 뜰 수 밖에 없어요, 사용하시려면 콘솔창 찍어보시고 다시 잘라서 사용해야 뜹니다,, 저도 그렇게 잘라서 하니 나와요
API 적용 안되는 코드 수정 방법입니다.
0
70
1
고양이 이미지가 엑박이 뜨네요
0
50
1
npx 명령어 사용 불가
1
74
1
const 변수와 컴포넌트의 차이
0
88
1
강의노트
0
139
1
vite로 리액트 빌드한 후 깃허브에 배포하는 방법
0
323
1
빌드할때 dist 폴더가 만들어지는데요,
0
765
1
js파일 업로드 요청
0
135
1
변경된 api 사용시 text 안나오는 문제
0
141
1
메인글자수정...
1
267
3
디렉터리 구조 관련하여 참고할 만한 예시가 있을까요?
1
310
1
https://cataas.com/undefined 로 나오는데 왜그런건가요?
1
590
4
고양이 사진이 깨져요.ㅜㅜ
2
358
3
강의 노트 위치를 모르겠습니다
1
342
1
깃 강의노트 어디서 볼 수 있나요?
1
380
2
이해가 안되는 부분이 있어요
1
360
1
진유림 선생님 너무 궁금해서 질문드립니다 ㅜ
1
329
2
react에서 컴포넌트 만들 때 대문자를 쓰는 이유
2
1154
2
https://cataas.com/ 여기 도메인이 죽어서 이미지가 보이지 않습니다 ㅠ
1
328
2
index.js 내용이 바꼈네용
1
317
2
프로젝트에 사용할 상태와 로직 관리 라이브러리 훅 사용 질문입니다.
1
260
2
html 코드 오류
1
462
2
고양이 이미지 깨져요
1
337
2
고양이 이미지 링크 깨짐 문의
0
778
1





