JS：在导出某些东西之前调用异步函数

Question

我需要调用异步函数来获取我的身份验证令牌。在导出中，我想包含此 fn 的返回值。

我的第一次尝试：

const token = await sessionHandler.getToken();

export const httpService = axios.create({
    ...
    headers: {
        "auth-token": token
        ...
    }
});

当然这不起作用，因为await 不在异步函数中。 所以我可以把它包装在一个异步函数中，对吧？不，因为我必须使用回调。再说一次，我不会在顶层进行导出，这也不起作用。

解决这个问题的最佳方法是什么？

Answer 1

这是不可能的。 导出必须以同步方式定义，并且在导出之前您不能等待。

我建议你导出一个异步函数。如果您不希望每次都请求令牌，您可以考虑保存它：

let token;

export const createHttpService = async () => {
  token = token == null ? await sessionHandler.getToken() : token;
  return axios.create({
    /* ... */
    headers: {
        "auth-token": token
        /* ... */
    }
  });
};

但是，如果这对您来说可以接受，我想我更愿意分离此令牌的请求，并让模块的使用者将其传递回 createHttpService（并因此负责保存它）。

export const getToken = () => sessionHandler.getToken();

export const createHttpService = (token) => {
  return axios.create({
    /* ... */
    headers: {
        "auth-token": token
        /* ... */
    }
  });
};

如果你真的想在模块加载时需要令牌，你也可以直接导出承诺。但是，我建议在加载模块时要注意副作用。

Answer 2

如果httpService 不能是异步的，那么我会使用interceptors 来满足这种要求，如果令牌在第一次请求时还没有准备好，那么拦截器将等待直到承诺完成。令牌只会被请求一次。

const axios = require('axios')
const token = sessionHandler.getToken();

export const httpService = axios.create({
  ...
  headers: {
    ...
  }
});

httpService.interceptors.request.use(function(config) {
  return token.then(token => {
    config.headers['auth-token'] = token;
    return config;
  })
}, function(error) {
  console.dir(error)
  // Do something with request error
  return Promise.reject(error);
});

编辑我个人更喜欢仅按需请求数据而不是包含数据，因此我会使用稍微不同的版本：

const axios = require('axios')
let token;

export const httpService = axios.create({
  ...
  headers: {
    ...
  }
});

httpService.interceptors.request.use(function(config) {
  token = token || sessionHandler.getToken(); //request it only if not already requested.

  return token.then(token => {
    config.headers['auth-token'] = token;
    return config;
  })
}, function(error) {
  console.dir(error)
  // Do something with request error
  return Promise.reject(error);
});