带有 JSON 的 PHP 上传返回到 jQuery（全局）变量答案

【问题标题】：PHP upload with JSON return to jQuery (global) variable带有 JSON 的 PHP 上传返回到 jQuery（全局）变量
【发布时间】：2011-02-14 03:22:28
【问题描述】：

我需要从客户端机器上获取一个 CSV 文件并从中提取数据。我无法保存这个至关重要的 CSV 文件（否则我会笑死的！）。到目前为止，我的 PHP 就像一个魅力：

上传.php

<?php
    $file = $_FILES['file'];
    if ($file['error'] === UPLOAD_ERR_OK) {
        $ext = substr($file["name"], strrpos($file["name"], '.') + 1);
        $maxSize = 3000000;

        //Check file extension, MIME-type and size limit (3 MB).
        if ($ext == "csv") {
            if ($file["type"] == "text/csv" ||
                $file["type"] == "text/comma-separated-values") {

                if ($file["size"] < $maxSize) {
                    //CSV -> JSON
                    $fileAsArray = Array();

                    if (($handle = fopen($file["tmp_name"], "r")) !== FALSE) {
                        while (($data = fgetcsv($handle, 1000, ",")) !== FALSE) {
                            $fileAsArray[] = $data;
                            }
                                fclose($handle);
                            }
                            echo json_encode($fileAsArray);
                            die(json_encode($fileAsArray));
                    }
                    else {
                        echo "File size: ".$file["size"]."bytes<br>Limit: ".$maxSize." (3MB)";
                    }
                }
                else {
                    echo "MIME-type: ".$file["type"]."<br>Required: text/csv";
                }
            }
            else {
                echo "File Extension: ".$ext."<br>Required: csv";
            }
        }
        else
            die("Cannot upload");
?>

忽略回声。就这样我知道它确实有效。但是，我一直在这个网站上使用 jQuery，无法找出正确获取表单以提交文件并同时检索 JSON 数据 (fileAsArray) 的代码。这是我在index.html 中的 HTML/jquery：

<script type="text/javascript">
    var csvData = {}; //My global variable (two-dimensional JSON array)

    $(document).ready(function(){
        $("#upload").click(function(){
            alert('test');

            $.ajax({
                type: "POST",
                url: "upload.php",
                data: "don't know what goes here",
                dataType: "json",
                success: function (data) {
                    alert(data); //Tried everything here too. :(
                }
            });
        });
    });

和 HTML：

<form method="POST" action="upload.php" enctype="multipart/form-data" class="file_upload">
    <input id="getFile" type="file" name="file">
    <input value="Extract Data" id="upload" type="button">
</form>

我也尝试了type="submit"，还有很多其他的东西，包括一个'form'标签和让jQuery处理POST......谢谢。如果有更好的方法，请告诉我:)

（我已经为此苦苦挣扎了好几天......在经历了下面概述的代码的许多再现之后，我已经将它剥离到它的基础。）

【问题讨论】：

标签： php jquery ajax json post

【解决方案1】：

如果您想通过 Ajax 发布请求上传 CSV 数据，您必须读取文件内容并将其插入到 data: "don't know what goes here" 字段中。目前，只有 HTML5 浏览器提供FileReader API 使 JavaScript 能够读取文件，对于 Internet Explorer，您必须使用基于 Flash 的解决方案。

我之前写过a jQuery plug-in，它适用于 HTML5 浏览器和 jQuery。它适用于 jQuery 1.4 - 我不确定 jQuery 1.5。

【讨论】：