>웹 프론트엔드 >JS 튜토리얼 >nodejs가 Express를 기반으로 파일 업로드를 구현하는 방법

nodejs가 Express를 기반으로 파일 업로드를 구현하는 방법

亚连
亚连원래의
2018-05-25 17:29:412293검색

이 글에서는 주로 Express를 기반으로 파일 업로드를 구현하는 nodejs의 방법을 소개합니다. 파일 업로드 기능을 구현하기 위해 Express 프레임워크를 기반으로 nodejs의 구체적인 단계와 관련 작업 기술을 분석합니다. nodejs의 예 express를 기반으로 파일 업로드를 구현하는 방법. 참고하실 수 있도록 자세한 내용은 다음과 같습니다.

얼마 전 개인 프로젝트를 할 때 nodejs 서버를 이용해 파일을 업로드했는데, 이제 기록으로 정리하겠습니다.

파일을 업로드할 때 express의 multiparty를 사용합니다. 물론 connect-multiparty 미들웨어를 사용하여 구현할 수도 있지만 공식에서는 connect-multiparty 미들웨어 사용을 권장하지 않는 것 같습니다. 더 이상 고민하지 말고 아래 코드를 살펴보겠습니다.

단계:

(1) express를 사용하여 프로젝트를 만듭니다. 기본값은 jade 템플릿 엔진이지만 아직 html이 익숙해서 html 템플릿으로 변경했습니다.

(2) 프로젝트 디렉터리에서 npm install multiparty를 통해 필요한 구성 요소를 설치합니다.

(3) views/index.html을 수정하고 파일 업로드 양식을 추가합니다.

index.html

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>上传文件</title>
</head>
<body>
  上传文件
  <form method=&#39;post&#39;, action=&#39;/file/uploading&#39;, enctype=&#39;multipart/form-data&#39;>
    <input type="file" name="inputFile">
    <input type="submit" value="上传">
  </form>
</body>
</html>

(4) 페이지 업로드 및 응답 업로드를 위한 배경 코드를 구현하도록 경로/index.js를 수정합니다.

var express = require(&#39;express&#39;);
var router = express.Router();
var multiparty = require(&#39;multiparty&#39;);
var util = require(&#39;util&#39;);
var fs = require(&#39;fs&#39;);
/* 上传页面. */
router.get(&#39;/&#39;, function(req, res, next) {
 //res.render(&#39;./views/index&#39;);
 res.sendfile(&#39;./views/index.html&#39;);
});
/* 上传 */
router.post(&#39;/file/uploading&#39;, function(req, res, next) {
  /* 生成multiparty对象,并配置上传目标路径 */
  var form = new multiparty.Form();
  /* 设置编辑 */
  form.encoding = &#39;utf-8&#39;;
  //设置文件存储路劲
  form.uploadDir = &#39;./public/files&#39;;
  //设置文件大小限制
  form.maxFilesSize = 2 * 1024 * 1024;
  // form.maxFields = 1000;  //设置所有文件的大小总和
  //上传后处理
  form.parse(req, function(err, fields, files) {
    var filesTemp = JSON.stringify(files, null, 2);
    if(err) {
      console.log(&#39;parse error:&#39; + err);
    }else {
      console.log(&#39;parse files:&#39; + filesTemp);
      var inputFile = files.inputFile[0];
      var uploadedPath = inputFile.path;
      var dstPath = &#39;./public/files&#39; + inputFile.originalFilename;
      //重命名为真实文件名
      fs.rename(uploadedPath, dstPath, function(err) {
        if(err) {
          console.log(&#39;rename error:&#39; + err);
        }else {
          console.log(&#39;rename ok&#39;);
        }
      })
    }
    res.writeHead(200, {&#39;content-type&#39;: &#39;text/plain;charset=utf-8&#39;});
    res.write(&#39;received upload:\n\n&#39;);
    res.end(util.inspect({fields: fields, files: filesTemp}))
  })
})
module.exports = router;

위 내용은 제가 모두를 위해 정리한 내용입니다. 앞으로 모든 사람에게 도움이 되기를 바랍니다.

관련 기사:

AngularJS 탭 표시줄 구현 및 mvc 소형 케이스(그래픽 튜토리얼)


React+ajax+java로 이미지 업로드 및 미리보기 기능 구현(그래픽 튜토리얼)


ajax 사용법 방법_질문 예시, Ajax 데이터 처리


위 내용은 nodejs가 Express를 기반으로 파일 업로드를 구현하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.