12赞
426
当前位置:  开发笔记 > 编程语言 > 正文

如何在vue.config.js中为生产设置API路径?

如何解决《如何在vue.config.js中为生产设置API路径?》经验,为你挑选了1个好方法。

我正在使用vue cli3进行设置。我已经在vue.config.js文件中设置了devServer api :

devServer: {
    proxy: {
        '/api': {
            target: 'http://localhost:1888/apps/test/mainapp.php/',
            changeOrigin: true,
        },
    },
}

我还需要将路径“ https://server/myapp/main.php/ ”设置为生产API路径,但是我似乎无法在文档中找到有关如何执行操作的任何信息。任何帮助表示赞赏。

我在代码中做的简短示例:

methods: {
    login() {
        this.axios.post('/api/test')
            .then((resp) => {
                console.log(resp);
            })
            .catch(() => {
                console.log('err:' , err);
            });
    },
},

Ohgodwhy.. 6

devServer当你执行不运行yarn/npm run build。仅向您提供要提供的已转译的Javascript。您需要在.env文件中更改URL。

发展:

.env

VUE_APP_API_ENDPOINT = '/api'

生产:

.env.production

VUE_APP_API_ENDPOINT ='https://server/myapp/main.php'

然后,您的XHR请求库在发出请求时(例如与axios一起使用)应该使用这些环境变量:

axios[method](process.env.VUE_APP_API_ENDPOINT, data)

method会在哪儿GET/POST/PUT/DELETE

请注意,您将受限于跨源资源共享所制定的规则。如果您的服务器不允许为您的Vue.js页面提供URL,则需要将其打开。

您无需对devServer配置进行任何更改,因为您.env现在将声明发送给xhr的请求,/api该请求仍将为您代理。



1> Ohgodwhy..:

devServer当你执行不运行yarn/npm run build。仅向您提供要提供的已转译的Javascript。您需要在.env文件中更改URL。

发展:

.env

VUE_APP_API_ENDPOINT = '/api'

生产:

.env.production

VUE_APP_API_ENDPOINT ='https://server/myapp/main.php'

然后,您的XHR请求库在发出请求时(例如与axios一起使用)应该使用这些环境变量:

axios[method](process.env.VUE_APP_API_ENDPOINT, data)

method会在哪儿GET/POST/PUT/DELETE

请注意,您将受限于跨源资源共享所制定的规则。如果您的服务器不允许为您的Vue.js页面提供URL,则需要将其打开。

您无需对devServer配置进行任何更改,因为您.env现在将声明发送给xhr的请求,/api该请求仍将为您代理。


推荐阅读
  • 1.安装php,配置php解压php5到指定目录这里直接放到c盘,即:C:\php修改php目录下的php.ini-development为php.ini,打开php.ini修改如 ... [详细]
  • ApacheBeanUtils是Apache开源软件组织下面的一个项目,被广泛使用于Spring、Struts、Hibernate等框架,有数千个jar包依赖于它。它通过JDK中反 ... [详细]
  • http:jingpin.jikexueyuan.comarticle39333.htmlhttp:sqoop.apache.orgdocs1.4.6SqoopUserGuide.h ... [详细]
  • 报错:dpkg:errorprocessingpackageubuntu-core-launcher(--configure): dependencyproblems-leavin ... [详细]
  • Sublime text3配置C/C++编译环境
    安装sublimetext3后,一直很喜欢使用它看代码(这个高亮配色真的很好看)。它默认的运行环境就有CC++,在写了一个helloworld!后正常输出,但在加入scanf()输 ... [详细]
  • nginx利用反向代理调试后台接口
    1、location支持配置项目的绝对路径2、假设我们的后台API地址是以API开头,location^~api代表nginx将会拦截请求地址中包含api字样的请求,其实这就是 ... [详细]
  • 前言:如今,随着软件开发技术在云计算、人工智能、以及机器学习等领域的长足进步,数据测试,特别是在大数据、以及物联网等应用场景中的产品质量和可靠性,都得到了显著增强,应用程序本身的错 ... [详细]
  • https:nacos.ioen-usdocsquick-start-docker.htmlhttps:github.comnacos-groupnacos-dockermkdir ... [详细]
  • Ubuntu环境变量分为系统级环境变量和用户级环境变量。顾名思义,设置在系统级环境变量中的配置项作用范围为全系统,而设置在用户级环境变量中的配置项仅对当前用户起作用。系统及环境变量 ... [详细]
  • pipinstallbootstarp使用bower安装bootstrap的命令是:bash$bowerinstallbootstrap不过问题出在如何安装bower上。官方网站上 ... [详细]
  • linux学习之八Linux本机性能监控
    Linux优化1、看看磁盘有没有满(根目录有没有满)、内存有没有满、CPU有没有满查看磁盘有没有满,使用df-h看看磁盘使用情况查看内存使用free-m特别关注swap用 ... [详细]
  • 1,效果图:[groot]$2,设置步骤:编辑~.bashrc文件,在最后增加设置行:#显示当面目录的最后一层目录#PS1'\[\e[32m\][\u@\h\W]$\[\e ... [详细]
  • 从一台服务器负责内容到另一台服务器: scpjdk-6u37-linux-x64.bin spark@10.126.45.56:homesparkopt tar压缩和解压文件:  ... [详细]
  • 一、基础软件安装1."Linux环境下JDK安装"2."Linux环境下Python安装"3.&qu ... [详细]
  • 如何解决《java.lang.NoClassDefFoundError:org/apache/spark/sql/SparkSession》经验,为你挑选了2个好方法。 ... [详细]
author-avatar
濮阳小贝
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有