为什么axios发出请求时总是将https转换成http?

问题描述 投票:0回答:3

我正在使用 Laravel 5.8 和开箱即用的预配置 Vue.js。

为了在 Vue.js 组件中发出 GET/POST/PUT/DELETE 请求,我使用 AXIOS,如下所示:

import axios from 'axios'

const obj = axios.create({
  baseURL: '/controller-name/action-function-name'
})

export default {
  all (params) {
    return obj.get('/', params)
  },
  find (id) {
    return obj.get(`/${id}`)
  },
  store (data) {
    return obj.post(``, data)
  },
  update (id, data) {
    return obj.put(`/${id}`, data)
  },
  delete (id) {
    return obj.delete(`/${id}`)
  }
}

在我的本地环境中,使用

HTTP
虚拟主机(例如
http://my-website.com
。直到我将应用程序部署在具有
HTTPS
url 的真实托管服务器上,例如
https://my-website.com
,我的应用程序不再运行,并且出现以下错误。

Mixed Content: The page at 'https://my-website.com/path#/' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://my-website.com/path/controller-name/action-function-name'. This request has been blocked; the content must be served over HTTPS.

我确实理解这一点,因为我的应用程序在

HTTPS
域上运行,但
AXIOS
发出的请求是通过
HTTP
发出的。这就是为什么它不起作用。

我的问题是为什么 AXIOS 在发出请求时会将

HTTPS
隐藏为
HTTP
url?

我确实尝试了以下硬代码网址。

import axios from 'axios'

export default {
  all (params) {
    return obj.get('https://my-website.com/controller-name/action-function-name/', params)
  },
  find (id) {
    return obj.get(`https://my-website.com/controller-name/action-function-name/${id}`)
  },
  store (data) {
    return obj.post(`https://my-website.com/controller-name/action-function-name`, data)
  },
  update (id, data) {
    return obj.put(`https://my-website.com/controller-name/action-function-name/${id}`, data)
  },
  delete (id) {
    return obj.delete(`https://my-website.com/controller-name/action-function-name/${id}`)
  }
}

如您所见,所有硬编码 url 都以

https
为前缀。每次我单击菜单链接时,
AXIOS
总是用
https
url 覆盖我的
http
硬编码 url。我该如何解决这个问题?

http https vuejs2 axios laravel-5.8
3个回答
3
投票

如果它确实对某人有效,那么问题就出在后面。要接收的 URL 末尾不能有“/”,因为如果它会导致重定向到 http

示例

之前

@app.route('/api/color/primary/',methods = ['GET'])

之后

@app.route('/api/color/primary',methods = ['GET'])

1
投票

为什么不执行以下操作:

baseURL: 'https://yourdomain.com/',
url: '/controller-name/action-function-name',

0
投票

在我的例子中,是服务器将 HTTPS 转换为 HTTP。

而不是

https://your.api/path?id=123
尝试
https://your.api/path/?id=123

© www.soinside.com 2019 - 2024. All rights reserved.