vue.js axios使用

1. 自定义配置

/**
 * Created by superman on 17/2/16.
 * http配置
 */

import axios from ‘axios‘
import utils from ‘@/config/cookieUtils‘

// axios 配置
axios.defaults.baseURL = store.state.gateway_url

axios.defaults.headers.post[‘Content-Type‘] = ‘application/json‘

// http request 拦截器
axios.interceptors.request.use(
  config => {
      config.headers[‘Access-Token‘] = ‘xxxxxxxxxxx‘
    return config
  },
  err => {
    return Promise.reject(err)
})

// http response 拦截器
axios.interceptors.response.use(
  response => {
    var serverResult = response.data.serverResult
    if (serverResult && serverResult.resultCode !== ‘200‘ && serverResult.resultCode !== ‘10007‘ && serverResult.resultCode !== ‘10008‘ && serverResult.resultCode !== ‘10010‘) {
      var msg = serverResult.resultMessage
      console.log(‘msg = ‘ + msg)
      return Promise.reject(response)
    }
    return response
  },
  error => {
    // console.log(JSON.stringify(error));//console : Error: Request failed with status code 402
    if (error.response && error.response.data) {
      var errorJson = error.response.data
      if (errorJson.resultCode && errorJson.resultCode === 4210) {
        ElementUI.Message(
          {
            type: ‘error‘,
            message: ‘您的账号是退出状态,请重新登录!‘,
            onClose: function () {
              location.reload()
            }
          })
        return
      }
    }
    return Promise.reject(error.response.data)
})

export default axios

  

2.引入配置

import axios from ‘@/config/http‘

Vue.prototype.axios = axios

/* eslint-disable no-new */
const starter = new Vue({
  el: ‘#app‘,
  i18n,
  router,
  store,
  axios,
  lodash,
  render: h => h(App)
})

  

原文地址:https://www.cnblogs.com/scode2/p/11132012.html

时间: 2024-08-01 08:05:52

vue.js axios使用的相关文章

asp.net mvc + vue.js + axios.js

1.新建一个 MVC 应用程序 2.右键解决方案 添加VUE 3.搜索vue 1.安装axios.js ,用于数据请求,get , post axios 原文地址:https://www.cnblogs.com/foreverfendou/p/11785563.html

.net core3.1 webapi + vue.js + axios实现跨域

我所要讲述的是,基于.net core3.1环境下的webapi项目,如何去使用axios对接前端的vue项目 既然谈到axios,这里贴出axios的官方文档地址: http://www.axios-js.com/zh-cn/docs/ 首先是前端部分进行设置 第一步,在vue项目中安装axios 在vs code的终端中输入命令 npm install axios 稍等片刻,即可完成安装 第二步,构建axios的测试api 首先需要在main.js中,引入前面安装的axios 然后在某个组件

vue.js+axios请求的简单请求示例

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script src="./vue.min.js"></script> <script src="./axios.min.js"></script

vue.js - axios Get方法传参给 .net core webapi。

1:在vue项目中通过params属性携带数据: let _self = this; axios({ method:'get', url:'http://localhost:5000/api/StuInFors/GetEFAsync/', params:{pagesize:10,pageindex:2} }).then(function(resp){ //document.write(JSON.stringify(resp.data)); console.log(resp.status); _s

vue.js学习之 跨域请求代理与axios传参

vue.js学习之 跨域请求代理与axios传参 一:跨域请求代理 1:打开config/index.js module.exports{ dev: { } } 在这里面找到proxyTable{},改为这样: proxyTable: { '/api': { target: 'http://121.41.130.58:9090',//设置你调用的接口域名和端口号 别忘了加http changeOrigin: true, pathRewrite: { '^/api': ''//这里理解成用'/ap

VUE.JS 使用axios数据请求时数据绑定时 报错 TypeError: Cannot set property &#39;xxxx&#39; of undefined 的解决办法

正常情况下在data里面都有做了定义 在函数里面进行赋值 这时候你运行时会发现,数据可以请求到,但是会报错 TypeError: Cannot set property 'listgroup' of undefined 主要原因是: 在 then的内部不能使用Vue的实例化的this, 因为在内部 this 没有被绑定.可以看下 Stackoverflow 的解释: 解决办法: 1.用ES6箭头函数,箭头方法可以和父方法共享变量 2.在请求axios外面定义一下 var that=this 问题

学习随笔:Vue.js与Django交互以及Ajax和axios

1. Vue.js地址 Staticfile CDN(国内): https://cdn.staticfile.org/vue/2.2.2/vue.min.js unpkg:会保持和npm发布的最新的版本一致 https://unpkg.com/vue/dist/vue.js cdnjs: https://cdnjs.cloudflare.com/ajax/libs/vue/2.1.8/vue.min.js 2. django 和vue语法冲突处理 : {{}} 2.1 方法1: 在new Vue

Vue.js Ajax(axios)

Vue.js 2.0 版本推荐使用 axios 来完成 ajax 请求. Axios 是一个基于 Promise 的 HTTP 库,可以用在浏览器和 node.js 中. Github开源地址: https://github.com/axios/axios 安装方法 使用 cdn: <script src="https://unpkg.com/axios/dist/axios.min.js"></script> 或 <script src="ht

Vue2.0与 [百度地图] 结合使用———vue+webpack+axios+百度地图实现组件之间的通信

Vue2.0与 [百度地图] 结合使用: 1.vue init webpack-simple vue-baidu-map 2.下载axios cnpm install axios; 3.在main.js中引入axios,并使用 import axios from 'axios' /* 把axios对象挂到Vue实例上面,其他组件在使用axios的时候直接 this.$http就可以了 */ Vue.prototype.$http = axios; 4.引入百度地图的js秘钥--->最好在inde