我是node.js的新手,我也使用快递。
我构建了一个简单的Web应用程序来将文件上传到服务器,并在它们正常时保存它们。这工作正常,但现在我想通知客户当前状态(是上传还是不起作用,因为文件的大小)。
我知道我应该使用res.send()
,但我想将它显示在同一页面上(所有元素都在“upload.html”上),客户端上传了该文件。我想,我必须使用客户端的javascript来处理发送的信息,但我如何与服务器端的JavaScript和客户端javascript进行通信?或者我不需要使用客户端javascript?
(我想稍后将其与HTML结合使用,因此我可以使用CSS从服务器设计答案。)
server.js:
var express = require('express'),
fileUpload = require('express-fileupload'),
fs = require('fs'),
obSizeOf = require('object-sizeof'),
app = express();
app.use(express.static("public"));
app.use(fileUpload());
app.get("/upload.html", function(req, res){
res.sendfile(__dirname + "/" +"upload.html");
})
app.post('/upload.html', function(req, res) {
if(obSizeOf(req.files.sampleFile) > 10000000)
{
res.send("The size of the not-uploaded file is to large! Please use a file with a maximal size of 10MB");
return;
}
else
{
var sampleFile;
if (req.files.sampleFile.name == "") {
res.send('No files were uploaded.');
return;
}
else
{
sampleFile = req.files.sampleFile;
var typ = sampleFile.mimetype.split("/");
console.log(typ[0]);
if(fs.existsSync("public/upload/image/"+typ[0]+"/"+sampleFile.name))
{
res.send("A File with the same name already exists! Please rename it!");
return;
}
else
{
sampleFile.mv('public/upload/'+typ[0]+'/'+sampleFile.name , function(err) {
if (err){
res.send('File NOT UPLOADED!');
}
else { console.log("Mieeep!"); res.send(typ[0].charAt(0).toUpperCase()+typ[0].slice(1) +' data uploaded!');
}
});
}
}
}
});
app.listen("8000");
/upload.html:
<html>
<body>
<form ref='uploadForm'
id='uploadForm'
action='/upload.html'
method='post'
encType="multipart/form-data">
Upload File
</br>
<input type="file" name="sampleFile" />
</br>
<input type='submit' value='Upload!' />
</br>
<p id="serverInformation"></p> <!--Placeholder for information from the server-->
Only images
</form>
</body>
</html>
答案 0 :(得分:0)
实际需要的是套接字编程。使用节点js可以轻松完成。
请参阅this link了解有关套接字和节点js的更多信息。
答案 1 :(得分:0)
您可以使用AJAX并检查错误状态。有
...<script>
$(document).ready(function() {
$("#uploadForm").submit(function() {
$.ajax({
type: "POST",
url: "/upload.html",
data: $(this).serialize(),
complete: function(xhr, statusText){
alert(xhr.status+" : "+ statusText);
}
})
})
})
</script>