-1

I have read this forum and all over the net about why Firefox browser fails to refresh a CAPTCHA image created in PHP with a button click. My script works in Edge, Chrome, Safari, Brave but not in Firefox, in fact I have built 3 different scripts and the same thing is happening with all of the scripts. I am not great at coding and have followed tutorials to get here, but I have rewritten these scripts to try and make them work which they do but not in FF.

Firefox will refresh the image if I use the browsers own refresh and it will load the image once but that's it.

Could someone assist me and help with why this is happening.

actual test page

http://www.nailit.nz/REFRESH%20CAPTCHA%20ONLY/index_danials_version.php

Thanks for any assistance Chris

Button With Image Page

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>

$(document).ready(function(){
    $("#btn").click(function(){
        $("#test").load("captcha_image.php");

        return false;
        });

});

</script>
</head>

<body>
<div id="test">
    <p>This is the first bit of content</p>
</div>
<button id="btn">Change Image</button>
</body>
</html>

The Image src Page

<img src ="captcha_CHRIS.php">

The Create Image Page In PHP

<?php 
    session_start();

    header("Pragma:no-cache");

    $chars = "0123456789abcderghijklmnopABCDEFGHIJKLMNOPQRSTUVWXYZ";

    $random_string = '';

        for($i = 0; $i < 5; $i++){

            $random_string .= $chars[rand(0, strlen($chars)-1)];

            }

    $_SESSION['captcha'] = strtolower($random_string);

    $captcha_img = imagecreatefrompng("assets/captcha_background.png");
    /* Below first numbers desc: 1)font size. 2)rotation angle. 3)left position. 4)top position */
    imagettftext($captcha_img, 24, -8, 8, 32, imagecolorallocate($captcha_img, 255, 114, 0),"assets/SedgwickAve-Regular.ttf",$random_string);
    header("Content-type: image/png");
    imagepng($captcha_img, null, 0);
    imagedestroy($captcha_img);


?>
Funk Forty Niner
  • 74,450
  • 15
  • 68
  • 141
Timespider
  • 41
  • 7

2 Answers2

0

This may be due to caching mechanism of firefox. You will need to set cache to false

cache: false

in ajax, you can try it this way

$(document).ready(function(){
  $("#btn").click(function(){   

/*
 nounce is usually any values you set when making a request to server backend. its used to validate data on backend against
CSRF attack */
var nounce= 1;
var datasend = "nounce="+ nounce;
        $.ajax({

            type:'POST',
            url:'captcha_image.php',
            data:datasend,
                        crossDomain: true,
            cache:false,
            success:function(data){
            alert('success');   

                $('#test').fadeIn('slow').prepend(data);

            }


        });


});

});
Henrymart
  • 122
  • 1
  • 9
  • Hi and thanks Henrymart and Even below. I tried your code here ( http://www.nailit.nz/REFRESH%20CAPTCHA%20ONLY/index_danials_version2.php ) and I used the private browsing mode and deleted cookies and data first. But the only change is it repeats the image each time you click the button but doesn't refresh it. But this wouldn't help people visiting the site using Firefox. Would you have any other suggestions? I feel like I'm swimming against the tide after 2 days at this. I appreciate you help though, thanks. – Timespider Oct 13 '19 at 08:10
  • I forgot to say the code you gave me doesn't work in the other browsers – Timespider Oct 13 '19 at 08:39
  • I don't suppose you have other ideas on how to get the captcha to refresh in Firefox? I still can't get it to work. I also downloaded a couple off the web but they also failed in Firefox. – Timespider Oct 18 '19 at 20:02
0

It is probably firefox caching, as Henrymart mentioned.

Try:

  • Visiting the site in private browsing mode
  • Clicking the i/Shield/Lock next to the address bar, waiting a few seconds, and clicking "Clear cookies and site data...", then select the domain

If none of that helps, try disabling caching through your web server or Cloudflare. Here are some quick links I found:

I hope that helps, please let me know if you solve your problem!