My Ajax function is making double request

Question

This is my function to check if the coupon code is valid or not.

function checkCoupon(str){

   if (window.XMLHttpRequest) {
            // code for IE7+, Firefox, Chrome, Opera, Safari
            xmlhttp=new XMLHttpRequest();
        } else { // code for IE6, IE5
            xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
        }
        xmlhttp.onreadystatechange=function() {
            if (this.readyState==4 && this.status==200) {
               alert('success');
            }
        }

        xmlhttp.open("GET","https://www.example.com/inc/checkCoupon?id=45&coupon="+str,true);

        xmlhttp.send();
    }

I am using <input onchange="checkCoupon(this.value)" placeholder="Coupon"> to call this.

The problem is, It is making two different calls. First https:// version of the page then it was immediately canceled after that it makes another call on http:// version which is rejected because of mixed-content .

I have also checked it I have more than one function to do the same work but I have an only single function on this page.

Here is the snap of network tab in Inspect Element >> https://imgur.com/a/fQnXuQ1

Above is https:// and below is http:// .

Thanks for the help.

Answer 1

It seems like you have some active http content when you're making the https request. For more information, see here .

A question though, why don't you just force the entire site's communication to be via https in the first place? This can be done in the htaccess file. Example:

#Rewrite everything to https
RewriteEngine On
RewriteCond %{HTTPS} !=on
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [L,R=301]

Answer 2

There was indeed something wrong in the .htaccess file. This type of problem actually happens because of .htaccess . I will answer half of the question because I don't know the answer to the other half.

This was my .htaccess code for redirection to www then https://

RewriteCond %{HTTP_HOST} !^www\. [NC]
RewriteRule ^(.*)$ http://www.example.com/$1 [L,R=301]

RewriteCond %{HTTPS} !=on
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [L,R=301]

This is actually alright. What I have missed is another code below it. This below code is used to force the trailing slashes in URL.

RewriteBase /
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_URI} !(.*)/$
RewriteRule ^(.*)$ http://www.example.com/$1/ [L,R=301]

As you can see, what I have missed is the last row in this code. I have forced trailing slashes to http://www.exaple.com which is actually supposed to be https://www.exaple.com . I have missed http:// here which is actually supposedly be https:// .

Another half answer, which I don't know is: It is still making the double request for every AJAX query call. I have a guess about it, It must be due to the non-www to www redirection then http:// to https:// redirection. It is still my guess though.

Thanks to @Martin, I at least got the idea about my fault.