> 웹 프론트엔드 > JS 튜토리얼 > node.js는 multer 미들웨어를 사용하여 파일을 업로드합니다.

node.js는 multer 미들웨어를 사용하여 파일을 업로드합니다.

青灯夜游
풀어 주다: 2021-03-04 10:36:16
앞으로
1829명이 탐색했습니다.

이 글에서는 node.js가 multer 미들웨어를 사용하여 게시물 파일 업로드 문제를 해결하는 방법을 소개합니다. 도움이 필요한 친구들이 모두 참고할 수 있기를 바랍니다.

node.js는 multer 미들웨어를 사용하여 파일을 업로드합니다.

관련 권장 사항: "nodejs 튜토리얼"

body-parser 미들웨어는 실제로 "매우 불완전"합니다. "순수한 데이터"만 처리할 수 있습니다.
우리 모두 알고 있듯이 post는 다음 두 가지 용도로 자주 사용됩니다.

  • 데이터 제출(포스트 양식 제출)

  • 파일 업로드

그러나 "유명한" body-parser는 첫 번째 작업만 수행할 수 있습니다.

불편해요...

이전에 작성한 이미지 파일 업로드 기사에 강력한 모듈이 사용되었습니다. 그 핵심은 다음과 같습니다.

var form=new formidable.IncomingForm();
로그인 후 복사

다음 form.uploadDirfield/end 모니터링< /em> … 모두 이를 기반으로 합니다. form.uploadDirfield/end的监听 … 都是基于此。

好了这里我们要说的是缺点:和body-parser一样,formidable插件只能用来处理图片格式,也是一大遗憾了。


于是,笔者找到了 multer中间件 ,希望它能“拯救者支离破碎的山河” (呵呵)

multer中间件的应用之一:文件上传

(c)npm install express multer
로그인 후 복사
const express = require(&#39;express&#39;);
const bodyparser = require(&#39;body-parser&#39;);//解析post数据
const multer = require(&#39;multer&#39;); //解析Post文件
const fs = require(&#39;fs&#39;);
const pathlib = require(&#39;path&#39;); //解析文件路径
 
var server = express();
 
var objMulter = multer({dest:&#39;./www/upload&#39;}); //用户上传文件存入dest目录下
server.use(objMulter.any()); //处理任何用户上传的文件
 
//处理post文件数据
server.post(&#39;/&#39;,function(req,res){
	console.log(req.files[0].originalname); //req.files post文件 originalname为文件名
 
	//获取原始拓展名+后缀名
	var newName = req.files[0].path+pathlib.parse(req.files[0].originalname).ext;
 
	//重命名
	fs.rename(req.files[0].path,newName,function(err){
		if(err){
			res.send(&#39;上传失败&#39;);
		}else{
			res.send(&#39;上传成功&#39;);
		}
	});
});
server.listen(8081);
로그인 후 복사

这里,用req.files顶替了req.body:因为body中只能存放(文字)数锯——这里如果用body-parser的话,看到的只是控制台上显示的文件名。

代码中objMulter.any() 作用是“ 获取所有数据 ”;
any() 相对的还有一个single() ,它里面要指定一个参数——前端<input> 里的name名!如本例中还可以这样写:

server.use(objMulter.single(&#39;f1&#39;));
로그인 후 복사

前端代码如下 —— 文件提交,指定格式为multipart/form-data

알겠습니다. 여기서 이야기하고 싶은 것은 단점입니다. body-parser와 마찬가지로 이 강력한 플러그인은 이미지 형식을 처리하는 데만 사용할 수 있다는 점 또한 큰 아쉽습니다.

그래서 저자는 "깨진 산과 강을 살릴" 수 있기를 바라며
multer 미들웨어
를 발견했습니다(ㅋㅋㅋ)

멀터 미들웨어의 응용 프로그램 중 하나: 파일 업로드

<form action="http://localhost:8081/" method="post" enctype="multipart/form-data">
	文件:<input type="file" name="f1" /><br />
	<input type="submit" value="上传" />
</form>
로그인 후 복사
var http = require(&#39;http&#39;);
var fs = require(&#39;fs&#39;);
var path = require(&#39;path&#39;);

var server = http.createServer(function (req, res) {
    var method = req.method; // 获取请求方法
    if (method === &#39;POST&#39;) { // 暂只关注 post 请求
        var dataStr = &#39;&#39;;
        req.on(&#39;data&#39;, function (chunk) {
            // 接收到数据,先存储起来
            var chunkStr = chunk.toString()
            dataStr += chunkStr
        });
        req.on(&#39;end&#39;, function () {
            // 接收数据完成,将数据写入文件
            var fileName = path.resolve(__dirname, &#39;post.txt&#39;);
            fs.writeFile(fileName, dataStr)
            res.end(&#39;OK&#39;);
        });
    }
});
server.listen(8081);
로그인 후 복사
여기, req.files를 사용하면 req.body가 대체됩니다. body는 (텍스트) 숫자만 저장할 수 있기 때문에 여기에서 body-parser를 사용하면 콘솔에 표시되는 파일 이름만 볼 수 있습니다.
코드에서 objMulter.any()의 기능은 "모든 데이터를 가져오는 것"입니다. any(와 반대되는 <code>single()도 있습니다. ) > , 매개변수(프론트 엔드 <input>의 이름)를 지정해야 합니다! 예를 들어, 이 예에서는 다음과 같이 작성할 수도 있습니다.

rrreee프런트 엔드 코드는 다음과 같습니다. 파일 제출, 형식을 multipart/form-data로 지정: rrreee

🎜 실제로 rename(fs 모듈의 Original path, new path, callback) 메서드를 사용하면 파일의 저장 경로를 강제로 변경하여 "파일 업로드" 목적을 달성합니다. 🎜🎜🎜🎜🎜오늘의 확장팩: 🎜🎜 경로 모듈의 해결 방법은 노드에서 "파일 지정"을 위해 일반적으로 사용됩니다(16/17행 참고): 🎜rrreee🎜더 많은 프로그래밍 관련 지식을 보려면 다음을 방문하세요: 🎜Programming 학습🎜 ! ! 🎜

위 내용은 node.js는 multer 미들웨어를 사용하여 파일을 업로드합니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:csdn.net
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
최신 이슈
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿