ask for help. I use the front end written by vue, and the back end written by nodejs now wants to submit the file from the front end by clicking click and passing it to the back end for analysis. The problem now is that the folder set by my back end to receive files can receive files from the front end. But the front end will always show cannot post, check and show: 404, what is the reason for this?
Node.js:
var express = require("express");
var router = express.Router();
var path = require("path");
var formidable = require("formidable");
var fs = require("fs");
router.get("/", function(req, res, next) {
res.send("this is our parser");
});
router.post("/upload", function(req, res){
var form = new formidable.IncomingForm();
form.multiples = true;
form.uploadDir = path.join(__dirname, "/upload");
//
form.on("file", function(field, file) {
fs.rename(file.path, path.join(form.uploadDir, file.name));
});
form.on("error", function(err) {
console.log("An error has occured: \n" + err);
});
form.on("end", function() {
res.end("success");
});
form.parse(req);
});
module.exports = router;
Vue submit function:
submitFile(){
let formData = new FormData();
formData.append("file", this.file);
axios.post("/parser/upload", formData,
{
headers: {
"Content-Type": "multipart/form-data"
}
}
).then(function(){
console.log("SUCCESS!!");
})
.catch(function(){
console.log("FAILURE!!");
});
},
handleFileUpload(){
this.file = this.$refs.file.files[0];
},
the first-level route is parser, and the second-level route is upload. Proxies are also configured in the middle. There is no problem with other functions, such as login and post,get. Is to submit documents that are always reported wrong here. The key is that all the other post paths are correct after the browser checks the car, but the path for submitting documents is always wrong.
error is as follows:
Request URL: http://localhost:8024/
Request Method: POST
Status Code: 404 Not Found
Remote Address: 127.0.0.1 Not Found 49214
Referrer Policy: no-referrer-when-downgrade
this is supposed to be http://localhost:8024/parser/upload.
. I don"t know what went wrong.
the following is the proxy app.js
var app = express();
var indexRouter = require("./routes/index");
var usersRouter = require("./routes/users");
var parserRouter = require("./routes/parser");
// view engine setup
app.set("views", path.join(__dirname, "views"));
app.engine(".html", ejs.__express);
app.set("view engine", "html");
app.use(logger("dev"));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));
app.use(express.json());
app.use(express.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, "public")));
app.use("/", indexRouter);
app.use("/users", usersRouter);
app.use("/parser", parserRouter);
Vue config index.js
const path = require("path")
module.exports = {
dev: {
// Paths
assetsSubDirectory: "static",
assetsPublicPath: "/",
proxyTable: {
"/goods":{
target:"http://localhost:3000"
},
"/parser/*":{
target:"http://localhost:3000"
},
"/users/*":{
target:"http://localhost:3000"
}
},
// Various Dev Server settings
host: "localhost", // can be overwritten by process.env.HOST
port: 8024, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined
autoOpenBrowser: false,
errorOverlay: true,
notifyOnErrors: true,
poll: false, // https://webpack.js.org/configuration/dev-server/-sharpdevserver-watchoptions-