如何跨域上传图片（支持所有浏览器和移动浏览器）？

Posted 2023-03-04

【中文标题】如何跨域上传图片（支持所有浏览器和移动浏览器）？

【英文标题】：How to upload images cross domain (support all browser and mobile browsers)?

【发布时间】：2017-07-07 10:35:28

【问题描述】：

我已经创建了 API，它可以帮助开发人员将图像上传到他们的虚拟文件夹。我已经完成了所有工作，但我发现跨域上传在尝试使用移动设备时似乎不起作用，我该如何解决这个问题？桌面版完美运行但移动设备似乎无法正常工作。我已经测试过它可以工作的同一个域，但如果它是跨域的，它开始无法工作，并且失败。

注意：我已经测试过CORS，但只能在台式机上工作，不能在移动设备上工作，我知道在这种情况下我无法使用jsonp，因为我正在上传图像，而jsonp无法完成.如果 Cors 不是解决方案如何创建跨浏览器、移动设备支持的上传过程？

示例：http://newtimebox.com/demos/OOS_engine_API/upload.php，它适用于桌面，但在移动设备上失败

控制台说问题是XMLHttpRequest cannot load http://api.newtimebox.com/Controller/upload.php?connect_key=‌​tmp873ap_k958a7…7b9f‌​a25591dc4a472e74aeb1‌​cd89fe590b558a73a72a‌​982b58a73a72a986158a‌​73a72a9896. Response to preflight request doesn't pass access control check: The 'Access-Control-Allow-Origin' header contains multiple values '*, http://www.newtimebox.com', but only one is allowed. Origin 'http://www.newtimebox.com' is therefore not allowed access. but I have just wrote one line which header Access-Control-Allow-Origin *

【问题讨论】：

为什么有人给我的问题-2？这不是正常的问题吗？

请提供minimal reproducible example 以及引发的所有错误

@charlietfl 我无法收到任何错误消息，因为错误只发生在移动设备上，即使我使用过jsconsole.com。但是我给出了示例页面，所以如果你在移动设备上测试它，你会可能看到它不工作，但它会在桌面上工作

周围有很多移动模拟器工具

@charlietfl 是的，我使用了其中一个，它被称为 jsconsole.com，它没有显示任何错误

【参考方案1】：

我找不到跨浏览器解决方案，但我找到了问题解决方案，出现上述错误是因为我从子域调用了该方法（它很奇怪）。如果我从 http://example.com 调用它，它可以工作，但如果我调用它来自http://www.example.com 它不工作