Ich habe ein Formular, das ich (über GET, wie es auf diese Weise erforderlich ist) an ein crm (ViciDial) sende. Ich kann das Formular jedoch erfolgreich senden, wenn ich dies tue, gibt die Verarbeitungsdatei bei crm nur einen Erfolgstext wieder und das wars.

Anstelle dieses Textes möchte ich eine Dankesseite auf meiner Website anzeigen. Daher habe ich mich entschieden, AJAX zu verwenden, um das Formular zu senden und es auf die benötigte Seite umzuleiten. In meinem Browser wird jedoch folgende Fehlermeldung angezeigt:

Gemischter Inhalt: Die Seite unter " https://page.com " wurde über HTTPS geladen, forderte jedoch einen unsicheren XMLHttpRequest-Endpunkt " http://XX.XXX.XX.XXX/vicidial/non_agent_api.php?queries=query=data" an '. 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>

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

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

Problem hier 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 befand. Aber der Browser erlaubt uns nicht, das einfach zu tun.

Wenn Sie die API also nicht auf HTTPS einstellen können (dies war mein Fall), können wir dies dennoch auf andere Weise angehen.

Das Hauptproblem war nicht das Problem mit gemischten Inhalten, sondern dass ich Daten an eine API senden und die Benutzer auf eine ausgefallene Dankesseite umleiten wollte. Anstatt AJAX zu verwenden, habe ich eine PHP-Datei erstellt, die die Daten empfängt und sie mit Curl an die API sendet (da dies serverseitig erfolgt, gibt es kein Problem mit gemischten Inhalten) und meinen zufriedenen Benutzer auf eine ausgefallene Dankesseite weiterleitet.

Wenn Sie eine Seite mit HTTPS in Ihren Browser laden, lehnt der Browser das Laden von Ressourcen über HTTP ab. Wenn Sie die API-URL so geändert haben, dass HTTPS anstelle von HTTP verwendet wird, wird dieses Problem normalerweise behoben . 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 dazu: Die Anforderung funktioniert weiterhin, wenn Sie zur API-URL wechseln, anstatt zu versuchen, sie mit AJAX zu laden. Dies liegt daran, dass der Browser keine Ressource aus einer gesicherten Seite lädt, sondern eine unsichere Seite lädt und dies akzeptiert. Damit es jedoch über AJAX verfügbar ist, sollten die Protokolle übereinstimmen.

Ich habe dieses Problem behoben, indem ich der HTML-Seite folgenden Code hinzugefügt habe, da wir die Drittanbieter-API verwenden, die nicht von uns gesteuert wird.

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

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

Wenn Sie nur eine Webseite besuchen, der Sie vertrauen, und schnell vorankommen möchten, gehen Sie einfach wie folgt vor:

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

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

Wenn Sie Ihren Chrome-Browser IMMER (auf allen Webseiten) einstellen möchten, lassen Sie gemischte Inhalte zu:

1- Drücken Sie in einem geöffneten Chrome-Browser Strg + Umschalt + Q auf Ihrer Tastatur, 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-Desktopsymbol (oder den Link zum Startmenü). Wählen Sie Eigenschaften.

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

4- Klicken Sie auf OK.

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

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

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

Wenn Ihr API-Code auf einem node.js- Server ausgeführt wird, müssen Sie Ihre Aufmerksamkeit dort konzentrieren, nicht in Apache oder NGINX. Mikel hat recht, das Ändern der API-URL in HTTPS ist die Antwort, aber wenn Ihre API einen node.js-Server aufruft, sollte sie besser für HTTPS eingerichtet werden! Und natürlich kann sich der node.js-Server an jedem nicht verwendeten Port befinden, es muss nicht Port 443 sein.

Anstatt die Ajax Post-Methode zu verwenden, können Sie zusammen mit dem Element ein dynamisches Formular verwenden. Es funktioniert auch dann, wenn die Seite in SSL geladen ist und die übermittelte Quelle kein SSL ist.

Sie müssen den Wert des Formularelements festlegen.

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

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()

Ich war das gleiche Problem, aber für mich war das Problem ng build command. Ich habe "ng build --prod" gemacht. Ich habe es auf "ng build --prod --base-href / applicationname /" korrigiert. und das löste mein Problem.

In meinem Fall war mein localhost httpund meine bereitgestellte Version https, daher habe ich dieses Skript verwendet, um ein http-equiv-Meta-Tag nur für https hinzuzufügen:

if (window.location.protocol.indexOf('https') == 0){
  var el = document.createElement('meta')
  el.setAttribute('http-equiv', 'Content-Security-Policy')
  el.setAttribute('content', 'upgrade-insecure-requests')
  document.head.append(el)
}