如何从后端向前端传值

Question

如下面发布的代码所示，我试图将值

access_token

从

fetchAuthenticationToken

传递到

fetch

中的方法

Ws.js

。 在

fetchAuthenticationToken

中，我收到

access_token

的值，然后将该值设置为

resolve

和

onResult

。到这里，我可以获得

access_token

的值。

.then()

网络服务的

processor

。

在

processor

网络服务中，我调用

.then(resp => {res.send(resp);})

以便将

access_token

的值发送到前端。但

console.info

的

fetch

显示以下内容：

{"msg":"I.xx::fetch:http://localhost:3000/xx/processor/","response":{}}

如图所示是一个空的

response

请让我知道我错过了什么以及如何将

access_token

的值从后端传递到前端，从

fetchAuthenticationToken

到

fetch

setup.js：

fetchAuthenticationToken(onResult) {
    return new Promise((resolve,reject) => {
        this.#instance.post("/xx/xx/xx/xx/xx-xx/xx", this.#body, this.#config)
        .then(resp => {
            this.#access_token = resp.data.access_token;
            Object.assign(this.#instance.defaults, {headers: {authorization: `Bearer ${resp.data.access_token}`}})
            resolve(this.#access_token);
            onResult(this.#access_token);
        })
    });
}

routes.js：

router.post('/processor', async (req, res, next) => {
        let accessToken = null;
        const setup = new Setup();
        await setup.fetchAuthenticationToken((result) => {
            accessToken = result;
            res.setHeader('Content-Type', 'application/x-protobuf'); 
        })
        .then(resp => {
            res.send(resp);
        })
    });
    

前端Ws:

fetch(onResult) {
    return new Promise((resolve, reject) => {
        const ws = endPointsURLs.VUE_NEWSWM_APP_LOCAL_HOST_3000.description + endPointsURLs.VUE_NEWSWM_APP_PATH.description + BackendWssConstants.CONST_WS_SENTINELHUB_ENGINE_PROCESSOR.description;
        fetch(ws, this.#requestOptions)
        .then(response => {
            this.#msg = JSON.stringify({msg:infoTag + 'fetch:' + ws, response: response});
            console.info(this.#msg);
            resolve(response);
            onResult(response);
        })
    });
}

Answer 1

在您的路由器中，您的第一个承诺处理程序永远不会返回任何内容，因此第二个处理程序没有要处理的值。

await setup.fetchAuthenticationToken((result) => {
        accessToken = result;
        res.setHeader('Content-Type', 'application/x-protobuf'); 
        // NOT RETURNING ANYTHING TO PASS TO NEXT then()
    })
    .then(resp => {
        res.send(resp);
    })

您可以进一步简化您的代码。在 fetchAuthenticationToken 中，看起来 post() 已经返回了一个承诺，因此您不需要将其包装在另一个承诺中。这是一个更简单的版本：

fetchAuthenticationToken() {
    return  this.#instance.post("/xx/xx/xx/xx/xx-xx/xx", this.#body, this.#config)
      .then(resp => {
        this.#access_token = resp.data.access_token;
        Object.assign(this.#instance.defaults, {headers: {authorization: `Bearer ${resp.data.access_token}`}})
        return this.#access_token;
        
    })
}

router.post('/processor', async (req, res, next) => {
    let accessToken = null;
    const setup = new Setup();
    await setup.fetchAuthenticationToken()
        .then(resp => {
        res.setHeader('Content-Type', 'application/x-protobuf'); 
        res.send(resp);
     })
});

通过删除不必要的层更容易调试。