> 웹 프론트엔드 > JS 튜토리얼 > CORS를 사용하여 JavaScript에서 도메인 간 POST 요청을 어떻게 만들 수 있습니까?

CORS를 사용하여 JavaScript에서 도메인 간 POST 요청을 어떻게 만들 수 있습니까?

Mary-Kate Olsen
풀어 주다: 2024-12-16 20:01:10
원래의
748명이 탐색했습니다.

How Can I Make Cross-Domain POST Requests in JavaScript using CORS?

JavaScript를 통해 도메인 간 POST 요청 보내기

도메인 간 요청은 웹 개발에서 흔히 발생하는 문제입니다. JavaScript에서는 도메인 간 POST 요청을 보내는 여러 가지 방법이 있지만 가장 간단한 방법 중 하나는 "Cross-Origin Resource Sharing"(CORS) 표준을 활용하는 것입니다.

CORS 구성 서버

POST 요청을 수신할 서버에서 CORS를 활성화합니다. by:

  1. 다음 응답 헤더 추가:

    • Access-Control-Allow-Origin: from.com(from.com을 요청)
    • 액세스 제어 허용 방법: POST
    • Access-Control-Max-Age: 1000
    • Access-Control-Allow-Headers: Content-Type, Authorization, X-Requested-With

교차 도메인 POST JavaScript

JavaScript에서는 fetch API를 사용하여 도메인 간 POST 요청을 보낼 수 있습니다.

fetch('https://to.com/postHere.php', {
  method: 'POST',
  mode: 'cors',
  headers: {
    'Content-Type': 'application/json'
  },
  body: JSON.stringify({ some: 'json' })
})
  .then(response => response.json())
  .then(responseData => {
    console.log(responseData.someKey);
  })
  .catch(error => {
    console.error('POST failed', error);
  });
로그인 후 복사

이 코드는 https://to에 POST 요청을 보냅니다. com/postHere.php는 다른 출처(from.com)에서 가져온 것입니다. CORS에 필요한 헤더를 설정하고 요청 본문을 JSON으로 문자열화합니다.

OPTIONS 요청 처리

클라이언트가 도메인 간 POST 요청을 보내면 브라우저가 먼저 서버가 요청을 지원하는지 확인하기 위해 서버에 OPTIONS 요청을 보냅니다. 서버는 POST 요청이 허용됨을 나타내기 위해 적절한 CORS 헤더로 이 요청에 응답해야 합니다.

고려 사항

  • 이 방법을 사용하려면 다음에서 CORS 지원이 필요합니다.
  • 요청은 서버에 두 가지 요청을 보냅니다. 즉, OPTIONS 요청과 POST가 이어집니다. 요청하세요.
  • CORS는 모든 기기, 특히 모바일 기기에서는 작동하지 않을 수 있습니다.

위 내용은 CORS를 사용하여 JavaScript에서 도메인 간 POST 요청을 어떻게 만들 수 있습니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
저자별 최신 기사
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿