js开发总结

基层模块需要封装一层后才对外暴露

这里有个基层的,被封装为promise的基层函数/类

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
# request.js
function request(data){
    return new Promise((resolve,reject)=>{
        $.ajax({
            data,
            success(res){
                resolve(res)
            },
            fail(res){
                reject(res)
            }
        })
        
    })
    
}
export{
    request
}

同时我写了个登录函数,依赖于基层类

1
2
3
4
5
6
7
8
9
10
11
12
13
14
# login.js
import {request} from "request.js"
function login(user,pw){
     request(user,pw)
        .then((res)=>{
            // get user info for token
            return request(res.token)
        })
        .then((res)=>{
            return Promise.resolve(res)
        })
}

接着 我想要在每次调用接口的时候,假如接口返回401 那么试着让用户重新登录一次.
假如我日常调用的时候都是依赖于底层接口 那么就会产生一个循环引用问题

1
2
3
4
5
6
7
# a.js
request('get post list')
    .then(()=>{
        // 这里不需要我catch一次api返回401的问题 我想统一在基层request
        .js函数处理. 那么问题就来了
    })

login.js依赖request.js, request.js内部要做一次登录,这个登录又依赖于login.js
循环懵逼..

有个解决办法就是基层接口再次封装一层.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
# ajax.js
function ajax(data){
    return new Promise((resolve,reject)=>{
        request(data)
            .then((data)=>{
                resolve(data)
            }).catch(()=>{
                //这里统一捕获到问题
                login()
                reject()
            })
        
    })
    
}