가져오기를 사용할 때 \'mode: \'no-cors\'\'를 설정하면 SyntaxError가 발생하는 이유는 무엇입니까?

모드를 'no-cors'로 설정하는 동안 가져오기를 사용하여 API에 액세스할 때 오류 발생

JavaScript를 사용하여 가져오기 약속을 해결하려고 시도하는 동안 모드를 'no-cors'로 설정 -cors'는 이전 제안에 따라 오류가 발생했습니다.

모드를 'cors'로 설정하면 CORS 정책 차단 오류가 발생합니다. 제안된 대로 CORS를 비활성화하고 리소스를 불투명하게 가져오려는 의도로 모드를 'no-cors'로 변경하면 예기치 않은 오류가 발생했습니다.

Uncaught (in promise) SyntaxError: Unexpected end of input for return response.json()

설명

이 문제의 근본 원인 오류는 함수에 있습니다.

<code class="javascript">search() {
    return fetch(`${baselink}${summonerEndpoint}${summoner}${apikey}`, {mode: 'no-cors'}).then(response => {
      return response.json()
    }).then(jsonResponse => {
      console.log(jsonResponse);
      if (!jsonResponse.info) {
        return [];
      }
      return jsonResponse.info.items.map(info => ({
        id: info.id,
        accountId: info.accountId,
        name: info.name,
        profileIconId: info.profileIconId,
        revisionDate: info.revisionDate,
        summonerLevel: info.summonerLevel
      }));
    });
  }</code>

모드를 'no-cors'로 설정하면 브라우저가 CORS 관련 문제가 발생할 경우 자동으로 실패해야 함을 의미합니다. 이 경우 서버는 CORS를 사용하여 권한을 부여하지 않으며 요청이 자동으로 실패합니다.

따라서 빈 응답을 JSON으로 구문 분석하려는 후속 시도(response.json() 사용)에서는 SyntaxError가 발생합니다. 구문 분석할 데이터가 없습니다.

해결 방법

이 문제를 해결하려면 두 가지 주요 요구 사항이 있습니다.

1. 'no-cors' 모드를 비활성화합니다. 가져오기 요청에서 'mode: 'no-cors''를 제거합니다.
2. 서버에서 CORS 활성화: 서버가 적절한 Access-Control-Allow로 응답하는지 확인하세요. -교차 출처 요청에 대한 권한을 부여하기 위한 출처 헤더.

이 단계를 따르면 애플리케이션은 CORS 관련 오류 없이 데이터를 성공적으로 가져올 수 있습니다.

위 내용은 가져오기를 사용할 때 \'mode: \'no-cors\'\'를 설정하면 SyntaxError가 발생하는 이유는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!