首先介绍一下本项目的背景，是基于 vue-cli3.1.1 的单页应用，目前测试环境和生产环境都在线上，并且都在同一个域名下，其中生产环境部署在根目录下，测试环境部署在名为 test 的子目录下，根据生产环境和测试环境的不同，某些界面和交互有细微的差别。 实现区分线上生产环境和…

项目开发过程中，至少会经历开发环境、测试环境和生产环境(即正式环境)三个阶段。不同阶段请求的状态(如接口地址等)不尽相同，若手动切换接口地址是相当繁琐且易出错的。于是环境变量配置的需求就应运而生，我们只需做简单的配置，把环境状态切换的工作交给代码。 1. 首先在项目根目录下(与…

Axios 相信对Vue熟悉的铁汁对它不会感到陌生了，这简直就是前端近年来的一大杀器，使用人数一直不断上涨。

...... 是的，就是有这么多的环境等着你去访问它们。那么跑前端代码的时候如何才能与各个环境进行联调呢？最简单直接的办法就是修改proxy选项中的target，然后再重新执行开发脚本。这个方法在项目小的情况你还能忍受，如果项目大的话，过长的编译时间将直接消磨掉你的工作激情。 …

在客户端和原始服务器(origin server)之间架设一个代理服务器，为了从原始服务器取得内容，客户端向代理发送一个请求并指定目标(原始服务器)，然后代理向原始服务器转交请求并将获得的内容返回给客户端。客户端必须要进行一些特别的设置才能使用正向代理。 客户端无需做任何配置。…

指的是浏览器不能执行其他网站的脚本。它是由浏览器的同源策略造成的，是浏览器对javascript施加的安全限制。 是指协议，域名，端口都要相同，其中有一个不同都会产生跨域，在请求数据时，浏览器会在控制台中报一个异常，提示拒绝访问。 后端代码在A服务器上启动，前端代码在B电脑上启…

最近工作很忙，迟迟没产出新文章，特来补上。虽说vue3已经正式版出现了（现在用最新的脚手架创建一个项目vue的版本就是3.0了），但是现在生态还没完善起来，掘金其他小伙伴已经做了很多vue3的分享，这边我就不做了，当然各位可以先去康康它👉（vue3）。今天的主要成员还是vue…

Axios 是一个基于 promise 的 HTTP 库，可以用在浏览器和 node.js 中,本文主要是vue-cli封装axios进行前后端接口联调

在vue项目中，我们通常都是使用axios与后台进行数据交互，axios有很多好用的特性，这里不多做介绍，相关细节可以查阅axios中文网。在对axios进行封装之前，我们要使用vue脚手架工具创建一个vue项目（这里我用的是cli4）。 在src目录下创建一个service目…