Javascript:上传文件……没有文件

iswrvxsc  于 2022-09-26  发布在  Java
关注(0)|答案(7)|浏览(210)

我试图在没有实际使用用户输入的文件的情况下伪造文件上传。文件的内容将从字符串中动态生成。
这可能吗?以前有人这样做过吗?是否有可用的示例/理论?
为了澄清,我知道如何使用AJAX技术使用隐藏的iframe和friends上传文件——问题是上传的文件不在表单中。
我使用的是ExtJS,但jQuery也是可行的,因为ExtJS可以插入其中(extjquerybase)。

qqrboqgw

qqrboqgw1#

如果不需要支持较旧的浏览器,可以使用FormData对象,它是文件API的一部分:

const formData = new FormData();
const blob = new Blob(['Lorem ipsum'], { type: 'plain/text' });
formData.append('file', blob, 'readme.txt');

const request = new XMLHttpRequest();
request.open('POST', 'http://example.org/upload');
request.send(formData);

所有当前浏览器都支持文件API(IE10+)

mnowg1ta

mnowg1ta2#

为什么不在POST中使用XMLHttpRequest()

function beginQuoteFileUnquoteUpload(data)
{
    var xhr = new XMLHttpRequest();
    xhr.open("POST", "http://www.mysite.com/myuploadhandler.php", true);
    xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
    xhr.onreadystatechange = function ()
    {
        if (xhr.readyState == 4 && xhr.status == 200)
            alert("File uploaded!");
    }
    xhr.send("filedata="+encodeURIComponent(data));
}

服务器上的处理程序脚本只是将文件数据写入文件。

编辑

文件上传仍然是一个具有不同内容类型的http帖子。您可以使用此内容类型并用边界分隔内容:

function beginQuoteFileUnquoteUpload(data)
{
    // Define a boundary, I stole this from IE but you can use any string AFAIK
    var boundary = "---------------------------7da24f2e50046";
    var xhr = new XMLHttpRequest();
    var body = '--' + boundary + '\r\n'
             // Parameter name is "file" and local filename is "temp.txt"
             + 'Content-Disposition: form-data; name="file";'
             + 'filename="temp.txt"\r\n'
             // Add the file's mime-type
             + 'Content-type: plain/text\r\n\r\n'
             + data + '\r\n'
             + boundary + '--';

    xhr.open("POST", "http://www.mysite.com/myuploadhandler.php", true);
    xhr.setRequestHeader(
        "Content-type", "multipart/form-data; boundary="+boundary

    );
    xhr.onreadystatechange = function ()
    {
        if (xhr.readyState == 4 && xhr.status == 200)
            alert("File uploaded!");
    }
    xhr.send(body);
}

如果要发送其他数据,只需用边界分隔每个部分,并描述每个部分的内容部署和内容类型标头。每个标题由换行符分隔,正文由附加换行符与标题分隔。当然,以这种方式上传二进制数据会稍微困难一些:-)
进一步编辑:忘了提及,请确保您发送的文本“文件”中没有任何边界字符串,否则将被视为边界。

rxztt3cl

rxztt3cl3#

只需共享最终结果,这是可行的,并且可以在不硬编码的情况下添加/删除参数。

var boundary = '-----------------------------' +
            Math.floor(Math.random() * Math.pow(10, 8));

    /* Parameters go here */
var params = {
    file: {
        type: 'text/plain',
        filename: Path.utils.basename(currentTab.id),
        content: GET_CONTENT() /* File content goes here */
    },
    action: 'upload',
    overwrite: 'true',
    destination: '/'
};

var content = [];
for(var i in params) {
    content.push('--' + boundary);

    var mimeHeader = 'Content-Disposition: form-data; name="'+i+'"; ';
    if(params[i].filename)
        mimeHeader += 'filename="'+ params[i].filename +'";';
    content.push(mimeHeader);

    if(params[i].type)
        content.push('Content-Type: ' + params[i].type);

    content.push('');
    content.push(params[i].content || params[i]);
};

    /* Use your favorite toolkit here */
    /* it should still work if you can control headers and POST raw data */
Ext.Ajax.request({
    method: 'POST',
    url: 'www.example.com/upload.php',
    jsonData: content.join('\r\n'),
    headers: {
        'Content-Type': 'multipart/form-data; boundary=' + boundary,
        'Content-Length': content.length
    }
});

这一功能已在所有现代浏览器上测试过,包括但不限于:

  • IE6标准+
  • 家具系数1.5+
  • 歌剧9+
  • 铬1.0+
  • Safari 3.0版+
vuv7lop3

vuv7lop34#

文件上传只是一个POST请求,其文件内容经过适当编码,并带有一个特殊的multipart/formdata头。您需要使用<input type=file />,因为您的浏览器安全性禁止您直接访问用户磁盘。
由于您不需要读取用户磁盘,,您可以使用Javascript伪造它。它将只是一个XMLHttpRequest。要伪造“真实”上传请求,您可以安装Fiddler并检查传出请求。
您需要正确编码该文件,因此此链接非常有用:RFC 2388: Returning Values from Forms: multipart/form-data

cnjp1d6j

cnjp1d6j5#

使用jQuery模拟“假”文件上传的简单方法:

var fd = new FormData();
var file = new Blob(['file contents'], {type: 'plain/text'});

fd.append('formFieldName', file, 'fileName.txt');

$.ajax({
  url: 'http://example.com/yourAddress',
  method: 'post',
  data: fd,
  processData: false,        //this...
  contentType: false         //and this is for formData type
});
lbsnaicq

lbsnaicq6#

我刚刚用Firefox TamperData插件捕获了这个POST_DATA字符串。我提交了一个表单,其中一个type="file"字段名为“myfile”,一个提交按钮名为“btn-submit”,值为“Upload”。上载文件的内容包括

Line One
Line Two
Line Three

下面是POST_DATA字符串:

-----------------------------192642264827446\r\n
Content-Disposition: form-data;    \n
name="myfile"; filename="local-file-name.txt"\r\n
Content-Type: text/plain\r\n
\r\n
Line \n
One\r\n
Line Two\r\n
Line Three\r\n
\r\n
-----------------------------192642264827446\n
\r\n
Content-Disposition: form-data; name="btn-submit"\r\n
\r\n
Upload\n
\r\n
-----------------------------192642264827446--\r\n

我不知道这个数字是什么意思(192642264827446),但这应该不难找到。

kq4fsx7k

kq4fsx7k7#

https://stackoverflow.com/a/2198524/2914587对我有用,在有效载荷中的最后一个e1d1e之前添加了一个额外的'--'

var body = '--' + boundary + '\r\n'
         // Parameter name is "file" and local filename is "temp.txt"
         + 'Content-Disposition: form-data; name="file";'
         + 'filename="temp.txt"\r\n'
         // Add the file's mime-type
         + 'Content-type: plain/text\r\n\r\n'
         + data + '\r\n'
         + '--' + boundary + '--';

相关问题