欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

nodejs 实现简单的文件上传功能(示例详解)

程序员文章站 2024-04-01 16:15:40
首先需要大家看一下目录结构,然后开始一点开始我们的小demo。文件上传总计分为三种方式:1.通过flash,activex等第三方插件实现文件上传功能。2.通过html的form标签实现文件上传功能,...

nodejs 实现简单的文件上传功能(示例详解)

首先需要大家看一下目录结构,然后开始一点开始我们的小demo。

文件上传总计分为三种方式:

1.通过flash,activex等第三方插件实现文件上传功能。

2.通过html的form标签实现文件上传功能,优点:浏览器兼容好。

3.通过xhr level2的异步请求,可以百度formdata对象。

这里使用2做个练习。

node插件请看下package.json文件

  dependencies中就是这次demo的依赖插件。我用的node.js是4.4.4版本的,大家可以把上面代码替换到你的package.json文件中,执行npm install 可以自动安装demo需要的三个依赖插件。

app.js

public/index.js

浏览器地址访问index.html

nodejs 实现简单的文件上传功能(示例详解)

选取文件:我选择了一个timg.jpg的文件

nodejs 实现简单的文件上传功能(示例详解)

点击提交后跳转了页面,提示成功上传

nodejs 实现简单的文件上传功能(示例详解)

我们看一下,linshi名字的问价加下是否已经存在我们上传的文件,下面的图证明文件已经储存在了upload_demo/linshi下面,图片名字被改成了一个临时命名。

我们可以在app.js中写代码处理我们的图片文件了。

nodejs 实现简单的文件上传功能(示例详解)

demo要点:

1.首先安装好nodejs 我这里的版本为4.4.4。

2.创建一个英文命名的文件。手动,或使用npm init创建一个package.json文件。把上述package.json的文件内容替换掉你创建的package.json文件内容。

3.使用npm install 安装package.json中的插件。自动生成了node_modules文件。我们的依赖插件都放在了这里。

4.编写好我们的app.js index.html文件。或者复制上述两处代码。

5.命令行执行node app.js。

6.浏览器访问localhost:3000,即可出现我们的简单的上传页面了。

到此这篇关于nodejs 实现简单的文件上传功能的文章就介绍到这了,更多相关nodejs 文件上传内容请搜索以前的文章或继续浏览下面的相关文章希望大家以后多多支持!