使用Javascript将我的服务器上的远程文件上传到第三方服务器

时间:2011-09-07 20:47:53

标签: javascript file-upload

我正在使用PHP在我的服务器上创建一个图像文件。现在我需要通过POST将其上传到第三方的服务器。最简单的方法是使用服务器端cURL脚本来完成,但我必须通过我的客户端来完成,因为它需要在客户端和第三方服务器之间的活动会话的上下文中上传。问题是如何才能实现这一最简单的目标?

  1. 是否可以使用一个HTML表单或AJAX调用,并通过提供URL来上传图像?问题是第三方后端不接受URL,需要将其表示为通过Web表单上传...

  2. 如果那是不可能的,我打算使用AJAX调用来下载图像并将内容保存到变量中。然后创建一个上传图像内容的表单,就像在表单中选择了本地文件一样。我该怎么做?

  3. 当我通过网络表单上传文件并查看正在发送的HTTP标头时,我看到如下内容:

    ------WebKitFormBoundary3ygta7rqeBm1krBO
    Content-Disposition: form-data; name="MAX_FILE_SIZE"
    
    10000000
    ------WebKitFormBoundary3ygta7rqeBm1krBO
    Content-Disposition: form-data; name="uploadedfile"; filename="test.jpg"
    Content-Type: image/jpeg
    
    
    ------WebKitFormBoundary3ygta7rqeBm1krBO--
    

    我应该创建一个像这种格式的字符串,然后通过AJAX调用将其作为数据提交吗?我在哪里放置实际的二进制图像数据?我想Chrome开发者工具会抑制这些数据...

    感谢您的任何指示。

1 个答案:

答案 0 :(得分:1)

我认为最简单的似乎是你所说的,通过你的服务器上传到第三方。有没有办法通过PHP脚本从用户的会话中获取任何内容?

否则,您可以尝试在服务器生成后以某种编码格式(如base64)将图像发送回客户端(可能通过AJAX),然后构建自定义XHR以将文件发送给第三方。这是一个样本:

var boundary = this.generateBoundary();
var xhr = new XMLHttpRequest;

xhr.open("POST", this.form.action, true);
xhr.onreadystatechange = function() {
    if (xhr.readyState === 4) {
        alert(xhr.responseText);
    }
};
var contentType = "multipart/form-data; boundary=" + boundary;
xhr.setRequestHeader("Content-Type", contentType);

for (var header in this.headers) {
    xhr.setRequestHeader(header, headers[header]);
}

// here's our data variable that we talked about earlier
var data = this.buildMessage(this.elements, boundary);

// finally send the request as binary data
xhr.sendAsBinary(data);

在此处查看更多信息(在“XMLHttpRequest对象”部分下方):
http://igstan.ro/posts/2009-01-11-ajax-file-upload-with-pure-javascript.html