GET 요청 대신 OPTIONS 요청을 받는 이유는 무엇입니까?

GET 요청 대신 OPTIONS 요청을 받는 이유는 무엇입니까?

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.js" type="text/javascript"></script>
<script>
$.get("http://example.com/", function(data) {
     alert(data);
});
</script>

이는 해당 URL에 OPTIONS 요청을 수행한 다음 콜백을 호출하지 않습니다.

교차 도메인이 아닐 때는 잘 작동합니다.

jQuery는 그냥 전화를 해야 하지 않을까요?<script>노드가 로드되면 콜백을 수행합니까?(도메인 간이기 때문에) 결과를 얻을 수 없다는 것은 이해하지만, 괜찮습니다. 통화가 완료되기를 바랄 뿐입니다.이게 버그인가요, 아니면 제가 뭔가 잘못하고 있나요?

MDN에 따르면,

미리 설정된 요청

위에서 설명한 단순 요청과 달리 "미리 표시된" 요청은 실제 요청을 전송해도 안전한지 여부를 결정하기 위해 먼저 HTTP OPTIONS 요청 헤더를 다른 도메인의 리소스로 보냅니다.교차 사이트 요청은 사용자 데이터에 영향을 미칠 수 있기 때문에 이와 같이 사전에 표시됩니다.특히 다음과 같은 경우 요청이 사전에 표시됩니다.

• GET 또는 POST 이외의 메서드를 사용합니다.또한 POST를 사용하여 application/x-www-form-urlencoded, multipart/form-data 또는 text/plain 이외의 Content-Type으로 요청 데이터를 전송하는 경우(예: POST 요청이 application/xml 또는 text/xml을 사용하여 서버에 XML 페이로드를 전송하는 경우), 요청이 미리 표시됩니다.
• 요청에 사용자 지정 헤더를 설정합니다(예: 요청에서 X-PINGOTHER와 같은 헤더 사용).

옵션은 http://www.w3.org/TR/cors/ 에서 제공됩니다. 자세한 내용은 http://metajack.im/2010/01/19/crossdomain-ajax-for-xmpp-http-binding-made-easy/ 을 참조하십시오.

게시하려는 경우

꼭 해주세요!JSON.stringify당신의 양식 데이터와 다음과 같이 보냅니다.text/plain.

<form id="my-form" onSubmit="return postMyFormData();">
    <input type="text" name="name" placeholder="Your Name" required>
    <input type="email" name="email" placeholder="Your Email" required>
    <input type="submit" value="Submit My Form">
</form>

---

function postMyFormData() {

    var formData = $('#my-form').serializeArray();
    formData = formData.reduce(function(obj, item) {
        obj[item.name] = item.value;
        return obj;
    }, {});
    formData = JSON.stringify(formData);

    $.ajax({
        type: "POST",
        url: "https://website.com/path",
        data: formData,
        success: function() { ... },
        dataType: "text",
        contentType : "text/plain"
    });
}

"application/json"을 "text/plain"으로 변경하고 JSON.stringify(request)를 잊지 마십시오.

var request = {Company: sapws.dbName, UserName: username, Password: userpass};
    console.log(request);
    $.ajax({
        type: "POST",
        url: this.wsUrl + "/Login",
        contentType: "text/plain",
        data: JSON.stringify(request),

        crossDomain: true,
    });

저는 jQuery가 그런 URL이 주어졌을 때 자연스럽게 JSONP 요청을 할 것이라고 생각하지 않습니다.그러나 콜백에 사용할 인수를 알려줄 때 JSONP 요청을 수행합니다.

$.get("http://metaward.com/import/http://metaward.com/u/ptarjan?jsoncallback=?", function(data) {
     alert(data);
});

해당 인수를 사용하는 것은 전적으로 수신 스크립트에 달려 있으므로("jsoncallback"이라고 할 필요는 없습니다), 이 경우 함수는 절대 호출되지 않습니다.하지만, 당신이 metaward.com 의 스크립트를 실행하기를 원한다고 말했기 때문에, 그것으로 충분할 것입니다.

실제로 보안상의 이유로 도메인 간 AJAX(XMLHttp) 요청이 허용되지 않습니다(클라이언트 측에서 "제한된" 웹 페이지를 가져와 서버로 다시 보내는 것은 보안 문제입니다).

해결 방법은 콜백뿐입니다.이것은 새 스크립트 개체를 만들고 src가 JSON 값(myFunction({data})을 가진 콜백인 엔드사이드 JavaScript를 가리키고 있는 것입니다. myFunction은 데이터로 무언가를 수행하는 함수입니다(예: 변수에 저장).

저도 같은 문제가 있었습니다.개발 환경에서만 존재하는 PHP 스크립트에 헤더를 추가하는 것이 수정되었습니다.

이를 통해 도메인 간 요청이 허용됩니다.

header("Access-Control-Allow-Origin: *");

이것은 비행 전 요청에 대해 클라이언트가 원하는 헤더를 보내도 괜찮다는 것을 알려줍니다.

header("Access-Control-Allow-Headers: *");

이렇게 하면 요청을 수정할 필요가 없습니다.

개발 데이터베이스에 잠재적으로 유출될 수 있는 중요한 데이터가 있는 경우 이에 대해 다시 생각해 볼 수 있습니다.

저의 경우, 같은 웹 서버에 jQuery POST를 발행하고 있었기 때문에 CORS와 관련이 없었습니다.데이터가 JSON이었지만 dataType: 'json' 매개 변수를 누락했습니다.

콘텐츠가 없습니다(추가하지 않았습니다).위의 David Lopes의 답변과 같이 매개변수를 입력합니다.

다음 헤더의 도움으로 수정할 수 있었습니다.

Access-Control-Allow-Origin
Access-Control-Allow-Headers
Access-Control-Allow-Credentials
Access-Control-Allow-Methods

Nodejs에 있는 경우 복사/붙여넣기 할 수 있는 코드가 여기 있습니다.

app.use((req, res, next) => {
  res.header('Access-Control-Allow-Origin','*');
  res.header('Access-Control-Allow-Headers', 'Origin, X-Requested-With, Content-Type, Accept');
  res.header('Access-Control-Allow-Credentials', true);
  res.header('Access-Control-Allow-Methods', 'GET, POST, PUT, PATCH');
  next();
});

Firefox와 Opera(Mac에서도 테스트됨)는 이것의 교차 도메인성을 좋아하지 않는 것처럼 보입니다(그러나 Safari는 괜찮습니다).

원격 페이지를 컬링하려면 로컬 서버 사이드 코드를 호출해야 할 수도 있습니다.

언급URL : https://stackoverflow.com/questions/1256593/why-am-i-getting-an-options-request-instead-of-a-get-request