vue项目async/await封装axios请求

智极空间旅人
• 阅读 3089

安装axios

npm install axios --save

创建http.js文件

import axios from "axios"
/* 请求拦截器 */
axios.interceptors.request.use(
    config => {
        /* 添加token */
        let token = localstorage.getItem("token") || "";
        if(token){
            config.headers["token"] = token
        }
        return config;
    },
    error => {
        return Promise.reject(error)
    }
)

export const http = (url,params,method='GET',type='json') =>{
    /* 设置时间随机数,解决请求缓存问题 */
    let _t = new Date().getTime();
    if(method == 'GET' || method == 'get'){
        if(params){
            params._t = _t
        }else{
            params={ _t }
        }
    }
    /* 设置请求头 */
    if (method === "POST") {
        if (type == "json") {
          //参数是json类型
         axios.defaults.headers.post["Content-Type"] =
         "application/json;charset=UTF-8";
      } else {
        //参数是字符串类型
        axios.defaults.headers.post["Content-Type"] =
          "application/x-www-form-urlencoded";
        // params = Qs.stringify(params);
      }
    }
    
    /* 发送请求 */
    return new Promise((resolve,reject) => {
        axios({
            url,
            method,
            type,
            data:method != "GET" ? params : null,
            params:method == "GET" ? params : null
        })
            .then(result => {
                /* 此处可以全局处理接口特殊状态码,比如token失效等 */
                resolve(result.data)
            })
            .catch(error => {
                reject(error)
            })
    })
}

/* await to js */
export const to = promise => {
    return promise.then(res => [null,res]).catch(error => [error])
}

创建api.js文件,设置接口请求处理

import { http, to } from "./http";

//  ---- 全局接口 -----
export const ceshiList = params => {
  return to(http("json/ceshi.json", params, "GET"));
};

api使用

import { ceshiList } from "@/http/api.js";
methods:{
    async getList(){
        let [err, res] = await ceshiList();
        if (!err) {
          if (res.result.code == 200) {
            /* 接口请求正确处理 */
            console.log(res);
          }
        }
    }
}

转化blob返回的数据

const render = new FileReader();
render.onload = function(){
    let jsonData = JSON.parse(render.result)
}
render.readAsText(data)
点赞
收藏
评论区
推荐文章
blmius blmius
3年前
MySQL:[Err] 1292 - Incorrect datetime value: ‘0000-00-00 00:00:00‘ for column ‘CREATE_TIME‘ at row 1
文章目录问题用navicat导入数据时,报错:原因这是因为当前的MySQL不支持datetime为0的情况。解决修改sql\mode:sql\mode:SQLMode定义了MySQL应支持的SQL语法、数据校验等,这样可以更容易地在不同的环境中使用MySQL。全局s
Wesley13 Wesley13
3年前
MySQL部分从库上面因为大量的临时表tmp_table造成慢查询
背景描述Time:20190124T00:08:14.70572408:00User@Host:@Id:Schema:sentrymetaLast_errno:0Killed:0Query_time:0.315758Lock_
美凌格栋栋酱 美凌格栋栋酱
6个月前
Oracle 分组与拼接字符串同时使用
SELECTT.,ROWNUMIDFROM(SELECTT.EMPLID,T.NAME,T.BU,T.REALDEPART,T.FORMATDATE,SUM(T.S0)S0,MAX(UPDATETIME)CREATETIME,LISTAGG(TOCHAR(
Easter79 Easter79
3年前
typeScript数据类型
//布尔类型letisDone:booleanfalse;//数字类型所有数字都是浮点数numberletdecLiteral:number6;lethexLiteral:number0xf00d;letbinaryLiteral:number0b101
Chase620 Chase620
4年前
记录Vue项目实现axios请求头带上token
在vue项目中首先npm命令安装axios:npminstallaxiosSaxios的封装使用请求带上token,token通过登录获取存在vuex,为防止刷新丢失token使用持久化vuexpersistedstate插件保存数据npmiSvuexpersistedstateimportpersistedStat
Wesley13 Wesley13
3年前
VBox 启动虚拟机失败
在Vbox(5.0.8版本)启动Ubuntu的虚拟机时,遇到错误信息:NtCreateFile(\\Device\\VBoxDrvStub)failed:0xc000000034STATUS\_OBJECT\_NAME\_NOT\_FOUND(0retries) (rc101)Makesurethekern
Wesley13 Wesley13
3年前
FLV文件格式
1.        FLV文件对齐方式FLV文件以大端对齐方式存放多字节整型。如存放数字无符号16位的数字300(0x012C),那么在FLV文件中存放的顺序是:|0x01|0x2C|。如果是无符号32位数字300(0x0000012C),那么在FLV文件中的存放顺序是:|0x00|0x00|0x00|0x01|0x2C。2.  
Wesley13 Wesley13
3年前
mysql设置时区
mysql设置时区mysql\_query("SETtime\_zone'8:00'")ordie('时区设置失败,请联系管理员!');中国在东8区所以加8方法二:selectcount(user\_id)asdevice,CONVERT\_TZ(FROM\_UNIXTIME(reg\_time),'08:00','0
Wesley13 Wesley13
3年前
PHP创建多级树型结构
<!lang:php<?php$areaarray(array('id'1,'pid'0,'name''中国'),array('id'5,'pid'0,'name''美国'),array('id'2,'pid'1,'name''吉林'),array('id'4,'pid'2,'n
Wesley13 Wesley13
3年前
Java日期时间API系列36
  十二时辰,古代劳动人民把一昼夜划分成十二个时段,每一个时段叫一个时辰。二十四小时和十二时辰对照表:时辰时间24时制子时深夜11:00凌晨01:0023:0001:00丑时上午01:00上午03:0001:0003:00寅时上午03:00上午0
Wesley13 Wesley13
3年前
MBR笔记
<bochs:100000000000e\WGUI\Simclientsize(0,0)!stretchedsize(640,480)!<bochs:2b0x7c00<bochs:3c00000003740i\BIOS\$Revision:1.166$$Date:2006/08/1117