简单记录一下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. @JsonInclude(Include.NON_NULL) resttemplate 传递实体参数时 序列化为json时 空字符串不参与序列化

    @JsonInclude(Include.NON_NULL) resttemplate 传递实体参数时 序列化为json时 空字符串不参与序列化 https://www.cnblogs.com/sup ...

  2. CORS跨域带来的preflight request

    CORS跨域带来的preflight request https://blog.csdn.net/baidu_35407267/article/details/79043515 HTTPS://blo ...

  3. linux zip命令 tar命令 【压缩、解压缩】参数列表:

    linux zip命令参数列表:   -a 将文件转成ASCII模式 -F 尝试修复损坏的压缩文件 -h 显示帮助界面 -m 将文件压缩之后,删除源文件   -n 特定字符串 不压缩具有特定字尾字符串 ...

  4. k8s记录-kubeam方式部署k8s

    参考:https://blog.csdn.net/networken/article/details/84991940 # k8s工具部署方案 # 1.集群规划 | **服务器** | || ---- ...

  5. 晶体管放大电路与Multisim仿真学习笔记

    前言 开始写点博客记录学习的点滴,第一篇就写基本的共射极放大电路吧. 很多教材都是偏重理论,而铃木雅臣著作的<晶体管电路设计>是一本很实用的书籍,个人十分推荐! 下面开始我的模电重温之旅吧 ...

  6. PHP设计模式 - 解释器模式

    给定一个语言, 定义它的文法的一种表示,并定义一个解释器,该解释器使用该表示来解释语言中的句子. 角色: 环境角色(PlayContent):定义解释规则的全局信息. 抽象解释器(Empress):定 ...

  7. 【Uiautomatorviewer】报错:Unexpected error while obtaining UI hierarchy java.lang.reflect.InvocationT...

    android 9.0系统不能用uiautomator识别 解决方法:android 8.0 以后 uiautomator 无法直接使用的问题https://www.cnblogs.com/copyw ...

  8. 如何申请高德地图用户Key

    打开网页https://lbs.amap.com/,进入高德开发平台. 单击箭头处[注册],打开注册页面.(如果您已注册为高德地图开发者可跳过此步骤,直接登录即可). 选择[成为个人开发者],如果您是 ...

  9. DRF框架(八)——drf-jwt手动签发与校验、搜索过滤组件、排序过滤组件、基础分页组件

    自定义drf-jwt手动签发和校验 签发token源码入口 前提:给一个局部禁用了所有 认证与权限 的视图类发送用户信息得到token,其实就是登录接口,不然进不了登录页面 获取提交的username ...

  10. TCP Socket 套接字 和 粘包问题

    一.Scoket 套接字 Scoket是应用层(应用程序)与TCP/IP协议通信的中间软件抽象层,它是一组接口.也可以理解为总共就三层:应用层,scoket抽象层,复杂的TCP/IP协议 基于TCP协 ...