첫째, 렌더링 :
이것은 당시 더 많은 사진을 위해 만든 코드입니다. 나는 당신이 배우기 위해 그것을 꺼낼 것입니다 (일부 장소는 자신의 개인 정보로 수정해야하며 일반적인 방향은 정확합니다).
전체 (정기적으로 말하면)에 관련된 세 문서가 있습니다.
1. route Entry File (I Am /routes.js는 종종 /app.js에 있습니다)
코드 사본은 다음과 같습니다.
// 맛있는 음식을 추가합니다
app.all ( '/add', users.add);
2. Routing Controller 파일 (I AM /routes/users.js here)
코드 사본은 다음과 같습니다.
// 맛있는 음식을 추가합니다
Exports.add = function (req, res) {
if (req.method == "get") {
var user = {};
if (req.session.user) {
user = req.session.user;
}
res.render ( "user/food_add", {제목 : '릴리즈 푸드-'+config.name, name : config.name, user});
} else if (req.method == "post") {
// 데이터를 얻습니다
var x = req.body.x;
var y = req.body.y;
var cat_id = req.body.cat_id;
var cat_name = req.body.cat_name;
var address = req.body.address;
var title = req.body.title;
var desc = req.body.desc;
var content = req.body.content;
var pics = '';
var price = req.body.price;
var tags = req.body.tags;
var add_time = date.parse (새 날짜 ())/1000;
var support = 0;
var uid = req.body.uid;
// 이미지 업로드 처리
//console.dir(req.files);
var file_obj = req.files.pics;
//console.log(file_obj.length);
var file_obj2 = [];
for (var i = 0; i <file_obj.length; i ++) {
if (file_obj [i] .name) {
file_obj2.push (file_obj [i]);
}
}
var length = file_obj2.length;
if (길이> 0) {
file_obj2.foreach (function (item, index) {
if (item.path) {
var tmppath = item.path;
var type = item.type;
var extension_name = "";
// 지정된 디렉토리로 이동하여 일반적으로 공개 이미지 파일 아래에 넣습니다.
// 움직일 때 경로가 이미 존재하는지 확인하십시오. 그렇지 않으면 오류 가보고됩니다.
var tmp_name = (date.parse (new date ())/1000);
tmp_name = tmp_name+''+(math.round (math.random ()*9999));
// 파일 유형을 판단합니다
스위치 (유형) {
CASE 'image/pjpeg': Extension_name = 'jpg';
부서지다;
사례 '이미지/jpeg': Extension_name = 'jpg';
부서지다;
사례 '이미지/gif': extension_name = 'gif';
부서지다;
사례 '이미지/png': Extension_name = 'png';
부서지다;
사례 '이미지/x-png': Extension_name = 'png';
부서지다;
CASE 'Image/BMP': Extension_name = 'BMP';
부서지다;
}
var tmp_name = tmp_name+'.'+Extension_name;
var targetpath = 'public/images/' + tmp_name;
console.log (tmppath);
// 업로드 된 임시 파일을 지정된 디렉토리로 이동합니다
fs.rename (tmppath, targetpath, function (err) {
if (err) {
오류를 던지십시오.
}
if (pics) {
pics += ',' +tmp_name;
}또 다른{
pics += tmp_name;
}
// 완성되었는지 판단합니다
//console.log(index);
// 임시 파일을 삭제합니다
fs.unlink (tmppath, function () {
if (err) {
오류를 던지십시오.
}또 다른{
if ((index+1) == 길이) {
Console.log (TargetPath);
// 업로드 처리가 완료되었습니다
//데이터
var data = {
x : x, // 경도
Y : Y, // 치수
cat_id : cat_id, // 카테고리 ID
cat_name : cat_name, // 카테고리 이름
주소 : 주소, // 주소
제목 : 제목, // 제목
desc : desc, // 소개
내용 : 내용, // 컨텐츠
사진 : 사진, // 그림 필드, ',', ','여러 그림 별도
가격 : 가격, // 가격
태그 : 태그, // 태그는 ','로 분리됩니다.
add_time : add_time, // support
지원 : 지원, // 기본 지원은 0입니다
UID : UID // 사용자 ID는 익명이 될 수 있습니다
};
food_predao.insert (데이터, 기능 (err, food) {
if (err) {
res.json ({err : 100, 내용 : '데이터베이스 오류'});
}또 다른{
res.json ({err : 0, content : '릴리스 성공!', data : food});
}
});
}
}
});
});
}
});
}또 다른{
// 사진이 없습니다
//데이터
var data = {
x : x, // 경도
Y : Y, // 치수
cat_id : cat_id, // 카테고리 ID
cat_name : cat_name, // 카테고리 이름
주소 : 주소, // 주소
제목 : 제목, // 제목
desc : desc, // 소개
내용 : 내용, // 컨텐츠
사진 : 사진, // 그림 필드, ',', ','여러 그림 별도
가격 : 가격, // 가격
태그 : 태그, // 태그는 ','로 분리됩니다.
add_time : add_time, // support
지원 : 지원, // 기본 지원은 0입니다
UID : UID // 사용자 ID는 익명이 될 수 있습니다
};
food_predao.insert (데이터, 기능 (err, food) {
if (err) {
res.json ({err : 100, 내용 : '데이터베이스 오류'});
}또 다른{
res.json ({err : 0, content : '릴리스 성공!', data : food});
}
});
}
}
};
3. 파일보기 (I Am /views/users/food_add.ejs는 여기)
코드 사본은 다음과 같습니다.
<스타일>
.upload_item {너비 : 50px; 높이 : 45px; 오버플로 : 숨겨진; 테두리 : 2px 점선 #BFBFBF; float : 왼쪽; 마진 오른쪽 : 10px;}
.upload_item_add {너비 : 50px; 높이 : 45px; 디스플레이 : 블록; 라인 높이 : 42px; 텍스트 정렬 : 센터; 글꼴 크기 : 30px; 커서 : 포인터;}
.upload_input {}
</스타일>
<cript>
var add = {
upload_click : function (obj) {
$ (obj) .parent (). children (). eq (1) .click ();
},
upload_change : function (obj) {
var 경로;
path = $ (obj) .val (); // c :/문서 및 설정/hud/goodtop/addfile.jpg
var aa;
aa = path.split ( '.');
//Alert(aa.length-1]); // JPG 결과
var 이름;
이름 = path.split ( '//');
var bb = name [name.length-1];
// alert (bb.substr (0, bb.indexof ( '.'))); // 추가 결과
$ (obj) .parent (). children (). eq (0) .css ( 'fontsize', '12px');
$ (obj) .parent (). css ( 'Borderstyle', 'solid');
$ (obj) .parent (). children (). eq (0) .html (bb.substr (0, bb.indexof ( '.')));
if ($ (obj) .parent (). attr ( 'index') == 1) {// 새로운 추가
var html = '<div index = "1"> <span span onclick = "add.upload_click (this)">+</span> <입력 유형 = "file"name = "pics"id = "pics"onchange = "add.upload_change (this)"/> </div>';
$ ( '#upload_box'). 부록 (html);
$ (obj) .parent (). attr ( 'index', '0');
}
}
};
</스크립트>
<form method = "post"action = "/add"encType = "multipart/form-data">
<테이블>
<tr>
<td> 경도 : </td> <td> <입력 유형 = "text"name = "x"id = "x"/> </td>
</tr>
<tr>
<td> 치수 : </td> <td> <입력 유형 = "text"name = "y"id = "y"/> </td>
</tr>
<tr>
<td> 카테고리 : </td> <td> <select name = "cat_id"> <옵션 값 = "1"> 카테고리 1 </옵션> </select> </td>
</tr>
<tr>
<td> 주소 : </td> <td> <입력 유형 = "text"name = "address"id = "address"/> </td>
</tr>
<tr>
<td> 제목 : </td> <td> <input type = "text"name = "title"id = "title"/> </td>
</tr>
<tr>
<td> 소개 : </td> <td> <입력 유형 = "text"name = "desc"id = "desc"/> </td>
</tr>
<tr>
<td> 컨텐츠 : </td> <td> <입력 유형 = "text"name = "content"id = "content"/> </td>
</tr>
<tr>
<td> 사진 : </td> <td id = "upload_box"> <div index = "0"style = "display : none;"> <> <span onclick = "add.upload_click (this)">+</span = "file"name = "pics"id = "pics"onchange = "add.upload_change (this)"/>>>>>>>>>>/> <index "> onclick = "add.upload_click (this)">+</span> <input type = "file"name = "pics"id = "pics"onchange = "add.upload_change (this)"/> </div> </td>
</tr>
<tr>
<td> 가격 : </td> <td> <입력 유형 = "text"name = "price"id = "price"/> </td>
</tr>
<tr>
<td> 태그 : </td> <td> <입력 유형 = "text"name = "tags"id = "tags"/> </td>
</tr>
<tr>
<td colspan = "2"> <입력 유형 = "제출"value = "제출" /> < /td>
</tr>
</테이블>
</form>