Home > OS >  Problem receiving Axios post data from reactjs app using Golang
Problem receiving Axios post data from reactjs app using Golang

Time:02-05

I have a locally hosted webpage using reactjs that sends an Axios post to port 9000. I have a Golang server listening to that port and it recieves the post. It then decodes the post but never gets any of its data. Below is the portion of code that sends the axios post in the reactjs app.

    onSubmit = (event) => {
        event.preventDefault();
        let { task } = this.state;
        console.log("printing new task title:", task);
        if (task) {
            axios
            .post(
                endpoint   "/api/task",
                {task},
                {headers: {"Content-Type": "application/x-www-form-urlencoded"}}
            )
            .then((res) => {
                this.getTasks();
                this.setState({task: ""});
                console.log(res);
            });
        }
    };

The below is the portion of the golang server that handles the post.

// CreateTask create task route
func CreateTask(w http.ResponseWriter, r *http.Request) {
    w.Header().Set("Context-Type", "application/x-www-form-urlencoded")
    w.Header().Set("Access-Control-Allow-Origin", "*")
    w.Header().Set("Access-Control-Allow-Methods", "POST")
    w.Header().Set("Access-Control-Allow-Headers", "Content-Type")
    var newTask listItem
    _ = json.NewDecoder(r.Body).Decode(&newTask)
    fmt.Println(newTask)
    insertOneTask(newTask)
    json.NewEncoder(w).Encode(newTask)
}

Below is the listItem struct

type listItem struct {
ID        primitive.ObjectID `json:"_id,omitempty" bson:"_id,omitempty"`
Title     string             `json:"title,omitempty"`
Completed bool               `json:"completed,omitempty"`
}

I've tried renaming it to title instead of task, and just passing in a static variable but to no avail.

In the console it correctly prints the inputed text, but when the console outputs the axios response from the golang server, its response never includes the task name.

This is an example of what the data portion of the response from the golang server should look like: data: {_id: '000000000000000000000000', title:'Test'}.

It only ever outputs this data: {_id: '000000000000000000000000'}

The golang terminal output after the post is recieved is as follows:

{ObjectID("000000000000000000000000")  false}
Inserted a Single Record  ObjectID("63decde2a336b8e7cdc2b865")

It seems the task attribute is listed as '' in the new . My problem is the new task doesn't have the inputted text from the webpage. If you need more of the code it's below

  • DevTools - form data

    After the change, the payload will be:

    DevTools - json


    The func CreateTask in go-server/main.go has another issue too. The response is encoded as json:

    json.NewEncoder(w).Encode(newTask)
    

    Which conflicts with:

        w.Header().Set("Context-Type", "application/x-www-form-urlencoded")
    

    The header should be replaced with:

        w.Header().Set("Context-Type", "application/json")
    
  • Related