天天看点

使用NodeJS将文件或图像上传到服务器

在这篇文章中,我们将看到如何使用nodejs上传文件或图像到服务器。这里我们将使用visual studio和以下npm包用于我们的开发过程。

express

multer

body-parser

我们将简要解释这些包的使用。众所周知,nodejs是一个基于chrome v8

javascript引擎的运行时环境,用于服务器端和网络应用程序。并且它是支持跨平台的开放资源。nodejs应用程序用纯javascript编写。如果你是nodejs新手,那么我强烈建议你阅读我以前关于node

js的帖子。

下载源代码

<a href="https://code.msdn.microsoft.com/upload-files-or-to-server-15f69aaa" target="_blank">使用node js上传文件或图像到服务器</a>

<a></a>

几年前,如果你需要上传任何文件或图像到服务器,那么你得完全依赖于服务器端语言如c#和php。在js革命之后,一切都改变了。今天我将告诉你如何使用nodejs上传文件到服务器,甚至不需要写一行服务器端代码。希望你会喜欢。

使用NodeJS将文件或图像上传到服务器

开始之前,我们首先要设置我们的依赖关系。为此,请打开package.json文件并粘贴代码。

现在,运行npm install命令,如下所示。

运行该命令后,可以看到解决方案中安装了依赖关系。

使用NodeJS将文件或图像上传到服务器

现在我们可以理解这些依赖关系是用来干什么的了。

你可以按如下所示创建依赖关系的实例。

然后,创建说明应该在哪里以及如何保存文件/图像的storage。

每个文件包含以下信息:

fieldname:在窗体中指定的字段名

originalname:用户计算机上文件的名称

encoding:文件的编码类型

mimetype:文件的mime类型

size:文件的大小(以字节为单位)

destination:保存文件的文件夹

filename:目标文件的名称

path:上传文件的完整路径

buffer:整个文件的buffer

现在请创建multer对象如下。

这里multer接受我们在上一步中创建的storage作为参数。函数

接受文件数组,所有文件名都为fieldname。

现在我们该写post和get请求了:

这里/ api / upload是我们将要设置的操作名称,在我们马上就会创建的html页面上。最后,但并非最不重要的是,我们需要确保应用程序正在侦听我们的特定端口,在本例下,为port 2000。

你可以使用jquery-3.1.1.min.js和jquery.form.min.js的引用创建如下所示的页面。

请注意,用于表单的ecctype必须是multipart / form-data,操作必须与我们在api中设置的相同。

现在创建ajax事件,在事件中我们将调用我们的api。

ajaxsubmit函数是插件jquery.form.min.js的一部分,因此请确保你已经包含它。

现在请运行你的应用程序。在运行应用程序之前,你总是可以将脚本文件设置为启动文件,要设置的话就右键单击项目并单击属性。

使用NodeJS将文件或图像上传到服务器

现在你可以打开命令提示符,你可以在命令提示符处手动定位项目,也可以使用“open command prompt here”选项。要选择的话,请右键单击你的项目并选择如下选项。

使用NodeJS将文件或图像上传到服务器

现在在命令提示符中键入node server.js,这将确保你的服务器正在运行。如果一切ok的话,你可以看到如下窗口。

使用NodeJS将文件或图像上传到服务器

现在我们可以运行我们的网页,因为服务器已经准备就绪,请访问浏览器并输入网址http://localhost:2000。使用我们创建的文件上传器选择几个文件。

使用NodeJS将文件或图像上传到服务器

如果单击提交,你可以看到我们正在调用我们的方法操作,并且文件已上传。

使用NodeJS将文件或图像上传到服务器
使用NodeJS将文件或图像上传到服务器

你总是可以下载附带的源代码以查看完整的代码和应用程序。编码快乐!

不知道我有没有遗漏的地方?你觉得这篇文章有用吗?希望你喜欢这篇文章。欢迎给出你宝贵的建议和反馈。

作者:小峰

来源:51cto

继续阅读