首页 > 解决方案 > react中获取springboot api的返回值

问题描述

我在响应中向 api 发出此请求:

return fetch(url, {

        method: 'POST',
        headers: {
            'Accept': 'application/json',
            'Content-Type': 'application/json',
            'Access-Control-Allow-Origin': '*'
        },
        body: JSON.stringify({
            player: param

        })
    })

这就是我的 java 方法返回的内容:

return "an example string";

当试图在反应中访问相同的内容时,我这样做了:

service.setXMLFile("PlayerList", playerAux).then((response=>{
        window.alert(JSON.stringify(response))
    }))

我想要做的是在我的反应前端打印相同的字符串,但我无法访问它。当我打印我的回复时,值为 {} 谢谢。

编辑:

致电我的服务作出反应:

createXml = () => {

    let playerAux = [];

    this.state.playerList.player.forEach((player) => {

        let jsonPlayer = {
            idPlayer: player.idPlayer,
            playerName: player.playerName,
            broadcastChannel: player.broadcastChannel,
            clusterName: player.broadcastChannel,
            playerAlias: player.playerAlias
        }

        playerAux.push(jsonPlayer);

    })

    let service = new FileConfigurationService();

    service.setXMLFile("PlayerList", playerAux).then((response=>{
        window.alert(response)
    }))
}

接口调用:

setXMLFile = (xmlFile, param) => {

    let url = this.baseUrl + "/setXmlFile/" + xmlFile;
    window.alert("BOAS POST " + url)
    url = encodeURI(url);

    return fetch(url, {

        method: 'POST',
        headers: {
            'Accept': 'application/json',
            'Content-Type': 'application/json',
            'Access-Control-Allow-Origin': '*'
        },
        body: JSON.stringify({
            player: param

        })
    })

}

在此处输入图像描述

标签: javascriptreactjs

解决方案


fetch 返回一个承诺,您需要使用 await 或 then 来处理该承诺。

喜欢

fetch().then().catch()

或者

await fetch()

改变你的功能来处理承诺

setXMLFile = async (xmlFile, param) => {

let url = this.baseUrl + "/setXmlFile/" + xmlFile;
window.alert("BOAS POST " + url)
url = encodeURI(url);

const response = await fetch(url, {

    method: 'POST',
    headers: {
        'Accept': 'application/json',
        'Content-Type': 'application/json',
        'Access-Control-Allow-Origin': '*'
    },
    body: JSON.stringify({
        player: param

    })
 });

return await response.json();

}

推荐阅读