2016-07-22 7 views
0

В настоящее время я пытаюсь добавить грозное, поэтому я могу обрабатывать формы, которые также включают файлы (изображения, фактически), которые загружаются, я читал комментарии, говорящие, что оба модуля не могут работать вместе, но this комментарий здесь показывает, что они оба работают вместе.Использование body-parser с грозным

Это код, где я пытаюсь справиться форме

router.post("/", middleware.isLoggedIn, function(req, res){ 

var form = new formidable.IncomingForm(); 
console.log(form); 
form.uploadDir = "../img"; 
form.keepExtensions = true; 
form.parse(req, function(err, fields, files) { 
    if(err){ 
     console.log(err); 
    } 
    console.log(fields); 
    console.log(files); 
}); 

И это все зависимости у меня есть

var express = require("express"), 
app = express(), 
bodyParser = require("body-parser"), 
mongo = require("mongoose"), 
User = require("./models/user"), 
passport = require("passport"), 
passportLocal = require("passport-local"), 
indexRoutes = require("./routes/index"), 
commentRoutes = require("./routes/comments"), 
picRoutes = require("./routes/pictures"), 
methodOverride = require("method-override"), 
formidable = require("formidable"); 
app.use(bodyParser.urlencoded({extended: true})); 
app.set("view engine", "ejs"); 
app.use(express.static(__dirname + "/public")); 
app.use(methodOverride("_method")); 
mongo.connect("mongodb://localhost/yelp_camp"); 
app.use(passport.initialize()); 
app.use(passport.session()); 
passport.use(new passportLocal(User.authenticate())); 
passport.serializeUser(User.serializeUser()); 
passport.deserializeUser(User.deserializeUser()); 

Это то, что в настоящее время показано, когда я вхожу форму перед разбором

IncomingForm { 
domain: null, 
_events: {}, 
_eventsCount: 0, 
_maxListeners: undefined, 
error: null, 
ended: false, 
maxFields: 1000, 
maxFieldsSize: 2097152, 
keepExtensions: false, 
uploadDir: '/tmp', 
encoding: 'utf-8', 
headers: null, 
type: null, 
hash: false, 
multiples: false, 
bytesReceived: null, 
bytesExpected: null, 
_parser: null, 
_flushing: 0, 
_fieldsSize: 0, 
openedFiles: [] } 

Форма:

<div class="container"> 
    <div class="row"> 
     <div class="form"> 
      <h1>Add new campground</h1> 
      <form action="/pictures" method="post"> 
       <div class="form-group"> 
        <label for="name">Give a name to your picture</label> 
        <input class="form-control" id="name" type="text" name="campground[name]" placeholder="Name" autofocus required> 
       </div> 
       <div class="form-group" id="linkDiv"> 
        <label for="link">Paste a direct link to your image</label> 
        <input type="radio" id="link" name="method" value="link"><input class="form-control" id="fileLink" type="text" name="campground[image]" placeholder="Image URL"></input></input> 
       </div> 
       <div class="form-group" id="uploadDiv"> 
        <label for="upload">Or upload the picture</label> 
        <input type="radio" id="upload" name="method" value="upload"><input class="form-control" id="fileUpload" type="file" name="image" value="Upload file" disabled></input></input> 
       </div> 
       <div class="form-group"> 
        <label for="description">Add a description to your picture</label> 
        <input class="form-control" id="description" type="text" name="campground[description]" placeholder="Description"> 
       </div> 
       <div class="form-group"> 
        <button class="btn btn-lg btn-primary btn-block">Submit!</button> 
       </div> 
      </form> 
     </div> 
    </div> 
</div> 

Но после этого синтаксического анализа, кажется, не бежать, ни один из console.log показан

ответ

0

обоих модулей [тело-парсер и грозным] не могут работать вместе

Но работает :) Я использую их вместе.

На стороне сервера

// app.js 
app.use(require('body-parser').urlencoded({extended: false})); 

// inside upload-router function (req, res, next) 
var formidable = require ('formidable'); 
var fs = require('fs'); 

var form = new formidable.IncomingForm(); 
form.uploadDir = '/public/temp/'; 

form.parse(req, function(err, fields, files) { 
    var file = files.file; 
    var target = '/public/temp/' + file.name; 
    fs.rename(file.path, target, function (err) { 
      if (err) 
       return next(err); 
      ... 
     }); 
    }); 
} 

На клиенте

<form id = "upload-form" method = "post" > 
    <input type="file" id = "upload-input" name = "file" required /> 
    <input type = "button" onclick = "ajax...">Upload</input> 
</form> 
... 
$.ajax({ 
    type: 'POST', 
    url: '/upload', 
    data: new FormData($('#upload-form')[0]), 
    enctype: 'multipart/form-data', 
    processData: false, 
    contentType: false, 
    dataType: 'json', 
    success: function (data) { 
     ... 
    } 
}); 
+0

Нужно ли добавить ENCTYPE для того, чтобы работать? Помимо того, что fs и urlencoded не были истинными, я не вижу различий между нашими кодами, это проблема? – Danyx

+0

Я пробовал изменить enctype и urlencoded. Нет проблем, результат в порядке. Попробуйте открыть консоль браузера, отправьте файл и убедитесь, что файл отправлен клиентом. –

+0

Необходим ли Ajax при использовании грозного? Я только использовал HTML-формы, обновлял свой пост, чтобы вы могли видеть. PS: извините за поздний ответ. – Danyx

 Смежные вопросы

  • Нет связанных вопросов^_^