vue项目打包部署后请求地址及请求问题

1   首先 vue中 是用的axios 发请求,  axios 支持Promise 非常好用,  可以在请求后的.then()中拿到请求回来的数据,像这样

2    请求方式有很多, 如get post put    get 又称为 queryParams 所以携带参数后看发的请求是拼串的,像这样

        写的时候你可以采取拼串的写法 像   'page = ' + page + '&size=‘size 这种写法,但这种写法过于死板, 当后台要求你穿的参数 是有值时就传 没值时不传 这样就不可以了 因为就算做收集的表单没有数据,也会传一个key过去,这样到后台 后台就会收到一个空值 , 这时候你可以用get请求的另一种方式   params, 这种写法相对灵活 写起来也比较简便 像这样

        但当你被要求没值时不传 你就要做一些处理了  比如 把所有要传得数据都放在一个对象中,在发请求前对象做一下处理 删掉没有值得那条属性 比如这样

3   还有就是 发请求的问题了   因为在开发的时候会有跨域问题,我们一般为了方便都会 配置一个代理proxyTable, 但是在打包部署后在服务器上会有问题   因为服务器上没有跨域 请求地址会错, 但是像我上篇帖子中说的那样  每一次打包前都 把请求地址改为服务器地址 那样又很麻烦, 所以我是这么做的，

我在config/dev.en.js中配置了一下 像这样

在config/prod.env.js中这样配置

在组件中发请求时这样写

我认为这样还是比较好用的   如果那里除了问题你需要在 调试工具的network中查看请求地址 看是不是正确 ，不正确改就行了

                这些都是比较基础的,但很实用,希望可以帮到你们

1、需求是访问地址增加一层路径比如：(增加一层路径为customfile)

之前：http:xxxx/login

要求：http:xxxx/customfile/login  其中filename属于ng配置时的一层文件夹

解决：

1、vue项目的webpack配置不同版本有区别大致修改的地方为：

assetPublicPath: '/customfile'

或

public: '/customfile'

2、修改router.js路由模式为： {mode:'history', base:'/customfile'}

3、Nginx配置修改：

    location /customfile {

          alias /data/xxxx/xxx/customfile/dist// 这里是服务器资源路径

          try_files $uri $uri/ /customfile/index.html

          index index.html

    }

安装依赖

配置备用环境变量

在根目录下创建.env.development文件，并添加环境变量

VUE_APP_SERVER_ID = 0

在根目录下创建.env.production文件，并添加环境变量

VUE_APP_SERVER_ID = 1

创建自动化部署脚本

在package.json同级目录下创建文件夹deploy

在deploy文件下创建config.js和servers.js和index.js

servers.js：配置服务器相关信息

config.js：发布前的一些处理

index.js：发布到服务器的处理逻辑

添加package.json中的scripts命令

效果如下

---