如何将上传的 CSV 文件传递到我的函数中？答案

【问题标题】：How do I pass an uploaded CSV file, into my function?如何将上传的 CSV 文件传递到我的函数中？
【发布时间】：2016-02-16 00:39:09
【问题描述】：

首先，如果这不是正确的提问方式，请原谅我，但这是我的第一篇文章。

我正在从事一个大学项目，并且是 JavaScript 的新手（以及随后的 jQuery 和 NodeJS）。我正在尝试创建一个系统，该系统将获取 CSV 文件，对其进行处理并将结果加载到数据库中，以供系统的其余部分使用。

我已经做到了，以便我可以将文件上传到目录并具有将 CSV 文件处理为 JSON 对象的功能（我们才刚刚开始涵盖数据库，因此我必须将其修改为存储在数据库中），但我目前面临的问题是这个......

如何将上传的文件传递/读取到函数中进行处理？

我四处搜索并发现了类似的问题，但这些问题要么通常使用 PHP，要么涵盖了我的问题的不同方面，而没有真正触及我的问题。

如果这是我缺少的非常基本的东西，我很抱歉，但是我正在为此烦恼，并且在我完成第一部分之前无法进行其余任务 - 上传，处理和存储 CSV 文件。

我会接受任何与问题直接相关的建议或您认为我可能面临的经验提示，感谢您抽出宝贵时间。

上传

var express = require("express");
var multer = require("multer");
var fs = require("fs");
var path = require("path");
var app = express();
var upload = multer({ dest: './uploads/'});

app.use(express.static('public'));
app.use(upload);

app.post('/api/csvUpload',function(req,res) {
    upload(req,res,function(err) {
//    console.log(req.body);
//    console.log(req.files);
        if(err) {
            return res.end("Error uploading file");
        }
        else{   
            res.send("File is uploaded");
        }
    });
});

var server = app.listen(8081, function () {
    var host = server.address().address;
    var port = server.address().port;
    console.log("working on port 8081!");
});

<!DOCTYPE html>
<html>
    <head>
        <title>Home Page</title>
    </head>
    
    <body>
        
        <form id="uploadForm" action="/api/csvUpload" method="post" enctype="multipart/form-data">
            <input type="file" name="csvFile">
            <input type="submit" value="Upload File" />
        </form>
        
    </body>
</html>

CSV 转 JSON

//This will process and convert a CSV file in to a JSON objec 
function csvJson(csv) {
    var lines = csv.split("\n");
    var result = [];
    var headers = lines[0].split(",");
    
    for(var i = 1; i < lines.length; i++) {
        var obj = {};
        var currentLine = lines[i].split(",");
        
        for(var j = 0; j < headers.length; j++) {
            obj[headers[j]] = currentLine[j];
        }
        result.push(obj);
    }
    return JSON.stringify(result);
};

//Below is for testing purposes
var testCSV = "userName, firstName, lastName, studentID, course\n" +
    "username1,first1,last1,123456,Software Engineering\n" +
    "username2,first2,last2,234567,Software Engineering\n" +
    "username3,first3,last3,345678,Software Engineering\n" +
    "username4,first4,last4,456789,Software Engineering";

var processedCSV = csvJson(testCSV);
console.log(processedCSV);

【问题讨论】：

嗨，理查德，欢迎来到 Stackoverflow。考虑到这是您的第一个问题，您已经很好地解释了您的问题。如果您可以发布到目前为止所做的代码，其他人会更容易弄清楚
所以上传部分正在工作，并且您想要一个函数来读取文件并将其内容保存到数据库中？大概，正如你提到的Javascript，这个函数应该在网页中运行？问题是，Javascript 无法与数据库通信。它可以向 Web 服务器发送请求和数据，并读取 Web 服务器的响应，但是要对数据库执行任何操作，您需要使用更强大的语言（如 PHP/Perl/Ruby 等）的服务器端脚本。然后您的 Javascript 将发送该脚本的数据。
感谢您的反馈，我已按要求添加代码。

标签： javascript jquery node.js csv

【解决方案1】：

因为我并不完全清楚文件是如何上传的，所以我将从能够加载 (CSV) 文件的函数开始。

您可以使用 XMLHttpRequest 来加载文件或 url，更多信息可以在 W3Schools 找到。这是一个非常强大的对象，我真的建议您阅读更多内容。

 /**
 * Loads file using XMLHttpRequest
 * @param {String} path
 * @param {Function} success
 * @param {Function} error
 */
function loadFile(path, success, error) {
    var xhr = new XMLHttpRequest();
    xhr.onreadystatechange = function () {
        if (xhr.readyState === XMLHttpRequest.DONE) {
            if (xhr.status === 200) {
                if (success)
                    success(csvToJSON(xhr.responseText));
            } else {
                if (error)
                    error(xhr);
            }
        }
    };
    xhr.open("GET", path, true);
    xhr.send();
}

要使用此功能，只需执行以下代码：

loadFile('Link_to_CSV_file.csv', function (data) {
        myFunction(data);
    }, function (xhr) {
        console.error(xhr);
    });

一旦成功加载数据，myFunction() 将使用来自loadFile() 的数据执行。这可以在函数中使用。

最后，在函数中加载 CSV 数据：

function myFunction(data){
    console.log(data);
}

PS：如果您想在 javascript 函数中处理 CSV 文件，我建议您将其转换为 JSON，如果您使用的是 Node.js，请查看 How to convert CSV to JSON in Node.js。

【讨论】：

非常感谢您的详细回答，如果有帮助的话，我已经编辑了我的问题以包含我目前所拥有的内容。我想我理解你的代码，但我在 XMLHttpRequest 上得到了 ReferenceError？