在 HTTPS 页面中运行 HTTP AJAX 操作时“阻止混合内容”============================

2022-08-30 02:43:39

我有一个表格,我正在提交(通过GET,因为它是以这种方式需要的)到crm(ViciDial)。我可以成功提交表单,但是如果我这样做,crm上的处理文件将仅响应成功文本,仅此而已。

而不是该文本,我想在我的网站上显示一个感谢页面,所以我决定使用AJAX提交表单并将其重定向到我需要的页面,但是我在浏览器上收到此错误:

混合内容:“https://page.com”处的页面是通过 HTTPS 加载的,但请求了不安全的 XMLHttpRequest 终结点“http://XX.XXX.XX.XXX/vicidial/non_agent_api.php?queries=query=data”。此请求已被阻止;内容必须通过 HTTPS 提供。

这是我的AJAX脚本:

<script>
SubmitFormClickToCall = function(){
            
    jQuery.ajax({
        url: "http://XX.XXX.XX.XX/vicidial/non_agent_api.php",
        data : jQuery("#form-click-to-call").serialize(),
        type : "GET",
        processData: false,
        contentType: false,
        success: function(data){
            window.location.href = "https://www.example.com/thank-you";
        }
    });
}
</script>

只是在URL中设置https是行不通的,有没有办法通过GET提交数据并将用户重定向到我的感谢页面?

============================

这里的问题是混合内容,这意味着我通过HTTPS加载了一个页面,并试图通过AJAX访问HTTP中的API。但是浏览器不允许我们这样做。

因此,如果您无法将API设置为HTTPS(这是我的情况),我们仍然可以通过其他方式解决这个问题。

主要问题不是混合内容问题,而是我想将数据提交到API并将用户重定向到一个花哨的感谢页面。我没有使用AJAX,而是制作了一个php文件,该文件接收数据,使用curl将其发送到API(因为服务器端正在这样做,因此没有混合内容问题),并将我快乐的用户重定向到一个花哨的感谢页面。


答案 1

我通过将以下代码添加到HTML页面来解决此问题,因为我们使用的是第三方API,该API不受我们控制。

<meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests"> 

希望这会有所帮助,并且也有记录。


答案 2

如果您使用 HTTPS 在浏览器中加载页面,浏览器将拒绝通过 HTTP 加载任何资源。正如您所尝试的那样,将 API URL 更改为使用 HTTPS 而不是 HTTP 通常可以解决此问题。但是,您的 API 不得允许 HTTPS 连接。因此,您必须在主页上强制使用 HTTP,或者请求它们允许 HTTPS 连接。

请注意:如果您转到 API URL 而不是尝试使用 AJAX 加载它,则请求仍将有效。这是因为浏览器没有从受保护的页面加载资源,而是加载不安全的页面,并且它正在接受这一点。但是,为了通过AJAX提供它,协议应该匹配。