使用html5文件阅读器

时间:2016-04-19 11:11:00

标签: javascript node.js html5 file fs

我正在使用纯node.js和html构建文件管理系统。 app.jsrequestHandler.js似乎可以正常处理其他内容,例如带参数的get / post请求。

我可以使用requestHandler.js对象接受parameters中的参数。例如,如果我想访问username,我可以使用parameters.username进行访问。

对于文件上传功能,我在JS中进行了以下操作。

以下代码出现问题,文件在保存图像文件时损坏。但如果我上传了txt文件,那就是正确保存了。

我对图像文件做错了什么?

$("#upload-file").on("click", function(){
                var file = document.getElementById('file'); //Files[0] = 1st file
                file = file.files[0];
                var reader = new FileReader();
                reader.readAsText(file, 'UTF-8');
                reader.onload = function(event){
                    var result = event.target.result;
                    var fileName = document.getElementById('file').files[0].name; //Should be 'picture.jpg'
                    $.post('/api/upload', { data: result, name: fileName }, function(){

                    });
                };
                //reader.onloadstart = ...
                //reader.onprogress = ... <-- Allows you to update a progress bar.
                //reader.onabort = ...
                //reader.onerror = ...
                //reader.onloadend = ...

            });

app.js

var http = require('http');
var fs = require('fs');
var path = require('path');
var qs = require('querystring');
var api = require('./requestHandler.js');

var server = http.createServer(function (req, res) {

    if(req.url != "/") {
        var requestUrl = req.url;
        if(requestUrl.indexOf("api") != -1) {

            var element = {};
            var apiClass = requestUrl.split("/");
            var apiClass = apiClass[2].split("?");

            if (req.method == 'POST') {
                var body = '';
                req.on('data', function (data) {
                    body += data;
                    if (body.length > 1e6) {
                        req.connection.destroy();
                    }
                });

                req.on('end', function () {
                    var element = qs.parse(body);
                    api.handle(apiClass[0], element, res);
                });
            } else {
                var query = req.url;
                query = query.split("?");

                if(query.length == 2) {
                    query = query[1].split("&");

                    query.forEach(function(item, index){
                        item = item.split("=");
                        element[item[0]] = item[1];
                    });
                }

                api.handle(apiClass[0], element, res);
            }

        } else {
            fs.readFile(__dirname + requestUrl, function (err, data) {
                switch(path.extname(requestUrl)) {
                    case ".css":
                        res.writeHead(200, { 'Content-Type': 'text/css' });
                        break;
                    case ".js":
                        res.writeHead(200, { 'Content-Type': 'text/javascript' });
                        break;
                    case ".woff":
                        res.writeHead(200, { 'Content-Type': 'application/font-woff' });
                        break;
                    case ".ttf":
                        res.writeHead(200, { 'Content-Type': 'application/x-font-ttf' });
                        break;
                    case ".eot":
                        res.writeHead(200, { 'Content-Type': 'application/vnd.ms-fontobject' });
                        break;
                    case ".svg":
                        res.writeHead(200, { 'Content-Type': 'application/svg+xml' });
                        break;
                }
                res.end(data, 'utf-8');
                res.end();
            });

        }
    } else {
        fs.readFile('index.html', function (err, data) {
            res.writeHead(200, {
                'Content-Type': 'text/html',
                'Content-Length': data.length
            });
            res.write(data);
            res.end();
        });
    }
});

server.listen(888);
console.log("server listening on 888");

requestHandler.js

var fs = require('fs');


module.exports = {
    handle: function (requestURL, parameters, res) {
        switch(requestURL) {
            case "upload":

                fs.writeFile("./files/" + parameters.name, parameters.data, 'binary', function(err) {
                    if(err) {
                        return console.log(err);
                    }

                    console.log("The file was saved!");
                });
                break;
        }
    }
};

0 个答案:

没有答案