The page at was loaded over https but requested an insecure xmlhttprequest endpoint

Question

I have an ajax request in my website to my mvc controller. All was working fine till we had installed a security connection to the site. So our site is now https. Please see below my javascript code:

$(".crm").click(function(){
var no_data = $("#application_user_mail").val();

    if(no_data != ''){
    }
    else{

        var Data = {
        Subject: "Test",
        CallBackType: $("#properties_form").val(),
        Article: $("#crm_flatname").val(),
        Url: $("#flat_link").val(),
        Classifierid: "7DF8DE33-EF15-E711-9431-00155D460F1A",
        };

        makeAjaxCall(Data);
    }
});

function makeAjaxCall(Data){
$.ajax({
                url: "http://.../CallBackForm",
                type: "POST", 
                crossDomain: true,
                dataType: "json",
                contentType: 'application/json',
                data: JSON.stringify(Data),
            });

}

In my C# code i have enable CORS to my controller

[EnableCors(origins: "*", headers: "*", methods: "*")]

I'm getting the following error:

the page at was loaded over https but requested an insecure xmlhttprequest endpoint

How can i resolve my problem?

Answer 1

This is a classic mixed content error. If you load the parent page over https but have http hardcoded:

               url: "http://.../CallBackForm",

Then this will happen.

Try changing the http to https in the ajax method.