Question

我已经使用Laravel，Vue js，Vuex和Laravel Passport构建了SPA以进行身份验证。我有一个vuex存储文件，其中包含通过服务在我的整个应用程序中使用的apiURL和serverPath，我在这些服务中发出axios请求。 store.js：

import Vue from 'vue';
import Vuex from 'vuex';
import * as auth from './services/auth_service.js';

Vue.use(Vuex);

export default new Vuex.Store({
   state: {
       apiURL: 'http://highrjobsadminlte.test/api',
       serverPath: 'http://highrjobsadminlte.test',
       profile: {},
   },
    mutations: {
        authenticate(state, payload) {
            state.isLoggedIn = auth.isLoggedIn();
            if (state.isLoggedIn) {
                state.profile = payload;
            } else {
                state.profile = {};
            }
        }
    },
    actions: {
        authenticate(context, payload) {
            context.commit('authenticate', payload)
        }
    }
});

您可以在apiURL和serverPath变量中看到，我正在使用以下域在本地主机上进行开发：http://highrjobsadminlte.test

将应用程序部署到GoDaddy后，我将这些变量更改为我的实际域：https://highrjobs.com

现在我收到此错误：

app.js:26402 Mixed Content: The page at 'https://highrjobs.com/candidate/search' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://highrjobsadminlte.test/api/candidate/search'. This request has been blocked; the content must be served over HTTPS.

当我单击app.js文件时，我可以看到它仍然具有apiURL和serverPath变量中具有本地域的store.js代码，但是在服务器上的文件中它们被更改了1000％。< / p>

我认为这是一个缓存问题，所以我运行了以下命令：

php artisan route:cache
php artisan cache:clear
php artisan config:cache

，它不能解决问题。我该如何解决？

Answer 1

Mixed content: This request has been blocked

此错误主要是由于

您正在使用https://highrjobs.com协议的https域，而u在您的应用程序内部使用的不是https的网址

  apiURL: 'http://highrjobsadminlte.test/api',
  serverPath: 'http://highrjobsadminlte.test',

像这样，您需要进入https

出现此错误

app.js：26402混合内容：“ https://highrjobs.com/candidate/search”上的页面已通过HTTPS加载，但请求了不安全的XMLHttpRequest端点“ http：//highrjobsadminlte.test/api/candidate /搜索'。该请求已被阻止；内容必须通过HTTPS提供。

您可以清楚地看到服务器尝试为https://highrjobs.com/candidate/search这个不安全的api http://highrjobsadminlte.test/api/candidate/search的安全网址提供服务

要解决此问题，您还需要在您的api网址中使用https

希望我解释得很好

您的代码应该是

apiURL: 'http://highrjobsadminlte.test/api'至 apiURL: 'https://highrjobs.com/api',

谢谢

Answer 2

对不起，我忘了在部署之前先运行npm run production。因此我的app.js文件仍然具有旧的URL。

内容混合：此请求已被禁止

2 个答案: