Ho un modulo che sto inviando (tramite GET in quanto è richiesto in questo modo) a un crm (ViciDial). Posso inviare correttamente il modulo, tuttavia, se lo faccio, il file di elaborazione su crm farà semplicemente eco un testo di successo e il gioco è fatto.

Invece di quel testo, voglio visualizzare una pagina di ringraziamento sul mio sito Web, quindi ho deciso di utilizzare AJAX per inviare il modulo e reindirizzarlo alla pagina di cui ho bisogno, tuttavia ricevo questo errore sul mio browser:

Contenuto misto: la pagina " https://page.com " è stata caricata tramite HTTPS, ma ha richiesto un endpoint XMLHttpRequest non sicuro " http://XX.XXX.XX.XXX/vicidial/non_agent_api.php?queries=query=data '. Questa richiesta è stata bloccata; il contenuto deve essere offerto tramite HTTPS.

Questo è il mio script AJAX:

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

La semplice impostazione di https nell'URL non funzionerà, esiste un modo in cui posso inviare i dati tramite GET e reindirizzare l'utente alla mia pagina di ringraziamento?

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

Il problema qui era contenuto misto, questo significa che ho caricato una pagina tramite HTTPS e stavo cercando di colpire tramite AJAX un'API che era in HTTP. Ma il browser non ci consentirà di farlo.

Quindi, se non è possibile impostare l'API su HTTPS (questo era il mio caso), possiamo comunque affrontarlo in un modo diverso.

Il problema principale non era il problema del contenuto misto, era che volevo inviare i dati a un'API e reindirizzare gli utenti a una pagina di ringraziamento di fantasia. Invece di usare AJAX, ho creato un file php che riceve i dati e li invia usando curl all'API (poiché questo viene fatto lato server non ci sono problemi di contenuto misto) e reindirizza il mio utente felice a una pagina di ringraziamento fantasia.

Se carichi una pagina nel tuo browser usando HTTPS, il browser rifiuterà di caricare qualsiasi risorsa su HTTP. Come hai provato, la modifica dell'URL dell'API per avere HTTPS anziché HTTP risolve in genere questo problema . Tuttavia, la tua API non deve consentire le connessioni HTTPS. Per questo motivo, è necessario forzare HTTP nella pagina principale o richiedere che consentano le connessioni HTTPS.

Nota su questo: la richiesta continuerà a funzionare se vai all'URL dell'API invece di tentare di caricarlo con AJAX. Questo perché il browser non sta caricando una risorsa da una pagina protetta, invece sta caricando una pagina non sicura e la sta accettando. Affinché sia ​​disponibile tramite AJAX, tuttavia, i protocolli dovrebbero corrispondere.

Ho risolto questo problema aggiungendo il seguente codice alla pagina HTML, poiché stiamo utilizzando l'API di terze parti che non è controllata da noi.

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

Spero che questo possa aiutare, e anche per la cronaca.

Se stai solo visitando una pagina web di cui ti fidi e vuoi andare avanti velocemente, basta:

1- Fare clic sull'icona dello scudo all'estrema destra della barra degli indirizzi.

2- Nella finestra pop-up, fai clic su "Carica comunque" o "Carica script non sicuro" (a seconda della versione di Chrome).

Se desideri impostare il browser Chrome su SEMPRE (in tutte le pagine web) consenti contenuti misti:

1- In un browser Chrome aperto, premi Ctrl + Maiusc + Q sulla tastiera per forzare la chiusura di Chrome. Chrome deve essere completamente chiuso prima dei passaggi successivi.

2- Fare clic con il pulsante destro del mouse sull'icona di Google Chrome sul desktop (o sul collegamento del menu Start). Seleziona Proprietà.

3- Alla fine delle informazioni esistenti nel campo Target, aggiungi: "--allow-running-insecure-content" (C'è uno spazio prima del primo trattino.)

4- Fare clic su OK.

5- Apri Chrome e prova ad avviare il contenuto che è stato bloccato in precedenza. Ora dovrebbe funzionare.

Il motivo di questo errore è molto semplice. Il tuo AJAX sta tentando di chiamare su HTTP mentre il tuo server è in esecuzione su HTTPS, quindi il tuo server sta negando di chiamare il tuo AJAX. Questo può essere risolto aggiungendo la seguente riga all'interno del tag head del tuo file HTML principale:

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

Se il tuo codice API è in esecuzione su un server node.js , devi concentrare la tua attenzione lì, non in Apache o NGINX. Mikel ha ragione, cambiare l'URL dell'API in HTTPS è la risposta, ma se la tua API sta chiamando un server node.js, è meglio che sia impostato per HTTPS! E, naturalmente, il server node.js può trovarsi su qualsiasi porta inutilizzata, non deve essere la porta 443.

Invece di utilizzare il metodo Ajax Post, puoi utilizzare il modulo dinamico insieme all'elemento. Funzionerà anche se la pagina viene caricata in SSL e la fonte inviata non è SSL.

È necessario impostare il valore del valore dell'elemento del modulo.

In realtà il nuovo modulo dinamico si aprirà come modalità non SSL in una scheda separata del browser quando l'attributo target ha impostato "_blank"

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

Avevo lo stesso problema, ma per me il problema era ng build command. Stavo facendo "ng build --prod" l'ho corretto in "ng build --prod --base-href / applicationname /". e questo ha risolto il mio problema.

nel mio caso, il mio localhost era httpe la mia versione distribuita era https, quindi ho usato questo script per aggiungere il meta tag http-equiv solo per https:

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