XMLHttpRequest zmienia POST do OPCJA

Question

mam ten kod:

net.requestXHR = function() { 
    this.xhr = null; 
    if(window.XMLHttpRequest === undefined) { 
     window.XMLHttpRequest = function() { 
      try { 
       // Use the latest version of the activex object if available 
       this.xhr = new ActiveXObject("Msxml2.XMLHTTP.6.0"); 
      } 
      catch(e1) { 
       try { 
        // Otherwise fall back on an older version 
        this.xhr = new ActiveXObject("Mxsml2.XMLHTTP.3.0"); 
       } 
       catch(e2) { 
        //Otherwise, throw an error 
        this.xhr = new Error("Ajax not supported in your browser"); 
       } 
      } 
     }; 
    } 
    else 
     this.xhr = new XMLHttpRequest(); 
} 
net.requestXHR.prototype.post = function(url, data) { 
    if(this.xhr != null) { 
     this.xhr.open("POST", url); 
     this.xhr.setRequestHeader("Content-Type", "application/json"); 
     this.xhr.send(data); 
    } 
} 

    var rs = new net.requestSpeech(); 
    console.log(JSON.stringify(interaction)); 
    rs.post("http://localhost:8111", JSON.stringify(interaction)); 

gdy wyślij wykonać, mam ten dziennik:

OPTIONS http://localhost:8111/ [HTTP/1.1 405 Method Not Allowed 74ms] 

aw localhost: 8111 mam serverResource reslet że akceptują stanowisko , jest to problem polityki tego samego pochodzenia? Zmodyfikowałem obiekt końcowy, aby umieścić nagłówek zezwalający na uruchomienie i przetestowałem go za pomocą innego żądania HTTP GET (w jquery) i działało dobrze. Mam problem z rozpoznaniem tego samego pochodzenia, ponieważ używam przeglądarki HTML5 i mój serwer umieszcza nagłówki w odpowiedzi, więc dlaczego wysyłanie pokazuje mi ten błąd? po co zmieniać POST dla OPCJI? Dzięki!

Możliwy duplikat ?: I nie myśleć, ale to prawda, problem jest same dla obu pytań, ale moje są odnosi ponieważ pytanie istnieje problem z przeglądarką, a drugi, pierwszy wskazuje na jquery . Z doświadczenia wynika, że ​​czas nie liczy się do duplikowania, odpowiedzi są różne, ale prawdą jest, że oba pytania uzupełniają się wzajemnie o .

Answer 1

Tak, jest to "problem z polityką tego samego pochodzenia". Wysyłasz żądanie do innego serwera lub do innego portu, co oznacza, że ​​jest to żądanie HTTP między witrynami. Oto co the documentation ma do powiedzenia o takich wniosków:

Dodatkowo dla metody żądania HTTP, które mogą powodować skutki uboczne w danych serwera (w szczególności metod HTTP innych niż GET, lub POST korzystanie z niektóre typy MIME), specyfikacja nakazuje przeglądarkom "preflightować" żądanie, żądając obsługiwanych metod od serwera za pomocą metody żądania HTTP OPTIONS, a następnie, po "zatwierdzeniu" z serwera, wysyłając rzeczywiste żądanie z faktycznym Metoda żądania HTTP.

Bardziej szczegółowy opis znajduje się w sekcji CORS standard (sekcja "Żądanie krzyżowe z preflightem"). Twój serwer musi zezwolić na żądanie OPTIONS i wysłać odpowiedź za pomocą nagłówków Access-Control-Allow-Origin, Access-Control-Allow-Headers i umożliwiających żądanie. Następnie przeglądarka wykona rzeczywiste żądanie POST.

Answer 2

Miałem dokładnie ten problem z kodu JavaScript, który wysłał treść ajax.

W celu umożliwienia Request Cross-Origin z Inspekcja wstępna Musiałem to zrobić w aspx, że otrzymywał petycję:

//Check the petition Method 
if (Request.HttpMethod == "OPTIONS") 
{ 
    //In case of an OPTIONS, we allow the access to the origin of the petition 
    string vlsOrigin = Request.Headers["ORIGIN"]; 
    Response.AddHeader("Access-Control-Allow-Origin", vlsOrigin); 
    Response.AddHeader("Access-Control-Allow-Methods", "POST"); 
    Response.AddHeader("Access-Control-Allow-Headers", "accept, content-type"); 
    Response.AddHeader("Access-Control-Max-Age", "1728000"); 
} 

trzeba być ostrożnym i sprawdzić, jakie są nagłówki zapytany przez twoją petycję. Sprawdziłem tych, którzy używają Skrzypka.

Mam nadzieję, że to komuś służy w przyszłości.

Answer 3

Jak inni podkreślili, jest to sprawa CORS.

To, jak sobie z tym poradzić w Nginx (na podstawie this source):

location/{ 
    if ($request_method = OPTIONS) { 
     add_header Access-Control-Allow-Origin "http://example.com"; 
     add_header Access-Control-Allow-Methods "GET, OPTIONS"; 
     add_header Access-Control-Allow-Headers "Authorization"; 
     add_header Access-Control-Allow-Credentials "true"; 
     add_header Content-Length 0; 
     add_header Content-Type text/plain; 
     return 200; 
    } 
} 

Jeśli chcesz zezwolić Cors wnioski z dowolnego pochodzenia, zamienianie

add_header Access-Control-Allow-Origin "http://example.com"; 

z

add_header Access-Control-Allow-Origin "*"; 

Jeśli nie korzystasz z autoryzacji, ten bit nie będzie potrzebny:

add_header Access-Control-Allow-Headers "Authorization"; 
add_header Access-Control-Allow-Credentials "true"; 

---

Dla API Zajmuję Potrzebowałem do białej 3 metody Żądanie: GET, POST i opcji, a to X-App-Id nagłówek, więc to nam, co skończyło się robi:

if ($request_method = OPTIONS) { 
    add_header Access-Control-Allow-Origin "*"; 
    add_header Access-Control-Allow-Methods "GET, POST, OPTIONS"; 
    add_header Access-Control-Allow-Headers "X-App-Id"; 
    add_header Content-Length 0; 
    add_header Content-Type text/plain; 
    return 200; 
}