简体   繁体   English

NodeJS发布请求“无法发布/上传”

[英]NodeJS Post Request "Cannot POST /upload"

I am trying to make a simple upload function on my web application created in NodeJS.我正在尝试在 NodeJS 中创建的 Web 应用程序上创建一个简单的上传功能。 I have a route to /admin that I am using to render the form page.我有一条通往 /admin 的路线,我用它来呈现表单页面。 Below is the HTML of the /admin.handlebars page.下面是 /admin.handlebars 页面的 HTML。

<body>
  <div class = "container">
    <div class = "row">
      <div class = "col-md-6 m-auto">
        <h1 class = "text-center display-4 my-4">Upload Tutorial Template</h1>
        <form action = "./upload" method ="POST" enctype="multipart/form-data">
          <div class="custom-file mb-3">
            <input type="file" name="file" id="file" class="custom-file-input">
            <label for = "file" class="custom-file-label">Choose Video</label>
            </div
        </form>
        <input type="submit" value="Submit" class="btn btn-primary btn-block"
      </div>
    </div>
  </div>`

The part of the admin.js file that handles the post request is displayed below, currently I am trying to render on screen the file name, but instead when I click the sumbmit button the screen displays "Cannot POST /upload".下面显示了 admin.js 文件中处理 post 请求的部分,目前我正在尝试在屏幕上呈现文件名,但是当我单击 sumbmit 按钮时,屏幕显示“无法 POST /upload”。

router.get('/', function (req, res) {
  console.log("Rendered Upload page")
  res.render('admin');
});

//route of post to upoad, Uploads file to db
router.post('/upload', upload.single('file'), function (req, res) {
  console.log("Post made")
  res.response({file: req.file});
});

Edit, the main app.js file also.编辑主 app.js 文件。

 var express = require('express');
 var path = require('path');
 var cookieParser = require('cookie-parser');
 var bodyParser = require('body-parser');
 var exphbs = require('express-handlebars');
 var expressValidator = require('express-validator');
 var flash = require('connect-flash');
 var session = require('express-session');
 var passport = require('passport');
 var LocalStrategy = require('passport-local').Strategy;
 var mongo = require('mongodb');
 var mongoose = require('mongoose');


 //Mongoose Part
 mongoose.connect('mongodb://localhost/loginapp');
 //mongodb
 var db = mongoose.connection;

var routes = require('./routes/index');
var users = require('./routes/users');
var admin = require('./routes/admin');

//start app
// using express for first time to initialize
var app = express();

//Viewing engine start here\
// views folder to handle views
app.set('views', path.join(__dirname, 'views'));
// set hanglebards ass the engine, default layout called layout.handlebars
app.engine('handlebars', exphbs({defaultLayout:'layout'}));
//set to handlebards
app.set('view engine', 'handlebars');
//images
// app.set('view engine', 'ejs')

app.use(express.static('views/images'));

//Middleware config
//Video Tutorial
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false}));
app.use(cookieParser());

// Public Folder to hold images, jquery, stylesheets
app.use(express.static(path.join(__dirname, 'public')));

//use of Express session
app.use(session({
  secret: 'secret',
  saveUnitialized: true,
  resave: true
}));

//PASSPORT INNIT FOR VALIDATIOn
app.use(passport.initialize());
app.use(passport.session());

//Express Validator from https://devhub.io/repos/ctavan-express-validator
app.use(expressValidator({
  errorFormatter: function(param, msg, value) {
      var namespace = param.split('.')
      , root    = namespace.shift()
      , formParam = root;

    while(namespace.length) {
      formParam += '[' + namespace.shift() + ']';
    }
    return {
      param : formParam,
      msg   : msg,
      value : value
    };
  }
}));

//connect the flash
app.use(flash());

//set GLOBAL variables for flash messages
app.use(function (req, res, next) {
  //response local sucess message = require flash 'sucess msg'
  res.locals.sucess_msg = req.flash('sucess_msg');
  res.locals.error_msg = req.flash('error_msg');
  //passport error messages
  res.locals.error = req.flash('error');
  //for the nav bar when logged inspect
  res.locals.user = req.user || null;
  next();
});


app.use('/', routes);
// ADMIN BELOW
app.use('/admin', admin);
//UPLAOD BIT
app.use('/users', users);

//Setting the port for the page/app
app.set('port', (process.env.PORT || 3000));

app.listen(app.get('port'), function(){
  console.log('Server Started on Port '+app.get('port'));
})

Not sure of your server configuration, but you can try below不确定您的服务器配置,但您可以尝试以下

const port = 3000;

var express = require('express'),
    app = express();
var bodyParser = require('body-parser');

app.use(express.static(__dirname + '/public'));

app.use(bodyParser.urlencoded({
   extended: false;
}));

app.use(bodyParser.json());

router.get('/', function (req, res) {
  console.log("Rendered Upload page")
  res.render('admin');
});

router.post('/upload', upload.single('file'), function (req, res) {
  console.log("Post made")
  res.response({file: req.file});
});

app.listen(port);

download, require and set multer to a destination.下载,要求并将multer设置到目的地。 just before your //route of post to upoad, Uploads file to db就在你的// 路由到上传之前,将文件上传到数据库

const multer = require('multer')
const upload = multer({dest: 'images'})

please try请尝试

       <form action ="upload" method ="post" enctype="multipart/form-data">

and also use postman to test your nodejs handler if it works as expected please have a look at this link to use postman for file upload postman file upload并且还使用邮递员来测试您的 nodejs 处理程序,如果它按预期工作,请查看此链接以使用邮递员进行文件上传邮递员文件上传

after testing the posting you can decide which part is the wrong part测试发布后,您可以决定哪个部分是错误的部分

also please make sure that multer is initialized like还请确保 multer 被初始化为

var multer  = require('multer')
var upload = multer({ dest: 'uploads/' })

before your handlers在你的处理程序之前

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM