node處理上傳圖片，解析，存儲路徑

zoomdong 發布于2019-08-20 15:56 / 1452人閱讀

摘要：圖片上傳，解析數據，存儲文件。參考參考不處理數據不設置請求頭跨域編碼保留擴展名文件大小存儲路徑解析數據獲取文件路徑修改之后的名字同步讀取文件存儲文件刪除文件

圖片上傳，解析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)

GPU云服務器云服務器 js上傳圖片路徑代碼 java圖片存儲路徑騰訊云存儲上傳圖片七牛云存儲圖片上傳

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://m.specialneedsforspecialkids.com/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