如何对JavaScript的发送文件？ [英] How send file on javascript?

问题描述

var photo = 'http://cs323230.vk.me/u172317140/d_5828c26f.jpg';
var upload_url = 'http://cs9458.vk.com/upload.php?act=do_add&mid=62..';

var xmlhttp = getXmlHttp();
var params = 'photo=' + encodeURIComponent(photo);
xmlhttp.open("POST", upload_url, true);
xmlhttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');

xmlhttp.onreadystatechange = function() {
    if (xmlhttp.readyState == 4) {
        if(xmlhttp.status == 200) {
            var answer2 = xmlhttp.responseText;
            console.log(answer2);
            alert(answer2);
        }
    }
};
xmlhttp.send(params);

我需要改变照片网​​址上的文件内容

I need to change the photo URL on the contents of the file

./DirectoryImage/imagetest.jpg

和发送文件内容

./DirectoryImage/imagetest.jpg

在 UPLOAD_URL 。

但我不知道该怎么对 UPLOAD_URL 在JavaScript发送文件的内容...

But I don't know how send the contents of the file on upload_url in javascript...

这可能吗？

有谁知道怎么做的？

推荐答案

是的，你可以，但是，这并不容易。诀窍是使用的FileReader 对象。下面是一些示例code我放在一起上传的图像后，它投进了＆LT; D​​IV＆GT; 。

Yes, you can, but it's not easy. The trick is using the FileReader object. Here's some sample code I put together for uploading an image after it's dropped into a <div>.

我是pretty的肯定，你可以与任何文件做同样的，只要可以使的FileReader 对象，无论从任何用户输入。

I'm pretty sure you can do the same with any file, as long as you can make the FileReader object from whatever your user inputs.

YourNamespace.uploadImg = function(evt) {
    // Get the first file, if a stack of files has been dropped
    // (to transfer the whole stack just repeat the process)
    var file = evt.dataTransfer.files[0]; 

    // Make a FileReader object
    var reader = new FileReader();

    // Build an AJAX request to send the file once the browser has received it.
    // The FileReader will call this onload event when it's finished.
    reader.onload = function(evtLoad) {
        var req = new XMLHttpRequest();
        req.open('POST', '/foo/bar.php', true);
        req.onreadystatechange = function() {
            if (req.readyState == 4 && req.status == 200) {
                alert("success");
            }
        };

        // Encode the file stream properly, set the appropriate header, and send.
        var params = "foo=bar&data=" + encodeURIComponent(evtLoad.target.result);

        req.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
        req.send(params);
    };

    // This starts the whole process: read in the file as a data URL.
    // When it's finished it calls the onload() that was defined above.
    reader.readAsDataURL(file);
};

的MDN页面都在这整个题目非常有帮助，如的FileReader 对象API。

此外，我似乎记得浏览器的支持较差的秋后算账（IE6-7等）。

Also I seem to remember browser support is poor for the usual suspects (IE6-7, etc).

值得一提的是，这是困难的，因为Javascript的浏览器中没有设计聊到服务器，为安全起见。的Javascript通常只有客户端。文件传输和这样通常应该在PHP，Perl中，红宝石等服务器端脚本来处理。

It's worth mentioning that this is difficult because Javascript in browsers was not designed to talk to the server, for security purposes. Javascript is usually client-side only. File transfers and such should usually be handled with a server-side script in PHP, Perl, Ruby, etc.

这篇关于如何对JavaScript的发送文件？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！