使用原生javascript代码写node的上传

谁践踏了优雅 2024-02-17 19:31 18阅读 0赞

服务端使用nodejs获取客户端传递的图片和文件数据  
  
涉及模块：http,FileSystem,querystring,url等模块，还有get,post请求处理模块和静态文件管理模块  
  
文件上传和图片上传到前端页面原则上都是一致：主要通过post file数据  
  
/\* 首先require 加载两个模块 \*/  
var http = require('http'),  
fs = require('fs'),  
url = require('url'),  
querystring = require('querystring'),//处理字符串  
httpParam = require('./http\_param'),  
staticModule = require('./static\_module'),  
formidable = require("formidable");  
  
  
var BASE\_DIR = \_\_dirname;  
http.createServer(function(req, res) \{  
var pathname = url.parse(req.url).pathname;//url请求路径  
httpParam.init(req, res);//初始化GET和POST参数获取模块httpParam的req和res  
if(pathname == '/favicon.ico')\{//过滤请求  
return;  
\}  
switch(pathname)\{  
case '/upload' : upload(res, req);  
break;  
case '/image' : showImage(res, req);  
break;  
case '/' : defaultIndex(res);  
break;  
case '/index' : defaultIndex(res);  
break;  
case '/show' : show(res);  
break;  
default : staticModule.getStaticFile(pathname, res, req);  
break;  
\}  
\}).listen(3000);  
  
  
function defaultIndex(res)\{  
/\* 获取当前index.html的路径 \*/  
var readPath = \_\_dirname + '/' +url.parse('index.html').pathname;  
var indexPage = fs.readFileSync(readPath);  
res.writeHead(200, \{ 'Content-Type': 'text/html' \});  
res.end(indexPage);  
\}  
  
  
function upload(res, req)\{  
var readPath = \_\_dirname + '/' + url.parse('show\_image.html').pathname;//获取show\_image.html文件的路径  
var indexPage = fs.readFileSync(readPath);//获取show\_image.html文件的数据  
var form = new formidable.IncomingForm();//执行表单数据解析，获取其中的post参数  
form.uploadDir = "./uploadFile";//重要的一步  
form.parse(req, function(error, fields, files) \{//获取文件上传数据  
fs.renameSync( files.image.path, BASE\_DIR+ '/uploadFile/test.png');//同步获取上传文件，并保存在/uploadFile下  
res.writeHead(200, \{ 'Content-Type': 'text/html' \});  
res.end(indexPage);  
\});  
\}  
function show(res)\{  
var readPath = \_\_dirname + '/' +url.parse('show\_image.html').pathname;  
var indexPage = fs.readFileSync(readPath);  
res.writeHead(200, \{ 'Content-Type': 'text/html' \});  
res.end(indexPage);  
\}  
  
  
function showImage(res, req)\{  
var retData = \{'retCode':0, 'imageUrl': '/uploadFile/test.png'\};  
res.writeHead(200, \{ 'Content-Type': 'text/plain' \});  
res.end(JSON.stringify(retData));  
\}  
  
  
1、 创建formidable.IncomingForm（）返回的对象  
2、 调用parse方法获取files的信息  
  
  
注：表单中enctype="multipart/form-data"的意思，是设置表单的MIME编码。默认情况，这个编码格式是application/x-www-form-urlencoded，不能用于文件上传；只有使用了multipart/form-data，才能完整的传递文件数据，进行下面的操作.