如何使用 jsonp 将图像发送到服务器？答案

【问题标题】：How can I send an image using jsonp to a server?如何使用 jsonp 将图像发送到服务器？
【发布时间】：2017-04-12 19:22:59
【问题描述】：

我正在开发应用程序并使用 Javascript 的方法 'jsonp' 向 php 和 MYSQL 服务器发送和获取数据，因为该应用程序不在我保存数据的同一台服务器上。

我可以使用与jsonp相同的方法将图像发送到该服务器吗？喜欢编码还是使用二进制什么的？

【问题讨论】：

你应该使用 CORS。

标签： javascript php ajax jsonp

【解决方案1】：

您可以对图像进行 base64 编码并将其作为字符串发送。你会在客户端做一些事情：

var the_file = new Blob([window.atob(base_64_string)], { type: 'image/png', encoding: 'utf-8' });
var fr = new FileReader();
fr.onload = function (oFREvent) {
    var v = oFREvent.target.result.split(',')[1];
    v = atob(v);
    var good_b64 = btoa(decodeURIComponent(escape(v)));
    img.src = "data:image/png;base64," + good_b64;
    img.onload = function () {
        //do stuff here
    };
};
fr.readAsDataURL(the_file);

正如@SLaks 在他的评论中暗示的那样，考虑为您的端点使用CORS 标头而不是jsonp，但不是必需的。

不确定您的用例是什么，但为什么不直接使用图片链接？

【讨论】：

谢谢，这是我想要的答案……但我发现如果我上传多个文件会很糟糕，非常感谢

【解决方案2】：

您不能使用 jsonp 流式传输图像。你有两个选择使用iframe trick：

或者你可以使用 websockets

如果您在 json 字符串中编码您的图像 base 64，那么您将被限制为文件大小。

【讨论】：