Firefox "Cross-Origin Request Blocked" nonostante le intestazioni


119

Sto provando a fare una semplice richiesta cross-origin e Firefox la blocca costantemente con questo errore:

Richiesta tra origini bloccata: la politica della stessa origine non consente la lettura della risorsa remota su [url]. Questo può essere risolto spostando la risorsa nello stesso dominio o abilitando CORS. [Url]

Funziona bene in Chrome e Safari.

Per quanto ne so, ho impostato tutte le intestazioni corrette sul mio PHP per consentire il funzionamento. Ecco cosa risponde il mio server

HTTP/1.1 200 OK
Date: Mon, 23 Jun 2014 17:15:20 GMT
Server: Apache/2.2.22 (Debian)
X-Powered-By: PHP/5.4.4-14+deb7u8
Access-Control-Allow-Origin: *
Access-Control-Allow-Methods: GET, POST, OPTIONS
Access-Control-Allow-Headers: Content-Type
Access-Control-Request-Headers: X-Requested-With, accept, content-type
Vary: Accept-Encoding
Content-Length: 186
Content-Type: text/html

Ho provato a utilizzare Angular, jQuery e un oggetto XMLHTTPRequest di base, in questo modo:

var data = "id=1234"
var request = new XMLHttpRequest({mozSystem: true})
request.onload = onSuccess;
request.open('GET', 'https://myurl.com' + '?' + data, true)
request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded')
request.send()

... e funziona in tutti i browser tranne Firefox. Qualcuno può aiutare con questo?


Potete fornire una traccia completa di tutte le richieste e risposte? O fornire almeno un sito di prova? Se il sito web accede all'origine remota http, https, file? mozSystemnon è supportato per i siti Web normali, ma solo per app firefox-os , quindi elimina questa opzione.
nmaier

1
Intestazioni @nmaier durante l'invio come POST anziché GET: Accept application/json, text/plain, */* Accept-Encoding gzip, deflate Accept-Language en-US,en;q=0.5 Content-Length 35 Content-Type application/x-www-form-urlencoded; charset=UTF-8 Host [url] Origin [url] Referer [referrer url] User-Agent Mozilla/5.0 (Macintosh; Intel Mac OS X 10.9; rv:30.0) Gecko/20100101 Firefox/30.0 Errore: Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at [url]. This can be fixed by moving the resource to the same domain or enabling CORS. [url]
Godwhacker

2
@nmaier In realtà sembra che questo sia una sorta di problema con il certificato di sicurezza sul sito a cui sto accedendo - Firefox sta solo dando un errore falso. Se aggiungo il sito all'elenco delle eccezioni, funziona bene.
Godwhacker

Risposte:


121

Si scopre che questo non ha nulla a che fare con CORS: era un problema con il certificato di sicurezza. Errori fuorvianti = 4 ore di mal di testa.


3
Ho appena avuto questo problema esatto, l'errore è troppo generico e per di più Chrome e Firefox utilizzano archivi di certificati diversi, quindi è più difficile eseguire il debug. Avrei dovuto sospettarlo quando il mio proxy non ha catturato alcuna richiesta OPTIONS (si stava interrompendo durante l'handshake SSL).
Daniel Correia

4
Godwhacker, forse sono nello stesso problema. Come hai scoperto che era il certificato di sicurezza? Dove puoi vederlo?
Leone

9
Nel mio caso avevo un'app angolare che effettuava chiamate a un altro server, entrambi utilizzando certificati firmati internamente. Tuttavia, Firefox non si fida automaticamente del certificato perché non è riconosciuto da un'autorità pubblica. Quindi dovevo assicurarmi che i certificati per entrambi i server fossero aggiunti come eccezioni in Firefox prima che questo problema scomparisse.
Sam Storie

3
Per me la soluzione era impostare withCredentials=truesull'istanza XHR; in caso contrario, Firefox non è riuscito a utilizzare il certificato client durante la richiesta (ha funzionato bene in Chrome, tuttavia).
Clint Harris

1
Il commento di @SamStorie sembra più una risposta che questa. Grazie
Naga

26

Ho scoperto che il mio problema era che il server a cui ho inviato la richiesta incrociata aveva un certificato non attendibile.

Se vuoi connetterti a un interdominio con https, devi prima aggiungere un'eccezione per questo certificato.

Puoi farlo visitando il link bloccato una volta e aggiungendo l'eccezione.


5
Ciò non aiuta particolarmente chiunque visiti il ​​tuo sito, a meno che tu non sia felice di mettere un messaggio lì che dice "Se stai usando Firefox, vai su questo sito e aggiungilo all'elenco delle eccezioni"
Godwhacker

@ Cracker0dks "visita il link bloccato una volta e aggiungi l'eccezione" potresti spiegare dove aggiungere l'eccezione? Sto usando Firefox Quantum. TIA
Paul

1
si naviga al link di cui si lamenta firefox direttamente. Quindi ottieni l'avviso del certificato. Consenti il ​​certificato. Visita di nuovo il tuo sito principale.
Cracker0dks

26

Mi sono imbattuto in questa domanda dopo aver scoperto che le richieste in Firefox venivano bloccate con il messaggio:

Motivo: richiesta CORS non riuscita

Dopo aver tirato fuori i capelli ho scoperto che un'estensione per Firefox appena installata, Privacy Badger, stava bloccando le richieste.

Se arrivi a questa domanda dopo esserti grattato la testa, prova a controllare per vedere quali estensioni hai installato per vedere se qualcuno di loro sta bloccando le richieste.

Vedere Motivo: la richiesta CORS non è riuscita su MDN per i dettagli.


come hai capito quale estensione sta bloccando le richieste? Sto riscontrando lo stesso problema, poiché la richiesta riesce in Firefox con un nuovo profilo (quindi senza estensioni)
Ciprian Tomoiagă

1
Ho fatto clic su ciascuna estensione per vedere se c'erano riferimenti al blocco dei contenuti per il particolare sito con cui stavo riscontrando un problema. Ghostery aveva una voce, quindi ho contrassegnato il sito come attendibile, ho ricaricato la pagina e le richieste sono andate a buon fine.
Professore di programmazione

1
Grazie! Ho anche scoperto l'estensione Project Insight che fornisce una panoramica delle autorizzazioni di tutte le estensioni. addons.mozilla.org/en-US/firefox/addon/project-insight
Ciprian Tomoiagă

1
@awendt Oof. Privacy Badger anche per me. Grazie.
Jason Leach,


12

Se non hai un certificato 'reale' (e quindi ne utilizzi uno autofirmato), in FireFox puoi andare su:

Options > Privacy & Security > (scroll to the bottom) View Certificates > Add Exception.

Lì, inserisci la posizione, ad esempio: https: //wwww.myserver: myport


questo ha funzionato per me quando il mio CORS funziona in tutti gli altri browser eccetto Firefox con l'errore -> Richiesta Cross-Origin bloccata: la stessa politica di origine non consente la lettura della risorsa remota su localhost: 44304 / v1 / search . (Motivo: richiesta CORS non riuscita).
JGilmartin

5

Solo una parola di avvertimento. Finalmente ho risolto il problema con Firefox e CORS.

La soluzione per me era questo post

Impostazione di CORS (condivisione di risorse tra le origini) su Apache con intestazioni di risposta corrette che consentono tutto attraverso | Benjamin Horn

Tuttavia Firefox si è comportato davvero, davvero strano dopo aver impostato quelle intestazioni sul server Apache (nella cartella .htaccess).

Ho aggiunto un sacco di console.log("Hi FF, you are here A")ecc. Per vedere cosa stava succedendo.

All'inizio sembrava che fosse appeso xhr.send(). Ma poi ho scoperto di non essere arrivato a questa affermazione. Ne ho piazzato un altro console.logsubito prima e non ci sono arrivato, anche se non c'era niente tra l'ultimo console.loge il nuovo. Si è solo fermato tra le dueconsole.log .

Riordinare le righe, cancellare, per vedere se c'era qualche carattere strano nel file. Non ho trovato niente.

Il riavvio di Firefox ha risolto il problema.

Sì, dovrei segnalare un bug. È solo che è così strano quindi non so come riprodurlo.

AVVISO : E, oh, ho appena fatto le Header always setparti, non la Rewrite*parte!


Stessa storia per me oggi, essenzialmente. Il riavvio di Firefox lo ha risolto. Più di 5 anni dopo.
Søren Mortensen

3

Basta aggiungere

<IfModule mod_headers.c>
    Header set Access-Control-Allow-Origin "*"
</IfModule>

al .htaccessfile nella radice del sito Web a cui stai tentando di connetterti.


Va bene se vuoi impostarlo per accettare richieste da qualsiasi luogo; non va bene se non lo fai, che è l'intero punto dell'intestazione.
Godwhacker

2

Per i posteri, controlla anche i log del server per vedere se la risorsa richiesta sta restituendo un 200.

Mi sono imbattuto in un problema simile, in cui tutte le intestazioni corrette venivano restituite nella richiesta ajax pre-volo, ma il browser ha segnalato che la richiesta effettiva era bloccata a causa di intestazioni CORS errate.

Si è scoperto che la pagina richiesta restituiva un errore 500 a causa di un codice errato, ma solo quando è stato recuperato tramite CORS. Il browser (sia Chrome che Firefox) ha erroneamente segnalato che mancava l'intestazione Access-Control-Allow-Origin invece di dire che la pagina restituiva un 500.


1

Prova questo, dovrebbe risolvere il tuo problema

  1. Nel tuo config.php, aggiungi www pre nel tuo dominio.com. Per esempio:

    HTTP define('HTTP_SERVER', 'http://domain name with www/');
    HTTPS define('HTTPS_SERVER', 'http://domain name with www/');
  2. Aggiungilo al tuo file .htaccess

    RewriteCond %{REQUEST_METHOD} OPTIONS RewriteRule ^(.*)$ $1 [R=200,L]

1

Per me, risulta che stavo impostando l' Access-Control-Allow-Originintestazione della risposta su uno specifico (e corretto) host.comma doveva essere restituito come http://host.cominvece. Cosa fa Firefox? Ingoia silenziosamente la richiesta GET e restituisce uno stato 0 all'XHR, senza output di avvisi alla console javascript, mentre per altri errori simili direbbe almeno qualcosa. Ai ai.


1
Sembra che lo schema sia previsto, guardando gli esempi su w3.org/TR/cors ma comunque grazie, anch'io stavo facendo la cosa sbagliata e sì, manca il messaggio di errore di Firefox.
Richard Green,

1

Per eseguire il debug, controlla i log del server, se possibile. Firefox restituisce errori CORS nella console per tutta una serie di motivi.

Uno dei motivi è anche il plugin uMatrix (e immagino anche NoScript e simili).


0

Ho affrontato un problema simile e penso sia valido essere registrato come l'ho risolto:

Ho un sistema costruito fondamentalmente su Symfony 3. Per autoapprendimento e scopi di prestazioni ho deciso di scrivere alcuni script usando GoLang, anche un'API con accesso pubblico.

L'API My Go prevede i parametri del formato Json e restituisce anche la risposta del formato Json

Per chiamare quei GoApi che sto usando, la maggior parte, $ .ajax (jQuery) Il primo test è stato un inganno: il (non) famoso pop-up "Cross-Origin Request Blocked"! Quindi, ho provato a impostare "Access-Control-Allow-Origin: *" su apache conf, htaccess, php, javascript e ovunque potessi trovare su google!

Ma, anche, lo stesso errore frustrante !!!

La soluzione era semplice: dovevo fare richieste "POST" invece di "GET".

Per ottenere ciò ho dovuto regolare entrambi, GoLang e JavaScript per utilizzare GET! Una volta fatto, niente più richieste Cross-Origin bloccate per me !!!

Spero che sia d'aiuto

PS:

Sto usando Apache e Vhost, su Directory Block che ho

  Header always set Access-Control-Allow-Origin "*"
  Header always set Access-Control-Allow-Methods "POST, GET, OPTIONS, DELETE, PUT"

Ricorda: "*" significa che accetti richieste da chiunque !!! (Che potrebbe essere una mancanza di sicurezza) Nel mio caso va bene, perché sarà un'API pubblica

PS2: le mie intestazioni

Intestazioni di risposta

Access-Control-Allow-Credentials    true
Access-Control-Allow-Headers    Authorization
Access-Control-Allow-Methods    GET, POST, PUT
Access-Control-Allow-Origin http://localhost
Content-Length  164
Content-Type    application/json; charset=UTF-8
Date    Tue, 07 May 2019 20:33:52 GMT

Intestazioni richiesta (469 B)

Accept  application/json, text/javascript, */*; q=0.01
Accept-Encoding gzip, deflate
Accept-Language en-US,en;q=0.5
Connection  keep-alive
Content-Length  81
Content-Type    application/x-www-form-urlencoded; charset=UTF-8
Host    localhost:9003
Origin  http://localhost
Referer http://localhost/fibootkt/MY_app_dev.php/MyTest/GoAPI
User-Agent  Mozilla/5.0 (Macintosh; Intel …) Gecko/20100101 Firefox/66.0

0

Se le risposte di cui sopra non aiutano, controlla se il server di backend è attivo e in esecuzione o meno, poiché nel mio caso il server si è bloccato e questo errore risulta essere totalmente fuorviante.


0

Nel mio caso era il mio ADBLOCKER ! Per qualche motivo è stato abilitato sul mio localhost e ha causato questo errore in Firefox.

Disabilitare o disinstallare il plug-in dovrebbe risolvere questo problema.

Nel tuo caso, potrebbe non essere un adblocker ma un altro plugin per Firefox. Provalo prima in incognito senza plug-in per determinare se questo è il problema, quindi disabilita sistematicamente i plug-in finché non trovi il colpevole.


-3

I file sono autoesplicativi. Crea un file, chiamalo come vuoi. Nel mio caso jq2.php.

<html>
<head>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>
    // document is made ready so that the program starts when we load this page       
    $(document).ready(function(){

        // it tells that any key activity in the "subcat_search" filed will execute the query.
        $("#subcat_search").keyup(function(){

            // we assemble the get link for the direction to our engine "gs.php". 
            var link1 = "http://127.0.0.1/jqm/gs.php?needle=" + $("#subcat_search").val();

            $.ajax({
                url: link1,
                // ajax function is called sending the input string to "gs.php".
                success: function(result){
                    // result is stuffed in the label.
                    $("#search_val").html(result);
                }
            });
        })   

    });
</script>
</head>

<body>

<!-- the input field for search string -->
<input type="text" id="subcat_search">
<br>
<!-- the output field for stuffing the output. -->
<label id="search_val"></label>

</body>
</html>

Ora includeremo un motore, creeremo un file, lo chiameremo come preferisci. Nel mio caso è gs.php.

$head = "https://maps.googleapis.com/maps/api/place/textsearch/json?query="; //our head
$key = "your key here"; //your key
$hay = $_GET['needle'];

$hay = str_replace(" ", "+", $hay); //replacing the " " with "+" to design it as per the google's requirement 
$kill = $head . $hay . "&key=" . $key; //assembling the string in proper way . 
print file_get_contents($kill);

Ho cercato di mantenere l'esempio il più semplice possibile. E poiché esegue il collegamento a ogni pressione di un tasto, la quota della tua API verrà consumata abbastanza velocemente.

Ovviamente non c'è fine alle cose che possiamo fare, come mettere i dati in una tabella, inviarli al database e così via.


Si prega di non pubblicare la stessa risposta più di una volta. E assicurati che la tua risposta risponda effettivamente alla domanda. Se hai bisogno di indirizzare qualcuno altrove per ulteriori informazioni, non è una buona risposta.
elixenide

Ciao, ho usato il link perché contiene alcune informazioni in più come i prerequisiti ecc. Se ritieni che sia appropriato, lo rimuoverò.
Harsh Mehta
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.