Блог

Главная - Вопросы по программированию - загрузка файлов javascript с использованием POST Nodejs

загрузка файлов javascript с использованием POST Nodejs

#javascript #node.js

#javascript #node.js

Вопрос:

Я пытаюсь записать видео и загрузить на сервер. Я могу создавать видео, но загрузка не работает. Что я мог делать неправильно. я попытался загрузить файл непосредственно с сервера (a.click()). это работает, но я не могу загрузить на сервер nodejs

я могу публиковать текстовые значения и извлекать их с сервера. я могу загружать файлы, выбранные из файловой системы, используя форму в html, и передавать файл, выбранный в качестве него напрямую .. ниже 

 <form id="uploadForm"
      enctype="multipart/form-data"
      action="/upload"
      method="post">
  <input type="file" name="file" />
  <input type="submit" value="Upload Image" name="submit">
  <span id = "status"></span>
</form>

я также могу отправлять файлы с помощью сокета.ввод-вывод, если выполняется socket.emit(‘msg’, files) Но я не могу использовать сокет в среде prod. Я открыт для любого другого способа отправки записанного файла на сервер nodejs

Серверный код 

 var express	=	require("express");
var multer	=	require('multer');

var app	=	express();
var fs = require('fs');
var storage	=	multer.diskStorage({
  destination: function (req, file, callback) {
    callback(null, './uploads');
  },
  filename: function (req, file, cb) {
              var datetimestamp = Date.now();
              cb(null, file.originalname   '-'   datetimestamp   '.'   file.originalname.split('.')[file.originalname.split('.').length -1])
          }
    });
var upload = multer({ storage : storage}).single('file');
app.get('/',function(req,res){
      res.sendFile(__dirname   "/index.html");
});
app.post('/uploadlocal',function(req,res){

	upload(req,res,function(err) {console.log(req.files);
	console.log(req.body);

		if(err) {
			return res.end("Error uploading file.");
		}
	
		res.end("File is uploaded");
	});
});



app.listen(3000,function(){
    console.log("Working on port 3000");
});

Клиентский код

 function download() {
  var blob = new Blob(recordedBlobs, {type: 'video/webm'});
  var url = window.URL.createObjectURL(blob);
      var files = {

                                  video: {
                                      type: 'video/webm',
                                      dataURL: url
                                  }
                            };
  console.log('recording done');

  var a = document.createElement('a');
  a.style.display = 'none';
  a.href = url;
  a.download = 'test.webm';
  document.body.appendChild(a);
a.click();
  postclick(files);

  setTimeout(function() {
    document.body.removeChild(a);
    window.URL.revokeObjectURL(url);
  }, 100);
}


function postclick(data) {
    var form = $('<form></form>');

    form.attr("method", "post");
    form.attr("action", '/uploadlocal');
    var field = $('<input></input>');
    field.attr("type", "text");
	field.attr("name", 'file');
    field.attr("value", data );

        form.append(field);
    $(document.body).append(form);
    form.submit();
}

Комментарии:

1. Можете ли вы подтвердить, имеет ли папка, в которую вы пытаетесь загрузить свои файлы => ./uploads , все необходимые разрешения на чтение / запись?

2. разрешения в порядке

3. Две вещи: правильно ли вы enctype установили в своем <form> теге?, также вы установили accept атрибут в своем <input type="file".. теге как accept="video/mp4,video/x-m4v,video/*" ?

4. Соответствующим образом обновите свой mime-тип в своем accept атрибуте, который я привел mp4 и x-m4u просто для справки

5. Не могли бы вы поделиться и примером.. Я могу загружать мультимедиа непосредственно из HTML напрямую

Ответ №1:

решена проблема путем создания xmlhttprequest

 var formData = new FormData();
formData.append('file', blob, "test.webm");
var request = new XMLHttpRequest();
request.open("POST", "/upload");
request.send(formData);