dongshang3309 2018-08-11 16:01
浏览 138
已采纳

使用fetch()将jQuery.ajax()替换为Go REST API端点-空有效负载

I currently have a ReactJS web application that creates a POST or PUT request to a REST API endpoint. The REST API is built with golang.

Everything works fine when I use jQuery to make the Ajax POST request. Here's a demonstration of the code:

// my jquery attempt

let sendUrl = "http://192.168.11.241:8000/user";
let sendType = "POST";

let data = {"userid":1};
const postData = [{name:"data",value:JSON.stringify(data)}];

let result = $.ajax({
  type: "POST",
  dataType: 'json',
  cache: false,
  url: sendUrl,
  data: postData
});

And here's what my REST API code looks like

// main.go
package main

import (
  "user"
  "github.com/gorilla/mux"
  "log"
  "net/http"
)

func main() {
    router := mux.NewRouter()
    router.HandleFunc("/payment/{payment_type}", user.Post).Methods("POST","OPTIONS")
     log.Fatal(http.ListenAndServe(":8000", router))
}

// user.go
func Post(w http.ResponseWriter, r *http.Request) {
  w.Header().Set("Access-Control-Allow-Origin", "*")
  w.Header().Set("Access-Control-Allow-Headers", "Content-Type")
  url := mux.Vars(r)
  r.ParseForm()
  qs := r.Form
  fmt.Println(qs)
}

When I run the JS and Go API code, I successfully see the userid 1 content output to bash.

Now I replace my javascript code with fetch call like this:

let sendUrl = "http://192.168.11.241:8000/user";
let sendType = "POST";

let data = {"userid":1};
const postData = [{name:"data",value:JSON.stringify(data)}];

fetch(sendUrl, {
  method: "POST",
  headers: {
    'Accept': 'application/json',
    'Content-Type': 'application/json',
  },
  //body: JSON.stringify(postData)
  body: {"data":JSON.stringify(data)}
});

My Go API acknowledges a POST request is being made, but the post data is empty and I don't see the userid 1. I tried different types of input for the body like with and without json.stringify, I tried different header information like 'Content-Type': 'application/x-www-form-urlencoded', or removing the headers all together, but the data continues to be empty when receiving with my go api.

Anyone know what I'm doing wrong?

  • 写回答

2条回答 默认 最新

  • drflkphi675447 2018-08-11 16:12
    关注

    Ok, I found the right combination of settings for my fetch() call to be this:

    let sendUrl = "http://192.168.11.241:8000/user";
    let sendType = "POST";
    
    let data = {"userid":1};
    const postData = "data="+JSON.stringify(data);
    fetch(sendUrl, {
      method: "POST",
      headers: {
        'Content-Type': 'application/x-www-form-urlencoded',
      },
      body: postData
    });
    

    I had to re-work the structure of my postData object and also change the content-type

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(1条)

报告相同问题?

悬赏问题

  • ¥15 在codeblocks里主函数运行到打印生成的链表就结束了 没有再往下是为什么呢
  • ¥15 宇视vms-B200-A16@R启动不了,如下图所示,在软件工具搜不到,如何解决?(操作系统-linux)
  • ¥500 寻找一名电子工程师完成pcb主板设计(拒绝AI生成式答案)
  • ¥15 关于#mysql#的问题:UNION ALL(相关搜索:sql语句)
  • ¥15 matlab二位可视化能否针对不同数值范围分开分级?
  • ¥15 已经创建了模拟器但是不能用来运行app 怎么办😭自己搞两天了
  • ¥15 关于#极限编程#的问题,请各位专家解答!
  • ¥20 win11账户锁定时间设为0无法登录
  • ¥45 C#学生成绩管理系统
  • ¥30 matlab appdesigner私有函数嵌套整合