utilizzando javascript per rilevare se l'url esiste prima della visualizzazione in iframe

Question

Sto usando javascript per passare un URL dinamico a iframe src. ma a volte l'url non esiste, come potrei rilevare l'url inesistente in anticipo, in modo da poter nascondere l'iframe che con errore 404.

Answer 1

Puoi provare a fare un semplice GET sulla pagina, se ottieni un 200 indietro significa che la pagina esiste. Prova questo (usando jQuery), la funzione è la funzione di callback riuscita su un carico di pagina riuscito. Nota questo funzionerà solo sui siti all'interno del tuo dominio per prevenire XSS. Altri domini dovranno essere gestite lato server

$.get(
    yourURL, 
    function(data, textStatus, jqXHR) { 
     //load the iframe here... 
    } 
); 

Answer 2

Use a XHR and see if it responds you a 404 or not.

var request = new XMLHttpRequest(); 
request.open('GET', 'http://www.mozilla.org', true); 
request.onreadystatechange = function(){ 
    if (request.readyState === 4){ 
     if (request.status === 404) { 
      alert("Oh no, it does not exist!"); 
     } 
    } 
}; 
request.send(); 

Ma si noti che funziona solo sulla stessa origine. Per un altro host, dovrai fare use a server-side language per farlo, che dovrai capire da solo.

Answer 3

È possibile testare l'url tramite AJAX e leggere il codice di stato, ovvero se l'URL si trova nello stesso dominio.

Se si tratta di un dominio remoto, è possibile immettere have a server script nel proprio dominio.

Answer 4

A causa della mia scarsa reputazione, non ho potuto commentare la risposta di Derek 朕 會 功夫. Ho provato quel codice così com'è e non ha funzionato bene. Ci sono tre problemi sul codice di Derek 朕 會 功夫.

1. La prima è che il tempo di inviare la richiesta asincrona e cambiare il suo 'status' di proprietà è più lenta per eseguire l'espressione successiva - se (request.status === "404"). Quindi request.status alla fine, a causa della banda internet, rimarrà sullo stato 0 (zero) e non raggiungerà il codice subito sotto se. Risolvere il problema è semplice: cambia 'true' in 'false' sul metodo open della richiesta ajax. Ciò causerà un blocco breve (o meno) del codice (dovuto alla chiamata sincrona), ma cambierà lo stato della richiesta prima di raggiungere il test su if.

2. Il secondo è che lo stato è un numero intero. Utilizzando l'operatore di confronto javascript '===' stai cercando di confrontare se l'oggetto del lato sinistro è identico a quello sul lato destro. Per rendere questo lavoro ci sono due modi:

   • Rimuovere le virgolette che circonda 404, rendendolo un numero intero;
   • Utilizzare l'operatore javascript '==' in modo da verificare se i due oggetti sono simili.

3. Il terzo è che l'oggetto XMLHttpRequest funziona solo sui browser più recenti (Firefox, Chrome e IE7 +). Se si desidera che frammento di lavorare su tutti i browser che devi fare in modo W3Schools suggerisce: w3schools ajax

Il codice che davvero lavorato per me era:

var request; 
if(window.XMLHttpRequest) 
    request = new XMLHttpRequest(); 
else 
    request = new ActiveXObject("Microsoft.XMLHTTP"); 
request.open('GET', 'http://www.mozilla.org', false); 
request.send(); // there will be a 'pause' here until the response to come. 
// the object request will be actually modified 
if (request.status === 404) { 
    alert("The page you are trying to reach is not available."); 
} 

Answer 5

ho trovato questo ha giocato a mio scenario.

I metodi di callback jqXHR.success(), jqXHR.error() e jqXHR.complete() introdotti in jQuery 1.5 sono deprecati da jQuery 1.8. Per preparare il codice per la loro eventuale rimozione, utilizzare invece jqXHR.done(), jqXHR.fail() e jqXHR.always().

$.get("urlToCheck.com").done(function() { 
    alert("success"); 
}).fail(function() { 
    alert("failed."); 
});