php - 使用 XMLHttpRequest 模拟类型 ="file"INPUT

标签 php javascript post fiddler

我正在测试我在网络上找到的这段代码。我还尝试了在 this 中找到的代码答案,但似乎没有什么能按照我想要的方式工作。这是我的 JavaScript:

function fileUpload(url, fileData, fileName) 
{
   var fileSize = fileData.length,
     boundary = "---------------------------7da24f2e50046",
     xhr = new XMLHttpRequest();

   xhr.open("POST", url, true);
          // simulate a file MIME POST request.
   xhr.setRequestHeader("Content-Type", "multipart/form-data, boundary="+boundary);
   xhr.setRequestHeader("Content-Length", fileSize);

   var body = "--" + boundary + "\r\n";
   body += "Content-Disposition: form-data; name='file'; filename='" + fileName + "'\r\n";
   body += "Content-Type: application/octet-stream\r\n\r\n";
   body += fileData + "\r\n";
   body += "--" + boundary + "--";
   alert(body);
    xhr.onreadystatechange = function ()
    {
        if (xhr.readyState == 4 && xhr.status == 200)
        {
            alert(xhr.responseText);
        }
    }

   xhr.send(body);
   return true;
}

function send()
{
    fileUpload("receive.php", "abcdefg", "foo.txt");
}

这是我的“receive.php”文件:

<html>
<head>
</head>
<body>
<?php
    foreach ($_POST as $var => $value) echo "$var = $value<br>n"; 
?>
</body>
</html>

我收到了“receive.php”HTML,但没有任何内容被 echo 编辑。但如果我实际上从 HTML 表单发送文件,它会回显文件名。

我还尝试使用 Fiddler2 拦截一些真实的文件上传,以查看 POST 消息是什么,但我似乎无法在消息中的任何位置找到文件内容。我认为该文件的内容可能以某种方式进行了编码,因此我尝试发送一个相当大的文件(大约 2MB),看看是否可以在发送的消息中的任何位置找到一些大数据 block ,但我没有。我只看到标题和文件名。

我错过了什么吗?

编辑我真的觉得我错过了一些明显的东西。下面是我上传真实文件时Fiddler2的截图:

fiddler screenshot

内容长度是底部字符串的大小,不包括文件内容,只包括文件名。我正在使用的函数以及执行我想要执行的操作的每个 javascript 代码都将内容长度设置为一个字符串,其中包括文件的内容、边界和其他信息,如您在上面的代码中看到的那样。所以我的功能是创建一条 POST 消息,该消息的结构与 Fiddler 向我显示的 POST 消息不同。

文件内容到底在哪里。另一个奇怪的事情是,当我从 IE 发送 2MB 大小的文件时,页面几乎立即导航到接收文件的页面,就好像没有真正发送任何内容一样。我很困惑。

编辑2我搞砸了。我用来测试上传的表格有问题。我正在使用另一种形式,现在我可以在 Fiddler 中看到文件内容。我想可能是因为我错过了“enctype='multipart/form-data'”所以现在我可以明白为什么我的javascript不工作了。当我找到解决方案时,我会通知您。

最佳答案

Javascript 无法读取硬盘上的文件内容。根据您的示例,无法填充 fileData 变量。

关于php - 使用 XMLHttpRequest 模拟类型 ="file"INPUT,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6034580/

相关文章:

javascript - 根据环境配置基本 URL

java - 基于决策的结果的 REST 资源建模

javascript - https post 在 javascript 中类似于带有 header 和参数的curl -d 和 "request"模块nodejs npm

php - php 中的相对 URL/路径

php - 用 MySQL 制作购物车表的更好方法?

javascript - AudioWorklet - 将输出设置为 Float32Array 以流式传输实时音频?

javascript - 如何使 URL 参数匹配可选

c# - 我可以将基于接口(interface)的对象传递给 MVC 4 WebApi POST 吗?

javascript - 事后值(value)变动

php - 拉拉维尔 5.3 : Undefined property: Illuminate\Database\Eloquent\Collection Error