zoukankan      html  css  js  c++  java
  • nodejs实现文件的上传功能

    1.服务端接收文件

    // app.js
    
    // 在 app.js 中加载我们写好的处理文件上传的模块
    var upload = require('./routes/upload');
    
    // 允许跨域访问  使用的是cors解决跨域问题,当我们再本地直接请求该接口的时候,可以直接请求
    app.all('*', function(req, res, next) {  
        res.header("Access-Control-Allow-Origin", "*");  
        res.header("Access-Control-Allow-Headers", "X-Requested-With");  
        res.header("Access-Control-Allow-Methods","PUT,POST,GET,DELETE,OPTIONS");  
        res.header("X-Powered-By",' 3.2.1')  
        res.header("Content-Type", "application/json;charset=utf-8");  
        next();  
    });
    
    app.use('/upload', upload);
    

    2.上传文件代码

    // upload.js
    
    var express = require('express');
    var router = express.Router();
    
    var fs = require('fs');
    var multer  = require('multer');
    
    // 使用硬盘存储模式设置存放接收到的文件的路径以及文件名
    var storage = multer.diskStorage({
        destination: function (req, file, cb) {
            // 接收到文件后输出的保存路径(若不存在则需要创建)
            cb(null, 'upload/');    
        },
        filename: function (req, file, cb) {
            // 将保存文件名设置为 时间戳 + 文件原始名,比如 151342376785-123.jpg
            cb(null, Date.now() + "-" + file.originalname);  
        }
    });
    
    // 创建文件夹  使用此代码就是为了让我们查找磁盘中是否有该文件夹,如果没有,可以自动创建,而不是我们提前手动创建好。如果不使用此代码,则我们再使用该文件夹之前,需要手动创建好当前问价夹
    var createFolder = function(folder){
        try{
            // 测试 path 指定的文件或目录的用户权限,我们用来检测文件是否存在
            // 如果文件路径不存在将会抛出错误"no such file or directory"
            fs.accessSync(folder); 
        }catch(e){
            // 文件夹不存在,以同步的方式创建文件目录。
            fs.mkdirSync(folder);
        }  
    };
    
    var uploadFolder = './upload/';
    createFolder(uploadFolder);
    
    // 创建 multer 对象
    var upload = multer({ storage: storage });
    
    /* POST upload listing. */
    router.post('/', upload.single('file'), function(req, res, next) {
        var file = req.file;
        console.log('文件类型:%s', file.mimetype);
        console.log('原始文件名:%s', file.originalname);
        console.log('文件大小:%s', file.size);
        console.log('文件保存路径:%s', file.path);
        // 接收文件成功后返回数据给前端
        res.json({res_code: '0'});
    });
    
    // 导出模块(在 app.js 中引入)
    module.exports = router;
    

    注意:使用如下代码的目的是:

    //DiskStorage磁盘存储引擎可以让你控制文件的存储
    
    var storage = multer.diskStorage({
       destination: function (req, file, cb) {
           cb(null, 'upload/');    
       },
       filename: function (req, file, cb) {
           cb(null, Date.now() + "-" + file.originalname);  
       }
    });
    
    var upload = multer({ storage: storage });

    测试接口文件:

    <form action="http://localhost:3000/upload" method="post" enctype="multipart/form-data">
        <input type="file" name="logo" />
        <input type="submit" value="提交">    
    </form>
    

      

      

  • 相关阅读:
    redhat 7.6 常用命令
    redhat 7.6 VI编辑操作
    redhat 7.6 网络配置
    华为学习配置笔记-01 配置con密码
    redhat 7.6 ssh 服务配置
    web前端面试第一次[addEventListenr();绑定事件]
    redis集群搭建
    linux服务器重启后redis数据丢失问题
    redis日志文件路径的设置
    linux下redis安装使用
  • 原文地址:https://www.cnblogs.com/lxz123/p/13865546.html
Copyright © 2011-2022 走看看