axios全局注册,设置token,以及全局设置url请求网段的方法


Posted in Javascript onSeptember 25, 2018

a1.axios全局注册

axios不同 与vue-resource不能在import axios from 'axios'后使用Vue.use(axios),axios不是插件,要想全局使用axios应该修改其原型链,代码如下

import axios from 'axios'
Vue.prototype.$axios=axios

这样 axios就全局注册好了,要使用axios,只需要这样

this.$axios.post("/login", this.form).then((response) => {
  
  } else {
  
  }
  });

使用this.$axios 就可以了。

2.axios设置头部token.

设置token需要使用axios拦截器代码如下

const url='192.137.8080/api'/*设置全局请求地址*/
axios.interceptors.request.use(
  config => {
  let token = localStorage.getItem("x-auth-token");
  if (token) { // 判断是否存在token,如果存在的话,则每个http header都加上token
   config.headers.token = `${token}`;
  }
  if (config.url.indexOf(url) === -1) {
   config.url = url + config.url;/*拼接完整请求路径*/
  }
  return config;
  },
  err => {
  return Promise.reject(err);
  });

以上这篇axios全局注册,设置token,以及全局设置url请求网段的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
不能再简单的无闪刷新验证码原理很简单
Nov 05 Javascript
一个网马的tips实现分析
Nov 28 Javascript
jQuery 图片切换插件(代码比较少)
May 07 Javascript
jQuery 过滤not()与filter()实例代码
May 10 Javascript
jquery datatable后台封装数据示例代码
Aug 07 Javascript
JavaScript中的object转换函数toString()与valueOf()介绍
Dec 31 Javascript
Jquery获取radio选中的值
May 05 jQuery
vuejs 单文件组件.vue 文件的使用
Jul 28 Javascript
javascript简写常用的12个技巧(可以大大减少你的js代码量)
Mar 28 Javascript
微信小程序实现上传图片功能
May 28 Javascript
如何在vue中使用jointjs过程解析
May 29 Javascript
js实现双色球效果
Aug 02 Javascript
vue实现多个元素或多个组件之间动画效果
Sep 25 #Javascript
vue 音乐App QQ音乐搜索列表最新接口跨域设置方法
Sep 25 #Javascript
Vue页面跳转动画效果的实现方法
Sep 23 #Javascript
vue解决弹出蒙层滑动穿透问题的方法
Sep 22 #Javascript
vue如何解决循环引用组件报错的问题
Sep 22 #Javascript
开发一个Parcel-vue脚手架工具(详细步骤)
Sep 22 #Javascript
angular的输入和输出的使用方法
Sep 22 #Javascript
You might like
一个oracle+PHP的查询的例子
2006/10/09 PHP
php中常用的预定义变量小结
2012/05/09 PHP
PHP获取当前页面完整URL的实现代码
2013/06/10 PHP
PHP中使用smarty生成静态文件的例子
2014/04/24 PHP
PHP结合Jquery和ajax实现瀑布流特效
2016/01/07 PHP
Javascript中valueOf与toString区别浅析
2013/03/19 Javascript
指定区域的图片自动按比例缩小的js代码(防止页面被图片撑破)
2014/02/21 Javascript
jquery中each遍历对象和数组示例
2014/08/05 Javascript
javaScript的函数对象的声明详解
2015/02/06 Javascript
使用AngularJS处理单选框和复选框的简单方法
2015/06/19 Javascript
可以浮动某个物体的jquery控件用法实例
2015/07/24 Javascript
AngularJS 日期格式化详解
2015/12/23 Javascript
Angular 根据 service 的状态更新 directive
2016/04/03 Javascript
原生JS实现的放大镜效果实例代码
2016/10/15 Javascript
详解JS中遍历语法的比较
2017/04/07 Javascript
解决vue-cli + webpack 新建项目出错的问题
2018/03/20 Javascript
JS伪继承prototype实现方法示例
2018/06/20 Javascript
JavaScript实现的简单Tab点击切换功能示例
2018/07/06 Javascript
微信小程序日历效果
2018/12/29 Javascript
p5.js实现动态图形临摹
2019/10/23 Javascript
Python自动连接ssh的方法
2015/03/07 Python
python操作 hbase 数据的方法
2016/12/18 Python
Python判断文件或文件夹是否存在的三种方法
2017/07/27 Python
用openCV和Python 实现图片对比,并标识出不同点的方式
2019/12/19 Python
CSS3中Transform动画属性用法详解
2016/07/04 HTML / CSS
美国知名运动产品零售商:Foot Locker
2016/07/23 全球购物
澳大利亚百货商店中销量第一的商务衬衫品牌:Van Heusen
2018/07/26 全球购物
蒂娜商店:Tiina the Store
2019/12/07 全球购物
Simons官方网站:加拿大时尚零售商
2020/02/20 全球购物
UNIX文件类型
2013/08/29 面试题
城市轨道专业个人求职信范文
2013/09/23 职场文书
同意报考公务员证明
2015/06/17 职场文书
大学开学典礼新闻稿
2015/07/17 职场文书
学校远程教育工作总结
2015/08/11 职场文书
2016年幼儿园教研活动总结
2016/04/05 职场文书
vite+vue3.0+ts+element-plus快速搭建项目的实现
2021/06/24 Vue.js