node处理上传图片，解析，存储路径

zoomdong 发布于2019-08-20 15:56 / 1354人阅读

摘要：图片上传，解析数据，存储文件。参考参考不处理数据不设置请求头跨域编码保留扩展名文件大小存储路径解析数据获取文件路径修改之后的名字同步读取文件存储文件删除文件

图片上传，解析formData数据，存储文件。

参考1 http://www.cnblogs.com/yuanke...
参考2 https://github.com/felixge/no...

index.html

test.js

$("button").on("click", function (e) {
    e.preventDefault()
    var obj = new FormData();
        obj.append("img",$("input").get(0).files[0]);
    $.ajax({
        url:"http://localhost:8081/test",
        type:"post",
        data:obj,
        processData:false, // 不处理数据
        contentType : false, // 不设置请求头
        cache:false,
        success:function(data){
            console.log(data)
        }
    })
})

node app.js

const express = require("express")
const fs = require("fs")
const formidable = require("formidable")
const app = express()
const bodyParser = require("body-parser")
app.use(bodyParser.urlencoded({ extended: false }))

app.post("/test",function(req,res){
    // 跨域
    res.header("Access-Control-Allow-Origin", "*");
    res.header("Access-Control-Allow-Methods","PUT,POST,GET,DELETE,OPTIONS");
    res.header("Access-Control-Allow-Headers", "Content-Type,Content-Length, Authorization, Accept,X-Requested-With");
    
    let form = new formidable.IncomingForm();
        form.encoding = "utf-8"; // 编码
        form.keepExtensions = true; // 保留扩展名
        form.maxFieldsSize = 2 * 1024 * 1024; // 文件大小
        form.uploadDir = "C:/Users/Administrator/Downloads"  // 存储路径
        form.parse(req,function(err,fileds,files){ // 解析 formData数据
            if(err){ return console.log(err) }

            let imgPath = files.img.path // 获取文件路径
            let imgName = "./test." + files.img.type.split("/")[1] // 修改之后的名字
            let data = fs.readFileSync(imgPath) // 同步读取文件

            fs.writeFile(imgName,data,function(err){ // 存储文件

                if(err){ return console.log(err) }

                fs.unlink(imgPath,function(){}) // 删除文件
                res.json({code:1})
            })
        })
})

app.listen(8081)

服务器托管私有云 js上传图片路径代码 java图片存储路径腾讯云存储上传图片七牛云存储图片上传

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/82596.html

Node搭建一个DNS服务器

摘要：文件用来路由不同的服务器的有三个功能所以包含有三个模块儿，开头就引入了三个模块儿，通过请求的路径名称我们路由到不同的处理模块儿。链接到一个真实的服务器进行域名解析，且始终使用网络进行查询。 Node搭建DNS服务器的过程接下来请深呼吸一大片代码正奔涌而来，该项目托管在https://github.com/MaxMin-she... 请各位同仁大神view指导。1、route文件用来路...

DevTTL 2019-08-22 14:49 评论0 收藏0
用Node处理文件上传

摘要：前言在开发中，文件上传是一个非常常见非常重要的功能。本文将介绍如何用处理上传的文件。前端界面如下用户从浏览器中选择文件，点击上传，将发起请求到服务器，服务器将接受到的文件存储在服务器硬盘中。前言在Web开发中，文件上传是一个非常常见、非常重要的功能。本文将介绍如何用Node处理上传的文件。需求分析由于现在前后端分离很流行，那么本文也直接采用前后端分离的做法。前端界面如下：sho...

HtmlCssJs 2019-08-22 18:33 评论0 收藏0
node之本地服务器图片上传

摘要：在自己做一个简单的后台管理系统时，用的是作本地数据库，然后用了的组件来实现图片的上传，中间有遇到那么点小坑，这里记录下，比较坑的一点就是，不知道文件的命名不能带空格，然后改了好久文件这里的话，就是简单点的使用图形界面框架的上传组件，然后在自己做一个简单的后台管理系统时，用的是node作本地数据库，然后用了Element-ui的upload组件来实现图片的上传，中间有遇到那么点小坑，这...

LoftySoul 2019-08-23 16:23 评论0 收藏0
基于Vue + Node.js + MongoDB的图片上传组件，实现图片的预览和删除

摘要：网址功能单图多图上传图片上传预览上传进度条分组上传，分组查询新建分组，删除分组删除图片选择图片目录结构前端利用搭建，中引入子组件。实现分组的新增查询删除。利用模块实现删除文件功能。公司要写一些为自身业务量身定制的的组件，要基于Vue,写完后扩展了一下功能，选择写图片上传是因为自己之前一直对这个功能比较迷糊，所以这次好好了解了一下。演示在网址打开后的show.gif中。使用技术：Vu...

hzx 2019-06-26 17:30 评论0 收藏0