gpt4 book ai didi

node.js - 我的 vue.config 文件中的代理点是什么?

转载 作者:行者123 更新时间:2023-12-04 10:20:16 25 4
gpt4 key购买 nike

我有点糊涂了proxy '^/api'在我的 vue.config.js做。
当我从前端表单发出 axios 请求时,我知道它是由我的 http-common.js 处理的。和 tutorial_data_services.js文件。

我正在努力学习和理解这一点。有人可以帮忙建议吗?

vue.config.js

const path = require('path');

module.exports = {
outputDir: path.resolve(__dirname, '../server/public'),
devServer:{
proxy:{
'^/api': {
target: 'http://localhost:8080',
changeOrigin: true,
secure:false,
pathRewrite: {'^/api': '/api'},
logLevel: 'debug'
}
}
}
}

http-common.js
import axios from 'axios'

export default axios.create({
baseURL: 'http://localhost:8080/',
headers: {
'Content-type': 'application/json'
}
})

tutorial_data_services.js
import http from '../http-common'

class TutorialDataService {
getAll() {
return http.get('/tutorials')
}

get(id) {
return http.get(`/tutorials/${id}`)
}

create(data) {
return http.post('/tutorials', data)
}

}

export default new TutorialDataService()

最佳答案

devServer 代理在路由之前检查每个路径并重定向任何匹配项。您示例中的规则是将任何请求代理到 /api路径,包括它后面的任何字符串。因此,假设您的 Vue CLI devServer 在端口 8080 上运行,此规则将匹配您发送到以下 URL 的任何请求:

  • http://localhost:8080/api
  • http://localhost:8080/api/subdirectory
  • http://localhost:8080/api/ *

  • 您上面显示的所有请求都不会发送到 /api路径,因此您的应用程序当前永远不会触发此规则。如果是, target属性指定重定向到的路径,以及 devServer 还将匹配的部分附加到目标路径的末尾。 因此,上面的示例将重定向到:
  • http://localhost:8080/api
  • http://localhost:8080/api/subdirectory
  • http://localhost:8080/api/ *

  • 目标 + 匹配的部分。在这种情况下:没有任何重定向(实际上会导致重定向循环)。

    您可以将请求发送到另一个 target路径,您可以使用 pathRewrite 以您喜欢的任何方式重写该路径的一部分(或删除它) .在您的示例中, pathRewrite通过重写字符串 '/api' 也什么都不做如 '/api' .

    所以没有理由使用这个代理,你可以删除它。

    代理的一种用途是让您将请求发送到诸如 '/api' 之类的相对 URL。这适用于生产和开发。在生产中,当应用程序在也托管 API 的服务器上运行时,该相对路径实际上存在,因此应用程序可以正常工作。在开发中,您的 Vue CLI devServer 位于 8080,例如,Node 服务器位于 3000,通过将这些相对 URL 请求从 devServer 重定向到 Node,该应用程序仍然可以工作。

    这很好,因为这样您就不必与 axios 混为一谈 baseURL.env变量或绝对路径只是为了让您的开发 API 请求工作。

    关于node.js - 我的 vue.config 文件中的代理点是什么?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/60895092/

    25 4 0
    Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
    广告合作:1813099741@qq.com 6ren.com