티스토리 뷰
파일 업로드
- Angular1.x로 작업시 ( Rest API 서버가 갖추어진 상태 )
보통 ngFileUpload 를 이용하였다 ---> http://uxicode.tistory.com/355
- Express.js 를 이용한다면?
관련 플러그인들은 엄청많다....
참고로 2개 정도 써봤는데 괜찮다...
1. restler - https://github.com/danwrong/restler
//routes.js
var express = require('express');
var router = express.Router();
router.post('/', controller.uploadFile );
module.exports = router;
//upload.js
var restler = require('restler');
module.exports={
uploadFile: function (req, res) {
//req.files.file에서 file은 연동되는 html name이다. <input type="file" name="file" /> 처럼~
var file=req.files.file;restler.post(api, {
// Bearer token도 정의 할 수 있다.
accessToken:(req.headers.authorization).split('Bearer ').join(''),
multipart: true,
data:{
file:restler.file(file.path, null, file.size, null, file.type)
}
}).on('complete', function(data, response) {
resultSendCode( data, res, response );
})
}}
2. multer - https://github.com/expressjs/multer
var express = require('express'),
path = require('path'),
router = express.Router(),
imgUpload = require('./controllers/imgUpload'),multer = require('multer'),
upload =multer({ dest: path.join(__dirname, 'public/upload/temp') });
module.exports = function (app) {
router.post('/images', upload.single('file'), imgUpload.create);
app.use(router);
};
//imgUpload.js
var fs=require('fs'),
path = require('path');
module.exports={
create:function(req, res, next) {
var saveImage=function() {
var possible = 'abcdefghijklmnopqrstuvwxyz0123456789',
imgUrl = '';
for( var i=0;i<6;i+=1) {
imgUrl += possible.charAt(Math.floor(Math.random() * possible.length));
}
var tempPath = req.file.path,
ext = path.extname(req.file.originalname).toLowerCase(), //path.extname(url) 파일 확장자 축출
targetPath = path.resolve('server/public/upload/'+imgUrl+ext);
if(ext==='.png' || ext==='.jpg' || ext==='.jpeg' || ext==='.gif') {
//fs(파일시스템).rename( 원본파일, 새로운파일, 콜백함수 )
fs.rename(tempPath, targetPath, function(err) {
if(err) throw err;
res.redirect('/images/'+imgUrl);
});
}else{//파일이 유효하지 않은 경우 원본파일 삭제하고 500에러 전송.
fs.unlink(tempPath, function() {
res.status(500).json({error: 'Only image files are allowed.'});
});
}
};
saveImage();
}
};
'Programming language > javascript' 카테고리의 다른 글
coffeescript 문법 (0) | 2018.03.22 |
---|---|
놓치기 쉬운 사항들 ( 기본에 충실하자 ) (0) | 2017.09.15 |
handlebars( 핸들바 템플릿 ) 기초 (0) | 2017.07.14 |
slick.js ( 슬라이드 / 캐러셀 라이브러리 ) (0) | 2017.06.22 |
nvm 설정. (2) | 2017.06.01 |
- Total
- Today
- Yesterday
- git
- icon font
- for of 구문
- IntrinsicElements
- svg모션
- Intrinsic
- git checkout -b
- JsDoc
- 아이콘 폰트 만들기
- 태그
- react
- RefreshToken
- cordova
- anime.js
- react-router-dom
- interceptors
- React.StrictMode
- 앵귤러
- 리프래시토큰
- Angular
- 코도바
- CSS
- svg icon font
- svg 폰트
- vue-router
- Vue3
- 자바스크립트
- Aptana
- 내장요소
- 반복문
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 | 31 |