zoukankan      html  css  js  c++  java
  • 调用全局api(接口)

    // 配置API接口地址
    // var root = process.env.API_ROOT
    import Vue from 'vue';
    import Vuex from 'vuex';
    import store from '../vuex/store'
    
    Vue.use(Vuex);
    
    var root
    function url_check () {
      //域名
      var allLocal = window.parent.window.location.href;
      var local = allLocal.split("//")[1].split("/")[0];
      root='接口名称'
    //  axios.defaults.headers['Content-Type']='application/json';  //此处是增加的代码,设置请求头的类型
    }
    
    // 引用axios
    var axios = require('axios');
    //var store = require('store');
    axios.defaults.withCredentials=true //允许ajax携带cookie参数
    // 自定义判断元素类型JS
    function toType (obj) {
        console.log(obj);
      return ({}).toString.call(obj).match(/s([a-zA-Z]+)/)[1].toLowerCase()
    }
    // 参数过滤函数
    function filterNull (o) {
      for (var key in o) {
        if (o[key] === null) {
          delete o[key]
        }
        if (toType(o[key]) === 'string') {
          o[key] = o[key].trim()
        } else if (toType(o[key]) === 'object') {
          o[key] = filterNull(o[key])
        } else if (toType(o[key]) === 'array') {
          o[key] = filterNull(o[key])
        }
      }
      return o
    }
    /*
      接口处理函数
      这个函数每个项目都是不一样的,我现在调整的是适用于
      https://cnodejs.org/api/v1 的接口,如果是其他接口
      需要根据接口的参数进行调整。参考说明文档地址:
      https://cnodejs.org/topic/5378720ed6e2d16149fa16bd
      主要是,不同的接口的成功标识和失败提示是不一致的。
      另外,不同的项目的处理方法也是不一致的,这里出错就是简单的alert
    */
    function apiAxios (method, url, params, success, failure,error) {
    //    console.log(url);
      url_check()
    //console.log(root);
      axios({
        method: method,
        url: url,
        data: method === 'POST' || method === 'PUT' ? params : null,
        params: method === 'GET' || method === 'DELETE' ? params : null,
        baseURL: root,
        withCredentials: true,
        headers:{
            'token':store.state.token  //允许携带token
        }
       
      })
        .then(function (res) {
          if (res.data.code == 0) {      
            if (success) {
              success(res.data)
            }
          } else {
            if (failure) {
              failure(res.data)
            } else {
              console.log('error: ' + JSON.stringify(res.data))
            }
          }
        })
        .catch(function (err) {
          // let res = err.response
          if(error){
            error(err)
          }
        })
    }
    
    // 返回在vue模板中的调用接口
    export default {
      get: function (url, params, success, failure,error) {
        return apiAxios('GET', url, params, success, failure,error)
      },
      post: function (url, params, success, failure,error) {
        return apiAxios('POST', url, params, success, failure,error)
      },
      put: function (url, params, success, failure,error) {
        return apiAxios('PUT', url, params, success, failure,error)
      },
      delete: function (url, params, success, failure,error) {
        return apiAxios('DELETE', url, params, success, failure,error)
      }
    }
  • 相关阅读:
    httpclient在获取response的entity时报异常
    SpringCloud项目,接口调用返回http 500
    使用maven插件生成grpc所需要的Java代码
    win10 无法修改默认程序 默认打开方式的解决方法
    mock.js中新增测试接口无效,返回404
    echarts的pie图中,各区块颜色的调整
    HashMap源码注释翻译
    netty学习记录2
    netty学习记录1
    Java-JNA使用心得2
  • 原文地址:https://www.cnblogs.com/liujiajiablog/p/10335766.html
Copyright © 2011-2022 走看看