Javascript Axios-无法在对象中设置和获取数据

我使用Axios库处理ajax请求，因此创建了Axios实例

当我点击端点

/user/login

时，成功响应将返回一个令牌，当API受到保护时，我将在报头中使用该令牌用于将来的调用

问题是当我执行console.log（authUser）时，对象是空的，即使在

.then（）

中，我正在设置

authUser.bearerToken

为什么会这样？解决办法是什么？谢谢请参阅下面的代码

var ax = axios.create({
    baseURL: 'http://api.site.test',
    timeout: 5000,
    headers: { 
        'X-Api-Client-Secret': 'xxxxxxxxxxxxxxxx' 
    }
});


var authUser = {};

// log the user in
ax.post('/user/login', {
    email: 'e@maiiiiiiiiil.com',
    password: 'ThisIsACoolPassword123!'
})
.then(function (response) {
    // set the bearer token
    authUser.bearerToken = response.data.token;
    ax.defaults.headers.common['Authorization'] = authUser.bearerToken;
})
.catch(function (error) {
    console.log(error);
});

console.log(authUser);

---

这是因为它是异步的。与/user/login对话的代码需要一些时间，但您的代码仍在继续

所以命令是

创建基本axios

将authUser定义为空对象

向/user/login发送请求

Console.log authUser

从post请求获取响应

如果放置3个控制台日志，您可以更清楚地看到它

var ax = axios.create({
    baseURL: 'http://api.site.test',
    timeout: 5000,
    headers: { 
        'X-Api-Client-Secret': 'xxxxxxxxxxxxxxxx' 
    }
});


var authUser = {};
console.log('authUser is ' + authUser);

// log the user in
ax.post('/user/login', {
    email: 'e@maiiiiiiiiil.com',
    password: 'ThisIsACoolPassword123!'
})
.then(function (response) {
    // set the bearer token
    authUser.bearerToken = response.data.token;
    ax.defaults.headers.common['Authorization'] = authUser.bearerToken;
    console.log('2. authUser is ' + authUser);
})
.catch(function (error) {
    console.log(error);
});

console.log('3. authUser is ' + authUser);

---

您将按以下顺序看到它：1、3、2，而不是1、2、3。

ax.post

是异步（非阻塞）的，因此它不会按您希望它执行的顺序执行，即它可以随时（或同时）执行。您必须使用回调或

async…wait

来处理此问题

function f() {

    var ax = axios.create({
        baseURL: 'http://api.site.test',
        timeout: 5000,
        headers: { 
            'X-Api-Client-Secret': 'xxxxxxxxxxxxxxxx' 
        }
    });

    var authUser = {};
    var response;

    ; ( async () => {

        // log the user in
        try {
            response = await ax.post('/user/login', {
                email: 'e@maiiiiiiiiil.com',
                password: 'ThisIsACoolPassword123!'
            })
        } catch(ex) {
           response = ex;
        } finally {
           if ( Error[Symbol.hasInstance](response) )
               return console.log(response);
           authUser.bearerToken = response.data.token;
           ax.defaults.headers.common['Authorization'] = authUser.bearerToken;
         }
    })(); 
    console.log(authUser)
}

可能重复的