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

【问题标题】：using Javascript to upload a remote file on my server to a 3rd party server使用 Javascript 将我服务器上的远程文件上传到第 3 方服务器
【发布时间】：2011-09-07 20:47:52
【问题描述】：

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

是否可以使用 HTML 表单或 AJAX 调用并通过提供 URL 来上传图像？问题是第 3 方后端不接受 URL，需要将其表示为通过网络表单上传...
如果这不可能，我正在考虑使用 AJAX 调用来下载图像并将内容保存到变量中。然后创建一个上传图片内容的表单，就像在表单中选择了本地文件一样。我应该如何做到这一点？

当我通过 Web 表单上传文件并查看发送的 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 开发者工具会抑制这些数据......

感谢任何指点。

【问题讨论】：

标签： javascript file-upload

【解决方案1】：

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

否则，您可以尝试在服务器生成图像后以某种编码格式（例如 base64）将图像发送回客户端（可能通过 AJAX），然后构建自定义 XHR 以将文件发送给第 3 方。 . 这是一个示例：

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

【讨论】：