混合内容 jQuery ajax HTTPS 请求已在 Laravel 上被阻止答案

【问题标题】：Mixed content jQuery ajax HTTPS request has been blocked on Laravel混合内容 jQuery ajax HTTPS 请求已在 Laravel 上被阻止
【发布时间】：2017-06-11 10:27:06
【问题描述】：

我认为这个问题对某人来说很容易，对我来说将是一个面对面的情况。

我有一个 Laravel 5.3 站点，并且各个页面都有 ajax 请求。因为我使用csrf_field() 功能，所以它们可以正常工作。

但是有一个页面 ajax 会产生这个错误：

Mixed Content: The page at 'https://example.com/fb/reports' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://example.com/fb/json?levelType=&id=&aggLevel=ad&start=&end='. This request has been blocked; the content must be served over HTTPS.

我的 javascript 看起来像这样：

    var relUrl = '/fb/json/';
    var payload = {
        levelType: levelType,
        id: id,
        aggLevel: aggLevel,
        start: start,
        end: end
    };
    console.log(relUrl);
    return $.ajax({
        type: 'GET',
        dataType: 'json',
        data: payload,
        url: relUrl,
        headers: {
            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        }            
    });

我已阅读吨篇关于此错误的文章。我尝试了很多建议的解决方案，包括将相对 URL 更改为完整的 https URL，或者以 2 个斜杠开头。

我什至尝试改变我的 Laravel 路由的工作方式，现在只使用查询字符串参数。

我研究了以下所有文章（以及更多）。

另外，由于这个 ajax 查询位于网站的密码保护部分（工作的 ajax 查询位于网站的公共/开放部分），我想也许与问题有关。但后来我使用SSH 登录生产服务器，使用vim 临时删除需要任何身份验证的行，然后出现https 错误仍然。

我可以采取哪些步骤来进一步调试？我可以在我的 Cloudways 服务器上“跟踪”哪些日志？

Cloudflare 可能会干扰什么（我怀疑，因为其他 ajax 查询都在 https 上工作）？

谢谢！

【问题讨论】：

标签： javascript jquery laravel xmlhttprequest cloudways

【解决方案1】：

总结： 我需要将 var relUrl = '/fb/json/'; 替换为 var relUrl = '/fb/json';（删除尾部斜杠），因为这是我的 Laravel web.php 路由文件所期望的。

在 Chrome 控制台中，我注意到 https XHR 请求被“取消”并替换为 http 请求。

然后我使用ssh 登录远程生产服务器并使用vim 暂时禁用身份验证要求。

然后在 Chrome 控制台中，我定义并运行了一个新的 ajax 命令，该命令使用一个绝对 https URL，最后带有查询字符串参数。那行得通（没有混合内容错误）。然后我尝试了一个这样的相对 URL，它也起作用了。

即使是没有负载或查询字符串参数或尾部斜杠的相对 URL 也有效。

然后我又加了斜杠，还是不行。

我仍然希望有一种更简单的方法来跟踪或调试重定向路径或正在发生的任何事情。我仍然觉得我笨拙地（经过几个小时）偶然发现了答案，而不是知道如何可靠地剖析这个问题。

【讨论】：

你解决过这个问题吗？我现在正在处理它。
是的。看我的第一行。删除尾部斜杠修复它。这就是为什么这是公认的答案。祝你好运。
谢谢。我们最终解决了它。它正在删除尾部斜杠，但 Apache 也在做一些事情来添加斜杠，所以在我们的例子中，它有点疯狂。
对我来说，我必须在 cloudflare 中启用 Full ssl 不灵活

【解决方案2】：

从 HTTP 更改为 HTTPS 时，可能会遇到混合内容问题 - 内容必须作为 HTTPS 提供。

所以，首先，修改.env文件中的APP_URL，如果我们使用assets helper，这应该不会给URL带来任何问题。

APP_URL=https://url.net

最后在**api.php**或**web.php**的开头添加以下内容：

if (App::environment('production')) {
    URL::forceScheme('https');
}

【讨论】：