Promise는 어떻게 귀속을 실현합니까

8103 단어
요청은 token을 가지고 검증해야 합니다.Token은 시효성이 있습니다. 기한이 지나면 요청이 무효입니다. 유효한 token을 다시 가져와서 유효한 token을 가지고 다시 요청해야 합니다.
function get(url) {
  const token = getTokenStorage();
  return new Promise((reject, resolve) => {
    axios.get(`${url}?token=${token}`)
    .then(resp => {
      if(resp.status === TOKEN_OVERTIME) {
      	removeTokenStorage();
      	regainTokenFromServer()
        .then(token => {
          setTokenStorage(token);
          //    
        });
      } else if(resp.status !== SUCCESS) {
      	return reject(resp.msg);
      } else {
      	return resolve(resp.data);
      }
    })
  })
}

get("https://xxx")
.then(data => {
  render(data);
})
.catch(errMsg => {
  toastErr(ErrMsg);
});

상기 get 함수를 사용하여 요청을 보내면 서버가 "이때 token이 만료되었습니다"라고 응답하면 상기 get 함수는 주석으로 실행됩니다 (// )석방된 위치.이 위치를 실행하기 전에, token은 캐시를 다시 가져와 저장했습니다. 이 get 함수를 귀속시키는 것이 분명합니다.
get(url);

하지만 관건은 어떻게 쓰느냐!
이렇게 쓰여 있습니다.
//  
get(url).then(data => resolve(data));

아니면 아래와 같이 개작하시오
function get(url) {
  const token = getTokenStorage();
  return new Promise((reject, resolve) => {
    axios.get(`${url}?token=${token}`)
    .then(resp => {
      if(resp.status === TOKEN_OVERTIME) {
      	removeTokenStorage();
      	regainTokenFromServer()
        .then(token => {
          setTokenStorage(token);
          //   
          return resolve({ isRegainToken: true });
        });
      } else if(resp.status !== SUCCESS) {
      	return reject(resp.msg);
      } else {
      	//   return resolve(resp.data);  
        return resolve({ isRegainToken: false, data: resp.data });
      }
    })
  })
  .then(({ isRegainToken, data }) => {
    return isRegainToken ? get(url) : Promise.resolve(data);
  })
}

위와 같은 코드는 기본적으로 위조 코드이며 다음에는 실행할 수 있는 두 가지 예를 붙입니다.
let counter = 0;
const max = 5;

function waitting(sec) {
  return new Promise(resolve => {
    console.log(`waiting ${sec}s...`);
    setTimeout(() => resolve(), 1000);
  });
}

function promise() {
  console.log(`waiting ${++counter}s...`);
  return new Promise(resolve => {
    if(counter >= max) {
      counter = 0;
      return resolve("promise finish");
    } else {
      setTimeout(() => {
        promise().then(res => resolve(res));
      }, 1000);
    }
  })
}

function promiseElse() {
  counter++;
  return new Promise((resolve, reject) => {
    if(counter >= max) {
      return resolve({ isValid: true, data: "promiseElse finish"});
    } else {
      return resolve({ isValid: false });
    }
  })
  .then(res => {
    if(res.isValid) {
      counter = 0;
      return Promise.resolve(res.data); 
    } else {
      return waitting(counter)
      .then(() => promiseElse());
    }
  });
}


promise()
.then(res => {
  console.log(res);

  return promiseElse();
})
.then(res => {
  console.log(res);
});

다음으로 전송:https://juejin.im/post/5aa6a3f3518825558a064546

좋은 웹페이지 즐겨찾기