简体   繁体   English

Node.js,Express:如何与客户端一起处理res.send值

[英]Node.js, Express: How can I handle res.send values with the client

I'm a newbie in node.js, and I'm also using express. 我是node.js的新手,并且我也在使用express。

I build a simple web application to upload files to a server, and save them, when they are okay. 我建立了一个简单的Web应用程序,可以将文件上传到服务器上,并保存它们。 That works fine, but now I want to inform the client about the current state( is it uploaded or did it not work, because of the large size from the file). 效果很好,但现在我想通知客户端当前状态(由于文件很大,它是否已上传或不起作用)。

I know that I should use res.send() , but I want to display it on the same page( with all elements on "upload.html"), where the client uploaded the file. 我知道我应该使用res.send() ,但是我想将其显示在客户端上传文件的同一页面上(所有元素都在“ upload.html”上)。 I guess, I have to using client sided javascript to work with the sended information, but how do I communicate with server side javascript and client side javascript? 我猜想,我必须使用客户端javascript处理发送的信息,但是如何与服务器端javascript和客户端javascript通信? Or do I not need to use client sided javascript? 还是我不需要使用客户端javascript?

(I would like to combine it later with HTML, so I can design the answer from the server with CSS.) (我想稍后将其与HTML结合使用,因此我可以使用CSS从服务器设计答案。)

server.js: 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: /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> 

What you actually need is socket programming. 您真正需要的是套接字编程。 Using node js you can do that easily. 使用node js,您可以轻松做到这一点。

just see this link for more on socket and node js. 请参阅此链接以获取有关套接字和节点js的更多信息。

you can use AJAX and check the error status. 您可以使用AJAX并检查错误状态。 there 那里

... ...
 <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> 

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM