POST http://localhost:9091/xxxx 400(错误请求)尝试使用react从客户端发送json表单数据到服务器端

问题描述 投票:0回答:1

当我尝试将 json 表单数据从客户端发送到服务器端时,出现此错误。我使用 React 进行前端编码,使用 Golang 进行服务器端编码。这就是我编写句柄提交方法的方式

const response = await fetch('http://localhost:9091/rewardAdmin/v1/rewardRule/createRewardInfo', {
      method: 'POST',
      mode: 'no-cors',
      headers: { 'Content-Type': 'text/plain' },
      body: JSON.stringify(formData.formData),
    }); 

我也尝试将内容类型更改为“application/json”,但没有成功。

这是我的后端代码。

func (rc *RewardAdminController) CreateRewardInfo(ctx echo.Context) error {
    var rewardInfo rewardInfo.RewardInfoRequest
    if err := ctx.Bind(&rewardInfo); err != nil {
        return ctx.JSON(http.StatusBadRequest, err.Error())
    }
    result, err := rc.RewardRuleService.CreateRewardInfo(rewardInfo)
    if err != nil {
        return ctx.JSON(http.StatusBadGateway, err.Error())
    }
    return ctx.JSON(http.StatusOK, result)
}

有人有办法解决这个问题吗?

将填写的表单中的 json 数据发送到我用 golang 编写的 REST API

reactjs json forms
1个回答
0
投票

要完全调试您的代码,我需要查看完整的后端代码,例如具有处理程序的代码。下面是一个非常简单的表单提交示例:

去:

package main

import (
    "encoding/json"
    "fmt"
    "log"
    "net/http"
)

func main() {

    addr := ":8080"

    http.HandleFunc("/sendData", HandleData)

    http.Handle("/public/", http.StripPrefix("/public", http.FileServer(http.Dir("public/"))))
    http.HandleFunc("/", HandleIndex)

    fmt.Println("Starting server at port", addr)
    log.Fatalln(http.ListenAndServe(addr, nil))

}

func HandleIndex(w http.ResponseWriter, r *http.Request) {
    http.ServeFile(w, r, "index.html")
    return
}

func HandleData(w http.ResponseWriter, r *http.Request) {

    data := r.FormValue("Field1")

    responseData := struct {
        Answer string
        Info   string
    }{"Got It?", data}

    //send the data back to the user:
    json.NewEncoder(w).Encode(responseData)

    return
}

索引.html

<!DOCTYPE html>
<html>
<head>
<title>index</title>
<script type="text/javascript" src="/public/js/jquery-1.11.1.min.js"></script>
</head>
<body>
  <input type="text" id="field1">
  <button id="sub">Submit</button>

</body>
<script>
  $( document ).ready(function() {

    $("#sub").on('click', function(){
      var data = $("#field1").val()
      var obj = {
        Field1: data,
      }
      $.ajax({
        type: "POST",
        url: "/sendData",
        data: obj
      })
      .done(function(data) {
        console.log("success")
        converted = JSON.parse(data)
        console.log(data)
        alert(converted.Info)
      })
      .fail(function(data) {
        alert(data)
        console.log("failed")
        console.log(data)
      });

    })


  })

</script>

这是一个工作代码示例,展示了如何进行表单提交。因此,如果没有完整的代码,很难说出为什么您的请求不好。您的服务器由于某种原因拒绝它。

© www.soinside.com 2019 - 2024. All rights reserved.