Обновление Captcha по вызову Ajax

Question

У меня есть следующий код, с которым я использовал для обновления изображения captcha с помощью JavaScript. В любом случае, я могу добиться этого, используя запрос AJAX?

<script> 
function refreshCaptcha() { 
    $("#captcha_code").attr('src','captcha_code.php'); 
} 

</script> 

<button name="submit" onClick="refreshCaptcha();">Refresh Captcha</button> 

Answer 1

Вы можете использовать следующий код.

<script> 
    $(document).ready(function() { 
     setInterval(function() { 
      $.post('captcha_code.php', function(data) { 
       $('#captcha_code').html(data); 
      }); 
     }, 1000); 
    }); 
</script> 

Answer 2

Да, это возможно, но тогда вам необходимо обрабатывать сеанс вручную!

<script> 
$(".RefreshCaptcha").click(function() { 
    $.post('captcha_code.php', function(data, status){ 
     $("#captcha_code").attr('src', data); 
     console.log("ajax log: " + status); 
    });   
}); 
</script> 
<button class="RefreshCaptcha">Refresh Captcha</button> 

w3shcools ajax.post

Answer 3

Да AJAX можно использовать для обновления обновления изображения с помощью Javascript. Поскольку код уже использует jQuery, простым способом было бы использовать $.post() для публикации в PHP-скрипте. Предполагая, что captach_code.php просто возвращает источник изображения (например, база-64 закодированной строки), можно установить SRC атрибут значение по реакции (например, в функции updateImage() ниже).

function refreshCaptcha() { 
    $.post('captcha_code.php', updateImage); 
} 
function updateImage(response) { 
     $("#captcha_code").attr('src',response); 
} 

Просмотреть в действии в this phpfiddle. Примечание - нет контроля над именами файлов, поэтому вместо используется PHP_SELF. Captcha_code.php.

$.post() возвращает jqXHR object, который реализует интерфейс Promise. Из-за этого, .done() и другие подобные функции могут использоваться вместо указания обратного вызова успеха:

function refreshCaptcha() { 
    $.post('captcha_code.php') 
    .done(function(response) { 
      $("#captcha_code").attr('src',response); 
    }) 
    .fail(function() { 
     //fail handler... 
    }) 
    .always(function() { 
     //handler for all cases 
    }); 
} 

в действии в this phpfiddle.