Fetch() API 에 관해 질문드립니다.

조회수 4025회

ReactJS 페이지 컴포넌트에서 다른 도메인을 가지는 주소로부터 JSON 데이터를 콘솔창에 띄어보기 위해 아래와 같이 코드를 작성했습니다.

const url = 'http://example.com/';

fetch(
    url, {
        'Accept': 'application/json',
        'Content-Type': 'application/json',
        'Auth-Key': 'Lrmgdf...'
    },
    method: 'POST'
).then(
    response => response.json()
).then(
    data => console.log(data));

Chrome 에서 CORS 오류가 발생했지만, 이건 다른 도메인 상에서 호출하는거라 상관없을거라 생각했는데, 실제로 크롬에서는 다음과 같은 오류 로그를 보여주고 있습니다.

Unhandled Rejection (TypeError): Failed to execute 'fetch' on 'Window': Invalid name

호출하는 쪽이 PHP 로 작성되있고 Auth-Key 가 있어야 접근이 가능해 위와 같이 했는데, 구글링을 해도 마땅한 키워드 찾지 못 이렇게 질문드립니다.

관련있는 API 나 메서드만 알려주셔도 감사하겠습니다.

  • (•́ ✖ •̀)
    알 수 없는 사용자

1 답변

  • fetch()의 인자를 잘못 쓰신 것 아닐까요?

    https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch 를 보면 두 번째 인자 객체에 http header랑 method 옵션이 다 들어가는데요.

    e.g.

    fetch(url, {
      headers: {
        'Accept': 'application/json',
        'Content-Type': 'application/json',
        'Auth-Key': 'Lrmgdf...'
      },
      method: 'POST'
    })
    
    • (•́ ✖ •̀)
      알 수 없는 사용자
    • Fetch() 를 사용해보는게 이번이 처음이라 아직 파라미터를 정확히 숙지하지 못했네요. 우선 말씀해주신대로 링크 정보 보고 한번 다시 해봐야 될 것 같습니다. 소중한 정보 감사합니다. :D 알 수 없는 사용자 2018.1.30 18:05

답변을 하려면 로그인이 필요합니다.

프로그래머스 커뮤니티는 개발자들을 위한 Q&A 서비스입니다. 로그인해야 답변을 작성하실 수 있습니다.

(ಠ_ಠ)
(ಠ‿ಠ)