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

 更新时间:2022年02月28日 10:04:12   作者:iwang5566  
这篇文章主要介绍了nodejs 实现简单的文件上传功能,文件上传方式分为三种,本文通过实例代码给大家详细介绍,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下

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

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

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

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

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

这里使用2做个练习。

node插件请看下package.json文件

{
  "name": "upload",
  "version": "0.1.0",
  "description": "upload demo",
  "main": "app.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "iwang",
  "license": "ISC",
  "dependencies": {
    "body-parser": "^1.15.2",
    "connect-multiparty": "^2.0.0",
    "express": "^4.14.0"
  }
}

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

app.js

/**
 * Created by iwang on 2017/1/15.
 */
//express使用的是@4版本的。
var express = require('express');
//form表单需要的中间件。
var mutipart= require('connect-multiparty');

var mutipartMiddeware = mutipart();
var app = express();
//下面会修改临时文件的储存位置,如过没有会默认储存别的地方,这里不在详细描述,这个修改临时文件储存的位置 我在百度里查找了三四个小时才找到这个方法,不得不说nodejs真难学。//所以在这里留下我的学习记录,以备以后翻阅。
app.use(mutipart({uploadDir:'./linshi'}));
//设置http服务监听的端口号。
app.set('port',process.env.PORT || 3000);
app.listen(app.get('port'),function () {
    console.log("Express started on http://localhost:"+app.get('port')+'; press Ctrl-C to terminate.');
});
//浏览器访问localhost会输出一个html文件
app.get('/',function (req,res) {
    res.type('text/html');
    res.sendfile('public/index.html')
//这里用来玩,express框架路由功能写的,与上传文件没没有关系。
app.get('/about',function (req,res) {
    res.type('text/plain');
    res.send('Travel about');
//这里就是接受form表单请求的接口路径,请求方式为post。
app.post('/upload',mutipartMiddeware,function (req,res) {
    //这里打印可以看到接收到文件的信息。
    console.log(req.files);
    /*//do something
    * 成功接受到浏览器传来的文件。我们可以在这里写对文件的一系列操作。例如重命名,修改文件储存路径 。等等。
    *
    * */
    //给浏览器返回一个成功提示。
    res.send('upload success!');

public/index.js

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <form action="/upload" enctype="multipart/form-data" method="post">
        <p>附件:<input type="file" name="myfile" style=""></p>
        <p>
            <input type="submit">
        </p>
    </form>
</body>
</html>

浏览器地址访问index.html

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

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

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

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

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 文件上传内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • node.js中的fs.unlink方法使用说明

    node.js中的fs.unlink方法使用说明

    这篇文章主要介绍了node.js中的fs.unlink方法使用说明,本文介绍了fs.unlink的方法说明、语法、接收参数、使用实例和实现源码,需要的朋友可以参考下
    2014-12-12
  • npm install --save 、--save-dev 、-D、-S 的区别与NODE_ENV的配置方法

    npm install --save 、--save-dev 、-D、-S&nb

    这篇文章主要介绍了npm install --save 、--save-dev 、-D、-S 的区别与NODE_ENV的配置方法,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2022-08-08
  • node登录生成token并验证的实现

    node登录生成token并验证的实现

    token校验作为项目里的必要项,其重要性不言而喻,本文主要介绍了node登录生成token并验证的实现,具有一定的参考价值,感兴趣的可以了解一下
    2024-02-02
  • 解读node.js中的path路径模块

    解读node.js中的path路径模块

    这篇文章主要介绍了解读node.js中的path路径模块,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2023-01-01
  • nodejs require js文件入口,在package.json中指定默认入口main方法

    nodejs require js文件入口,在package.json中指定默认入口main方法

    今天小编就为大家分享一篇nodejs require js文件入口,在package.json中指定默认入口main方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2018-10-10
  • 基于node实现websocket协议

    基于node实现websocket协议

    这篇文章主要介绍了基于node实现websocket协议的相关资料,需要的朋友可以参考下
    2016-04-04
  • node.js中的require使用详解

    node.js中的require使用详解

    本文通过几个具体实例来分析讲解了node.js中require的使用方法,非常的详尽,这里推荐给大家
    2014-12-12
  • Node.js assert断言原理与用法分析

    Node.js assert断言原理与用法分析

    这篇文章主要介绍了Node.js assert断言原理与用法,结合实例形式分析了assert模块断言函数与使用技巧,需要的朋友可以参考下
    2019-01-01
  • 2014年最火的Node.JS后端框架推荐

    2014年最火的Node.JS后端框架推荐

    用nodejs开发web应用,用哪个框架好?express?还是其他什么?今天小编就来给大家推荐一下今年最好用的几款Node.js后端框架
    2014-10-10
  • 从零学习node.js之利用express搭建简易论坛(七)

    从零学习node.js之利用express搭建简易论坛(七)

    这篇文章主要介绍了node.js利用express搭建简易论坛的方法,我们需要搭建的这个简易的论坛主要的功能有:注册、登录、发布主题、回复主题。下面我们来一步步地讲解这个系统是如何实现的,需要的朋友可以参考借鉴。
    2017-02-02

最新评论