如何将文件上传到节点js中的api服务器?(How to upload a file to api server in node js?)

编程入门 行业动态 更新时间:2024-10-25 04:20:40
如何将文件上传到节点js中的api服务器?(How to upload a file to api server in node js?)

我正在构建一个需要上传测试报告的Web应用程序。 我在前端工作,其他人正在后端工作(使用nodejs和mongodb)。 他的api服务器是单独运行的,我的webapp是单独运行的。 现在我需要将上传的文件发送到他的api。 我在做这件事时遇到了问题。 我通过ajax发送数据。 这是我的ajax代码

var $form = $(e.target); var formData = new FormData(); formData.append('productsfile', $('#prdcttestfile')[0].files[0]); formData.append('productid', $('#prdctid').val()); formData.append('warantydays', $('#prdctwarranty').val()); formData.append('baseprice', $('#prdctbaseprice').val()); formData.append('discountedpercent', $('#prdctdiscountedprice').val()); formData.append('taxpercent', $('#prdcttax').val()); formData.append('language', $('#prdctlanguage').val()); formData.append('inventoryid', $('#village').val()); $.ajax({ url: '/product/movetoinventory', type: 'POST', data: formData, contentType: false, processData: false, success: function (response) { if (response.success) { new PNotify({ title: "Enquiry Updted", type: "info", text: "Your enquiry has been updated", nonblock: { nonblock: true }, addclass: 'dark', styling: 'bootstrap3', hide: true, before_close: function (PNotify) { PNotify.update({ title: PNotify.options.title + " - Enjoy your Stay", before_close: null }); PNotify.queueRemove(); return false; } }); $('.modal.in').modal('hide'); $("#inventory_product")[0].reset(); } } });

当我在我的路线中使用console.log(req.body)时,我将获取数据以及文件路径(不是文件)。 如果我使用console.log(req.files)我会变空{}。

I am building a web app which need to upload a test report. i am working on front end and other guy is working on backend(with nodejs and mongodb). His api server is running separately and my webapp is running separately. now i need to send the uploaded file to his api as it is. i am having a problem in doing it. I am sending data through ajax. this is my ajax code

var $form = $(e.target); var formData = new FormData(); formData.append('productsfile', $('#prdcttestfile')[0].files[0]); formData.append('productid', $('#prdctid').val()); formData.append('warantydays', $('#prdctwarranty').val()); formData.append('baseprice', $('#prdctbaseprice').val()); formData.append('discountedpercent', $('#prdctdiscountedprice').val()); formData.append('taxpercent', $('#prdcttax').val()); formData.append('language', $('#prdctlanguage').val()); formData.append('inventoryid', $('#village').val()); $.ajax({ url: '/product/movetoinventory', type: 'POST', data: formData, contentType: false, processData: false, success: function (response) { if (response.success) { new PNotify({ title: "Enquiry Updted", type: "info", text: "Your enquiry has been updated", nonblock: { nonblock: true }, addclass: 'dark', styling: 'bootstrap3', hide: true, before_close: function (PNotify) { PNotify.update({ title: PNotify.options.title + " - Enjoy your Stay", before_close: null }); PNotify.queueRemove(); return false; } }); $('.modal.in').modal('hide'); $("#inventory_product")[0].reset(); } } });

when i use console.log(req.body) in my routes i am getting the data along with the FILE PATH(not file). if i use console.log(req.files) i am getting empty {}.

最满意答案

您可以使用两种方法进行文件上传。

将文件的Base64发送到后端。后端开发人员将此文件存储在服务器中,商店位置的URL将存储在数据库中。

对于节点有multer和connect-multiparty npm。你可以选择其中一个。

对于后端代码是

var express = require('express'), bodyParser = require('body-parser'), host = '127.0.0.1', port = '3002', multer = require('multer'), app = express(); var upload = multer() app.use(bodyParser.urlencoded({ extended: false })) app.post('/file-upload', upload, function(req, res) { console.log('file upload'); }) app.listen(port, function() { console.log('hi server run' + " " + port); })

而最终的代码是

<body> <form method="post" enctype="multipart/form-data" action="http://localhost:3002/file-upload"> <input type="file" name="thumbnail"> <input type="submit"> </form>

我认为第二个选项是文件上传的一个很好的选择。你可以查看multer

用于多个文件上传

You can use two methods for file uploading.

Send Base64 of the file to the backend.The Backend developer store this file in server and URL of the store location will store in the database.

For node have multer and connect-multiparty npm.You can choose one of them.

For backend code is

var express = require('express'), bodyParser = require('body-parser'), host = '127.0.0.1', port = '3002', multer = require('multer'), app = express(); var upload = multer() app.use(bodyParser.urlencoded({ extended: false })) app.post('/file-upload', upload, function(req, res) { console.log('file upload'); }) app.listen(port, function() { console.log('hi server run' + " " + port); })

and the froent-end code is

<body> <form method="post" enctype="multipart/form-data" action="http://localhost:3002/file-upload"> <input type="file" name="thumbnail"> <input type="submit"> </form>

I think that the a second option is a good option for file upload.You can check multer

for multiple file upload at a

更多推荐

本文发布于:2023-07-23 00:52:00,感谢您对本站的认可!
本文链接:https://www.elefans.com/category/jswz/34/1225220.html
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,我们将在24小时内删除。
本文标签:节点   如何将   文件上传   服务器   js

发布评论

评论列表 (有 0 条评论)
草根站长

>www.elefans.com

编程频道|电子爱好者 - 技术资讯及电子产品介绍!