背景:作为学习NodeJS的一部分,我正在创建一个网络应用,允许用户在网站上传图片。用户选择图片,单击提交按钮后,文件将使用强大的模块通过os.tmpDir
存储在本地目录中。文件名也保存在mongoLabs上。我们的想法是,最终所有图片都将存储在Amazon S3存储桶中,而mongoose将保存上传的每张图片的名称,以及与图片相关联的upvotes / downvotes。
问题:当我点击提交按钮时,控制台会发出以下消息:
fs.js:60
throw err; // Forgot a callback but don't know where? Use NODE_DEBUG=fs
^
Error: ENOENT: no such file or directory, rename 'tempfile' -> 'newfilefunction () {
gm(newfile).resize(300).write(newfile, function() {
fs.readfile(newfile, function(err, buf) {
var req = knoxClient.put(filename, {
'Content-Length': buf.length,
'Content-Type': 'image/jpeg'
})
req.on('response', function(res) {
if (res.statusCode == 200) {
var newImage = new singleImageModel({
filename: filename,
votes: 0
}).save();
Socket.emit('status', {'message': 'saved!!', 'delay': 3000});
socket.emit('doUpdate', {});
//recieve these events in index.html
fs.unlink(newfile, function() {
console.log('local file deleted');
})
}
})
req.end(buf);
})
});
}'
at Error (native)
user-MacBook-Pro:48-project user$
当我在mongolab上查看我的mongoose数据库时,没有输入。我知道文件没有被上传,但我不知道我哪里出错了。我在下面提供了完整的代码:
app.js :
var express = require('express');
var path = require('path');
var app = express();
var config = require('./config/config.js');
var knox = require('knox');
var fs = require('fs');
var os = require('os');
var formidable = require('formidable');
var gm = require('gm');
var mongoose = require('mongoose').connect(config.dbURL);
app.set('views', path.join(__dirname, 'views'));
app.engine('html', require('hogan-express'));
app.set('view engine', 'html');
app.use(express.static(path.join(__dirname, 'public')));
app.set('port', process.env.PORT || 3000);
app.set('host', config.host);
var knoxClient = knox.createClient({
key: config.S3AccessKey,
secret: config.S3Secret,
bucket: config.S3Bucket
})
var server = require('http').createServer(app);
var io = require('socket.io')(server);
require('./routes/routes.js')(express, app, formidable, fs, os, gm, knoxClient, mongoose, io);
server.listen(app.get('port'), function() {
console.log('FromMyLens running on port: ' + app.get('port'));
})
routes.js:
module.exports = function(express, app, formidable, fs, os, gm, knoxClient, mongoose, io) {
var Socket;
io.on('connection', function(socket) {
Socket = socket;
console.log("got the socket in routes.js");
})
var singleImage = new mongoose.Schema({
filename: String,
votes: Number
})
var singleImageModel = mongoose.model('singleImage', singleImage);
var router = express.Router();
router.get('/', function(req,res,next) {
res.render('index', {host: app.get('host')});
})
router.post('/upload', function(req,res,next) {
function generateFileName(filename) {
var ext_regex = /(?:\.([^.]+))?$/;
var ext = ext_regex.exec(filename)[1];
var date = new Date().getTime();
var charbank = 'abcdefghijklmnopqrstuvwxyz';
var fString = '';
for (var i = 0; i < 15; i++) {
fString+= charbank[Math.floor(Math.random() * 26)];
}
fString+=date + '.' + ext;
return fString;
}
var tempfile;
var newfile;
var filename;
var newForm = new formidable.IncomingForm();
newForm.keepExtensions = true;
newForm.parse(req, function(err, fields, files) {
tempfile = files.upload.path;
filename = generateFileName(files.upload.name);
newfile = os.tmpDir() + '/' + filename;
res.writeHead(200, {'Content-type':'text/plain'});
res.end();
})
newForm.on('end', function() {
fs.rename('tempfile', 'newfile' + function() {
gm(newfile).resize(300).write(newfile, function() {
fs.readfile(newfile, function(err, buf) {
var req = knoxClient.put(filename, {
'Content-Length': buf.length,
'Content-Type': 'image/JPG'
})
req.on('response', function(res) {
if (res.statusCode == 200) {
var newImage = new singleImageModel({
filename: filename,
votes: 0
}).save();
Socket.emit('status', {'message': 'saved!!', 'delay': 3000});
socket.emit('doUpdate', {});
fs.unlink(newfile, function() {
console.log('local file deleted');
})
}
})
req.end(buf);
})
});
})
})
})
app.use('/', router);
}
的index.html:
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>FromMyLens</title>
<link rel="stylesheet" href="../css/index.css">
<script src="//code.jquery.com/jquery-1.11.0.min.js"> </script>
<script src="../js/fml_utils.js"></script>
<!-- add the socket.io script -->
<script src="/socket.io/socket.io.js"></script>
<script>
$(function() {
var host = '{{host}}';
$(document).on('click', '#submitPic', function() {
uploadNow();
})
var socket = io(host);
socket.on('status', function(data) {
showStatus(data.message, data.delay);
})
socket.on('doupdate', function() {
renderlist();
})
function uploadNow() {
$('.progress').fadeIn(100);
var uploadURL = host + '/upload';
var uploadFile = $('#uploadPic');
if (uploadFile.val() != '') {
var form = new FormData();
form.append("upload", uploadFile.files[0])
ajax({
method:'post',
url:uploadURL,
success:function() {
$('.progress').fadeOut(200);
uploadFile.val('');
},
progress: function(e) {
if(e.lengthComputable) {
var perc = Math.round((e.loaded * 100) / e.total);
$('.progress').css('width', (perc + '%'));
}
},
payload:form
})
}
}
})
</script>
</head>
<body>
<div class ="container">
<div class="topdeck">
<div class="logo">
<h1>FromMyLens</h1>
</div>
<div class="controls">
<input type="file" name="uploadPic" id="uploadPic">
<button id="submitPic"> submit</button>
<div class="progressBarDiv">
<div class="progress"></div>
</div>
<h5 class="status"> status</h5>
</div>
</div>
<div class="gallery">
<ul>
<!--repeat for all images -->
<li>
<div class ="overlay">
<div class="voteControl">
<a href="#" class"upvote">
<img src="../images/likeBtn.png" alt="click here to vote up!">
<h4>100</h4>
</a>
</div>
</div>
<div class="imageHolder">
<img src="../images/test.JPG " id="#sampleImage">
</div>
</li>
<!--repeat this -->
</ul>
</div>
</div>
</body>
</html>
我真的很感激这方面的任何帮助(: