问题描述

使用vue axios库进行http请求
在这个请求拦截器里 axios.interceptors.request.use 去进行跟ios通信获取一些手机设备信息参数最后再去发起请求 return config;
但是跟ios通信是异步的 return config的时候还没能获取到ios的响应

相关代码

axios.interceptors.request.use(config => {
    // 调用ios方法 填充公共参数
    window.__nativeFn("js_getAllDeviceInfo", {
        // ios的响应结果
        response: r => {
            config.data = Object.assign(config.data, r.data)
        }
    })
    return config

}, error => {
    return Promise.reject(error);
});

尝试1、采用定时器来看ios是否响应(未实现需求 在定时器里也无法return config，再定时器里调用回调函数 也不知道怎么return给他axios.interceptors.request.use)

axios.interceptors.request.use(config => {
    // 调用ios方法 填充公共参数
    window.a = false
    window.__nativeFn("js_getAllDeviceInfo", {
        // ios的响应结果
        response: r => {
            config.data = Object.assign(config.data, r.data)
            window.a = true
        }
    })
    var i = 0
    let SI = setInterval(() => {
        i++
        // 如果5秒之内ios端还没有响应 清除定时器
        if(5000 <= i) {
            clearInterval(SI)
        }
        if(window.a) {
            clearInterval(SI)
            return config
        }
    })

}, error => {
    return Promise.reject(error);
});

尝试2 采用@yuanxiaowa 的方法 发起了2个api请求 第二个api请求没发出 打印的config 始终是第一个请求的相关信息

return new Promise(resolve => {
   // 调用ios方法 填充公共参数
   window.__nativeFn("js_getAllDeviceInfo", {
   // ios的响应结果
   response: r => {
      config.data = Object.assign(config.data, r.data)
      console.log(config)
      resolve(config)
     }
   })
})