OpenAPI生成的打字稿未正确调用React WebApp的API

发布于 2025-01-17 17:11:28 字数 2092 浏览 0 评论 0原文

我有一个React WebApp和Spring Boot Java后端API。后端API与Postman的效果非常好。

在React WebApp中,我使用OpenAPI生成的打字稿来调用后端API。我有两个针对API的参数,一个数字和一个对象。该对象只是JSON样式对象。

当我使用打字稿调用API时,出于某种原因,它以null的方式传递给对象参数,而API返回500错误。我不知道为什么会发生这种情况。有什么建议吗?这是我称为API的代码:

function gatherUserData(){
    const UserDataRetval: UserData = {};
    UserDataRetval.version = kVersion;
    UserDataRetval.Methods = [];
    if (checkedLikesYouCount){
        UserDataRetval.Methods.push(UserDataMethodsEnum.RECOM_LIKES_YOU_COUNT)
    }
    if (checkedRecosRecommendations){
        UserDataRetval.Methods.push(UserDataMethodsEnum.RECOS_RECOMMENDATIONS)
    }
    if (checkedUsersRecommendations){
        UserDataRetval.Methods.push(UserDataMethodsEnum.USERS_RECOMMENDATIONS)
    }
    if (checkedProfileUser){
        UserDataRetval.Methods.push(UserDataMethodsEnum.PROFILE_USERID)
    }
    if (checkedProfile){
        UserDataRetval.Methods.push(UserDataMethodsEnum.PROFILE)
    }
    if (checkedRecosLikesYou){
        UserDataRetval.Methods.push(UserDataMethodsEnum.RECOS_LIKES_YOU)
    }
    if (checkedRecommendationsLikesYou){
        UserDataRetval.Methods.push(UserDataMethodsEnum.RECOM_LIKES_YOU)
    }
    return UserDataRetval;
}


//USER CLICKS SUBMIT BUTTON, CHECKS USERID ISNT EMPTY, BRINGS UP JSON DATA
function handleSubmit() {
  console.log("Call API for methods:")
  console.log(userid)
  SetDisplayJson(userid !== "")
    auth.onAuthStateChanged(user => {
        if (user) {
            user.getIdTokenResult(false)
                .then(tokenResult => {
                    console.log("token: ", tokenResult.token)
                        new ServiceApi(headerConfig(tokenResult.token)).simulateUser(parseInt(userid), gatherUserData()).then((response) => {
                            console.log(response);
                        }, (error) => {
                            console.log(error);
                        })

                }).catch(e => console.log(e))
        }
    })
}

I have a react webapp and a spring boot java backend api. The backend Api works perfectly fine with postman.

In the react webapp, I am using openapi generated typescript to make the calls to the backend api. I have two parameters for the api, a number and an object. The object is just json style object.

When I use the typescript to call the api, for some reason, it passes in null for the object parameter and the api returns a 500 error. I have no clue why this is happening. Any suggestions? Here is the code where I call the api:

function gatherUserData(){
    const UserDataRetval: UserData = {};
    UserDataRetval.version = kVersion;
    UserDataRetval.Methods = [];
    if (checkedLikesYouCount){
        UserDataRetval.Methods.push(UserDataMethodsEnum.RECOM_LIKES_YOU_COUNT)
    }
    if (checkedRecosRecommendations){
        UserDataRetval.Methods.push(UserDataMethodsEnum.RECOS_RECOMMENDATIONS)
    }
    if (checkedUsersRecommendations){
        UserDataRetval.Methods.push(UserDataMethodsEnum.USERS_RECOMMENDATIONS)
    }
    if (checkedProfileUser){
        UserDataRetval.Methods.push(UserDataMethodsEnum.PROFILE_USERID)
    }
    if (checkedProfile){
        UserDataRetval.Methods.push(UserDataMethodsEnum.PROFILE)
    }
    if (checkedRecosLikesYou){
        UserDataRetval.Methods.push(UserDataMethodsEnum.RECOS_LIKES_YOU)
    }
    if (checkedRecommendationsLikesYou){
        UserDataRetval.Methods.push(UserDataMethodsEnum.RECOM_LIKES_YOU)
    }
    return UserDataRetval;
}


//USER CLICKS SUBMIT BUTTON, CHECKS USERID ISNT EMPTY, BRINGS UP JSON DATA
function handleSubmit() {
  console.log("Call API for methods:")
  console.log(userid)
  SetDisplayJson(userid !== "")
    auth.onAuthStateChanged(user => {
        if (user) {
            user.getIdTokenResult(false)
                .then(tokenResult => {
                    console.log("token: ", tokenResult.token)
                        new ServiceApi(headerConfig(tokenResult.token)).simulateUser(parseInt(userid), gatherUserData()).then((response) => {
                            console.log(response);
                        }, (error) => {
                            console.log(error);
                        })

                }).catch(e => console.log(e))
        }
    })
}

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。
列表为空,暂无数据
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文