it-swarm.com.de

"Gemischter Inhalt blockiert", wenn HTTP ausgeführt wird AJAX Vorgang in einer HTTPS-Seite

Ich habe ein Formular, das ich (durch GET, wie es auf diese Weise erforderlich ist) an ein Crm (ViciDial) übermittle. Ich kann das Formular erfolgreich absenden, aber wenn ich tue, dass die Verarbeitungsdatei bei crm nur einen Erfolgstext enthält, war das alles.

Anstelle dieses Textes möchte ich auf meiner Website eine Dankeseite anzeigen. Daher habe ich mich dazu entschieden, das Formular mit AJAX zu senden und auf die Seite umzuleiten, die ich brauche. Allerdings erhalte ich diesen Fehler in meinem Text Browser:

Gemischter Inhalt: Die Seite unter ' https://page.com ' wurde über HTTPS geladen, forderte jedoch einen unsicheren XMLHttpRequest-Endpunkt an ' http://XX.XXX.XX.XXX/vicidial/non_agent_api.php?queries=query=data ' . Diese Anfrage wurde blockiert. Der Inhalt muss über HTTPS bereitgestellt werden.

Dies ist mein AJAX Skript:

    <script>
    SubmitFormClickToCall = function(){

        jQuery.ajax({
            url: "http://XX.XXX.XX.XX/vicidial/non_agent_api.php",
            data : jQuery("#form-click-to-call").serialize(),
            type : "GET",
            processData: false,
            contentType: false,
            success: function(data){
                window.location.href = "https://www.example.com/thank-you";
            }
        });
    }
    </script>

Das Setzen von https in der URL funktioniert nicht. Gibt es eine Möglichkeit, die Daten über GET zu übermitteln und den Benutzer auf meine Dankeseite umzuleiten?

=============================

Problem hierbei war gemischter Inhalt. Dies bedeutet, dass ich eine Seite über HTTPS geladen habe und versucht habe, über AJAX eine API zu treffen, die sich in HTTP befindet. Aber der Browser erlaubt uns nicht, das einfach zu tun. 

Wenn Sie also nicht festlegen können, dass die API HTTPS ist (dies war mein Fall), können wir dies immer noch anders angehen.

Das Hauptproblem war nicht das Problem des gemischten Inhalts. Es war, dass ich Daten an eine API übergeben und die Benutzer auf eine ausgefallene Dankeseite umleiten wollte. Anstatt AJAX zu verwenden, habe ich eine PHP-Datei erstellt, die die Daten erhält, sie mit curl an die API sendet (da dies serverseitig erfolgt, gibt es kein gemischtes Inhaltsproblem) und leitet meinen glücklichen Benutzer zu einer schicken Dankeseite weiter.

51
StormRage

Wenn Sie eine Seite über HTTPS in Ihren Browser laden, lehnt der Browser das Laden von Ressourcen über HTTP ab. Wenn Sie es versucht haben, die API-URL so ändern, dass HTTPS anstelle von HTTP verwendet wird, wird dieses Problem normalerweise gelöst. Ihre API darf jedoch keine HTTPS-Verbindungen zulassen. Aus diesem Grund müssen Sie entweder HTTP auf der Hauptseite erzwingen oder anfordern, dass HTTPS-Verbindungen zugelassen werden. 

Hinweis: Die Anfrage funktioniert weiterhin, wenn Sie zur API-URL wechseln, anstatt sie mit AJAX zu laden. Dies liegt daran, dass der Browser keine Ressource von einer gesicherten Seite lädt, sondern eine unsichere Seite lädt und diese akzeptiert. Damit es jedoch über AJAX verfügbar ist, sollten die Protokolle übereinstimmen.

56
Mikel Bitson

Ich habe dies behoben, indem der HTML-Seite der folgende Code hinzugefügt wurde, da wir die Drittanbieter-API verwenden, die nicht von uns kontrolliert wird.

<meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests"> 

Ich hoffe, das würde helfen, und auch für eine Aufzeichnung.

47
Sky

Wenn Sie nur eine Webseite besuchen, der Sie vertrauen und Sie schnell vorankommen möchten, müssen Sie nur Folgendes tun:

1- Klicken Sie auf das Schildsymbol ganz rechts in der Adressleiste.

 Allow mixed content in Google Chrome

2- Klicken Sie im Popup-Fenster auf "Trotzdem laden" oder "Unsicheres Skript laden" (abhängig von Ihrer Chrome-Version).


Wenn Sie Ihren Chrome-Browser auf IMMER (auf allen Webseiten) setzen möchten, lassen Sie gemischten Inhalt zu:

1- Drücken Sie in einem geöffneten Chrome-Browser auf Ihrer Tastatur Strg + Umschalt + Q, um das Schließen von Chrome zu erzwingen. Chrome muss vor den nächsten Schritten vollständig geschlossen sein.

2- Klicken Sie mit der rechten Maustaste auf das Google Chrome-Desktop-Symbol (oder den Link Startmenü). Wählen Sie Eigenschaften.

3- Fügen Sie am Ende der vorhandenen Informationen im Feld Ziel Folgendes hinzu: "--allow-running-insecure-content" (Vor dem ersten Bindestrich ist ein Leerzeichen vorhanden.)

4- Klicken Sie auf OK.

5- Öffnen Sie Chrome und versuchen Sie, den zuvor blockierten Inhalt zu starten. Es sollte jetzt klappen.

10
Juanma Menendez

Der Grund für diesen Fehler ist sehr einfach. Ihr AJAX versucht, über HTTP anzurufen, während Ihr Server über HTTPS ausgeführt wird, sodass Ihr Server das Anrufen Ihres AJAX verweigert. Dies kann behoben werden, indem die folgende Zeile in das head-Tag Ihrer HTML-Hauptdatei eingefügt wird:

<meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests"> 
1
Sobhan Niroula

Wenn Ihr API-Code auf einem node.js -Server ausgeführt wird, müssen Sie Ihre Aufmerksamkeit dort richten, nicht in Apache oder NGINX. Mikel hat Recht. Die Änderung der API-URL in HTTPS ist die Antwort. Wenn Ihre API jedoch einen node.js-Server aufruft, sollten Sie sie für HTTPS einrichten. Natürlich kann sich der node.js-Server an einem beliebigen nicht verwendeten Port befinden, es muss sich nicht um Port 443 handeln.

0
mcmacerson

Anstelle der Ajax Post-Methode können Sie zusammen mit dem Element ..__ ein dynamisches Formular verwenden. Es funktioniert auch, wenn die Seite in SSL geladen wird und die übergebene Quelle kein SSL ist.

Sie müssen den Wert des Elementelements festlegen.

Tatsächlich wird ein neues dynamisches Formular als Nicht-SSL-Modus in einer separaten Registerkarte des Browsers geöffnet, wenn für das Zielattribut '_blank' festgelegt wurde.

var f = document.createElement('form');
f.action='http://XX.XXX.XX.XX/vicidial/non_agent_api.php';
f.method='POST';
//f.target='_blank';
//f.enctype="multipart/form-data"

var k=document.createElement('input');
k.type='hidden';k.name='CustomerID';
k.value='7299';
f.appendChild(k);



//var z=document.getElementById("FileNameId")
//z.setAttribute("name", "IDProof");
//z.setAttribute("id", "IDProof");
//f.appendChild(z);

document.body.appendChild(f);
f.submit()
0
Proneet Ray