Wie setze ich den HTTP-Header img-type jpeg/png in AJAX beim Aktualisieren des Captchas?

Question

Verwenden Sie jquery + php. Benutzerdefinierte AJAX-Captchas erstellen Wenn der Benutzer auf das Bild klickt, wird es automatisch aktualisiert.

<script src="/js/jquery.js"></script> 

<script> 

$(document).ready(function(){ 

    $.post('/captcha.php', {}, function(resp){ 

     $("div").html(resp); 

    }); 

}); 

</script> 

<div></div> 

in PHP-Header bereits gesendet, so dass, wenn es in <img src="/captcha.php" /> enthält druckt es captcha in JPEG. Das Problem scheint zu sein, Header ist, die gesendet werden müssen. Also, wie kann ich das tun? Der Header wird in PHP gesendet. Es funktioniert nicht in js.

Answer 1

Wenn Sie ein Bild in einem HTML-Dokument ändern mögen, dann das Attribut des Bildes src ändern (oder das Bildelement durch einen neuen ersetzen). Verwenden Sie XMLHttpRequest überhaupt nicht.

Answer 2

hinzufügen header function in Ihrer captcha.php Datei:

header('Content-Type: image/jpeg'); 

Answer 3

Wenn Sie die Quelle von einem anderen Skript laden, können Sie einfach die src der Datei über einen Zeichenfolgenwert senden. Auf diese Weise wird Ihr captcha.php Code so etwas wie dieses

$source="/path/to/the/file.jpg"; 
header("Content-type:text/plain"); 
print $source; 

Wenn Sie es erhalten Sie die Quelle folgendes ändern kann tun

$("#changeCaptchaButton").click(function() { 
    $.ajax({ 
    url: "captcha.php", 
    cache: false, 
    success: function(data) { 
     alert("changing source of image"); 
     var source=data; 
     $("#captchaImg").attr("src", source); 

     } 
    }); 
}); 

Wenn Sie die Änderung in der aktuelle Skript tun dann Verwenden Sie nicht den Ajax, aber verwenden Sie die letztere jQuery-Methode