Axios can GET but not POST to the same URL

问题:

• I'm building a react app
• In one component I'm writing this GET request which works:

• In another component I'm writing this POST request:

• Which then returns this 404 error:

And I have no idea how my GET works but my POST returns 404:not found when I'm requesting the same file both times?

UPDATE:

I'm running a node.js server now but it's a bit of a frankenstein's monster as this really isn't an area I have an understanding of. Does anyone know what I'm doing wrong?

// Server setup from node.js website
const http = require('http');
const hostname = '127.0.0.1';
const port = 3000;

const server = http.createServer((req, res) => {
  res.statusCode = 200;
  res.setHeader('Content-Type', 'text/plain');
  res.end('Hello World\n');
});

server.listen(port, hostname, () => {
  console.log(`Server running at http://${hostname}:${port}/`);
});


// Trying to listen for data from React app to feed into JSON (broken)
var express = require("express");
var myParser = require("body-parser");
var app = express();

app.use(myParser.urlencoded({extended : true}));
app.post("/scene-setup.json", function(request, response) {
    console.log(request.body); //This prints the JSON document received (if it is a JSON document)
});
app.listen(3001);


// Updating JSON file with "obj" (working)
var jsonfile = require('jsonfile')

var file = './scene-setup.json'
var obj = {name: 'JP'}

jsonfile.writeFile(file, obj, function (err) {
  console.error(err)
})

回答1:

Axios is used for making HTTP requests. So, you should have a backend server running that can handle these requests. I am not sure what exactly is the data that you want to save. If you need access to that data, should be saving it on the backend.

If you want to save some data just on the client side, HTML5 filesystem API might be something you want to look at. It can manage some data in the limited sandboxed part of user's filesystem.