vue.js - 使用 Vue 访问 http 而不是 https 的 Axios

Question

我正在使用 vue2 和 axios 进行 ajax 调用。在一个页面中，我正在调用各种 ajax 调用，有些使用 HTTPS，有些则使用 HTTP ，虽然这两个代码是相似的。

例子:

        axios.get('/api/' + app.$variable1 + '/get-something/')
        .then(({ data }) =>
        {
            app.array = [];

            for(let i = 0; i < data.length; i++)
            {
                app.vats.push({
                    id:data[i]['id'],
                    name:data[i]['name'],
                    something_else[i]['something_else']
                });
            }
        })

题:
如何强制 Axios 使用 HTTPS？

对象:
我无法手动添加 https，例如:“ https://www.example.com/1234/12”，因为我使用的是相对 url(我在 url 上分配了某些 id，并重用它们来拨打我的电话)。

服务器:
1) 我通过 htaccess 强制 Https
2)我也在使用安全 header ，它不允许浏览器摆脱“自我”

编辑:

所以试图解决这个问题:
1) 在 Mounted 方法中，我调用了 4 个单独的 API。前两个由于 HTTP 失败，后两个通过。我尝试更改顺序，但总是前两个失败。我试图将代码移动到 Created，这没有什么意义，果然它不起作用。

帮助!!

Answer 1

添加 Axios request interceptor并更改 config.url从 http 到 https。所有请求都将被拦截，您将可以访问基本 URL 方案。

  const instance = axios.create({
    baseURL: 'http://api.com',
  })

  instance.interceptors.request.use(function(config) {
    // change the url scheme from http to https
    config.url = config.url.replace('http://', 'https://')

    return config
  })