Fetch()가 실제로 데이터를 가져 오지 않습니다.

Question

Fetch API를 살펴보기 시작한 후 실제로 작동하는 데 문제가 있습니다. 처음 접하는 것은 내가 잘못하고있는 것입니다. 내가 너무 잘 가지 않았다 Wunderground 날씨와 키있는 API에 갔다, 그리고

fetch("https://randomuser.me/api/").then((response) => response.json()) 
    .then((data) => console.log(data)) 
    .catch((error) => console.log(error)) 

:

내 첫 번째 시도는 놀라 울 일 임의의 사용자와 키가없는 API로했다 :

fetch("http://api.wunderground.com/api/{API-KEY}/conditions/q/CA/San_Francisco.json").then((response) => response.json()) 
    .then((data) => console.log(data)) 
    .catch((error) => console.log(error)) 

물어보기 전에 실제 API 키를 사용하여 URL 문자열의 "{API-KEY}"를 변경했습니다. 그러나 어떤 이유로 든이 API 호출은 아무 것도 반환하지 않습니다.

API URL은 Wunderground API 문서 (here)에서 직접 복사/붙여 넣기 할 수 있으며 Chrome의 주소 표시 줄에 붙여 넣으면 JSON을 성공적으로 반환합니다.

Here은 내가 사용하는 codepen.io (sans API-KEY)입니다.

Answer 1

wunderground URL에 https://을 사용하면 브라우저가 혼합 콘텐츠를 차단하지 않습니다.

그것이 작동하는 경우 https://developer.mozilla.org/en-US/docs/Web/Security/Mixed_content?utm_source=mozilla&utm_medium=firefox-console-errors&utm_campaign=default가