简单记录一下vue的http请求配置相关

测试环境请求接口设置:
  1.  config/dev.env.js添加:
    module.exports = merge(prodEnv, {
      NODE_ENV: '"development"',
      API_ROOT: '"http://"', //配置http请求头
    })

  2. config/index.js 配置:
    dev: {
      proxyTable: {
        //设置代理,连接后台地址
        '/api': {
          target: , "http://"// 目标接口
          pathRewrite: { '^/api': '' }, // 替换对应标识符,非必需
        },
      },
    }

  3.  在使用axios请求时:设置默认:axios.defaults.baseURL

之前设置的时候因为没有理解透,导致虽然设置了以上的步骤,但是还是没有搞定,于是搜索,就有了下面这个不算特别好的方法

  1. axios请求拦截:设置请求接口,可以在axios请求时,拦截请求修改;

    1. 在config/dev.env.js中配置完接口后进行配置
      //设置axios 拦截配置
      var root = process.env.API_ROOT;
      axios.interceptors.request.use((config) => {
        //请求之前重新拼装url
        config.url = root + config.url;
        return config;
      })

这个axios的配置是因为我单独将axios的请求方法重新封装成了一个http.js文件写在里面的,具体细节可能会有差别

vue请求简单配置的更多相关文章

  1. vue axios简单配置

    参考:https://www.cnblogs.com/sophie_wang/p/7844119.html 1. 安装 npm install axios 2. main.js import axio ...

  2. Vue router简单配置入门案例

    { 注意驼峰命名法,不然会报错 } 1.在Views文件夹下创建Vue路由文件,例如: <template> </template>  <script> </ ...

  3. axios在vue中的简单配置与使用

    一.axios 简介 axios 是一个基于Promise 用于浏览器和 nodejs 的 HTTP 客户端,它本身具有以下特征:https://hzzly.github.io/2017/03/12/ ...

  4. Vue + webpack 项目配置化、接口请求统一管理

    准备工作 需求由来: 当项目越来越大的时候提高项目运行编译速度.压缩代码体积.项目维护.bug修复......等等成为不得不考虑而且不得不做的问题.  又或者后面其他同事接手你的模块,或者改你的bug ...

  5. 简单配置Vue路由

    简单配置Vue路由 1.  创建一个单文件组件Test.vue <template> <div>Test</div> </template> <s ...

  6. 简单配置nginx反向代理,实现跨域请求

    简单配置nginx去做反向代理,实现跨域请求 简单介绍nginx的nginx.conf最核心的配置,去做反向代理,实现跨域请求. 更多详细配置,参考nginx官方文档 先介绍几个nginx命令 打开n ...

  7. react构建淘票票webapp,及react与vue的简单比较。

    前言 前段时间使用vue2.0构建了淘票票页面,并写了一篇相关文章vue2.0构建淘票票webapp,得到了很多童鞋的支持,因此这些天又使用react重构了下这个项目,目的无他,只为了学习和共同进步! ...

  8. 【前端】vue.js环境配置以及实例运行简明教程

    vue.js环境配置以及实例运行简明教程 声明:本文档编写参考如下两篇博客,是对它们的修改与补充,欢迎点击链接查看原文: 原文1:vue.js在windows本地下搭建环境和创建项目 原文2:Vue. ...

  9. Vue的简单入门

    Vue的简单入门 一.什么是Vue? vue.js也一个渐进式JavaScript框架,可以独立完成前后端分离式web项目 渐进式:vue可以从小到控制页面中的一个变量后到页面中一块内容再到整个页面, ...

随机推荐

  1. Hash算法及java HashMap底层实现原理理解(含jdk 1.7以及jdk 1.8)

    现在很多公司面试都喜欢问java的HashMap原理,特在此整理相关原理及实现,主要还是因为很多开发集合框架都不甚理解,更不要说各种其他数据结构了,所以造成面子造飞机,进去拧螺丝. 1.哈希表结构的优 ...

  2. 使用ES6删除对象中某些属性

    const form = { id: '011', name: '测试一', description: '测试demo' } // 目标: 取到删除description属性的对象, 即下文的data ...

  3. 一个android任务提醒程序

    需求: 运行建立多个提醒,每个提醒设置一个时间,到达指定时间后跳出提醒窗体 每个提醒有一个执行按钮,点击后保存执行记录,并且当天不再触发提醒窗体 提醒出现后如果任务还没执行,那么需要在30分钟后再次提 ...

  4. MQTT研究之EMQ:【EMQX使用中的一些问题记录(2)】

    我的测试环境: Linux: CentOS7 EMQX:V3.2.3 题外话: 这里主要介绍Websocket的支持问题. 对ws的支持比较正常,但是对wss的支持,调了较长的时间,没有成功. Jav ...

  5. SQLServer常用运维SQL整理(转)

    转载地址:https://www.cnblogs.com/tianqing/p/11152799.html 今天线上SQLServer数据库的CPU被打爆了,紧急情况下,分析了数据库阻塞.连接分布.最 ...

  6. Linux(CentOS)安装JDK1.8

    1.JDK的RPM包安装方式: https://www.cnblogs.com/hunttown/p/5450463.html 2.JDK的tar包安装方式: 首先,从SUN公司网站下载最新的JDK ...

  7. 123456123456----updateV#%#1%#%---pinLv###20%%%----com.zzj.ChildEnglis698---前show后广--儿童英语-111111111

    com.zzj.ChildEnglis698---前show后广--儿童英语-111111111

  8. Ubuntu 安装docker CE以及harbor

    Docker CE安装 系统建议版本:Ubuntu 16.04 官方安装文档连接:https://docs.docker.com/install/linux/docker-ce/ubuntu/#pre ...

  9. Visual Studio + Qt:GetVarsFromMakefile任务意外失败

    问题: IntelliSense报告找不到头文件: 编译时报告GetVarsFromMakefile任务意外失败. 解决: 删除从Visual Studio装的Qt插件: 从Qt官网下载最新的插件:h ...

  10. Nginx - 安装并启动Nginx

    1 - 安装Nginx 官网步骤:http://nginx.org/en/linux_packages.html#RHEL-CentOS [Anliven@h202 ~]$ sudo vim /etc ...