CORS header 未设置 - 我可以请求图像 url 然后将其返回给自己吗?
CORS header not set - can I request an image url and then serve it back to myself?
我正在尝试使用从图像编译的网格填充 WebGL Earth。这些图像是 cross-domain,并托管在无法设置适当 headers 的服务器上。我可以 XMLHttpRequest 图像 url,然后通过 PHP 将它们返回给我以绕过 CORS 错误吗?
或者,更具体地说,我可以使用自己的网络服务器作为代理,在 WebGL 上下文中将 img url 返回给自己(绕过 CORS)吗?
编辑:这里真正的问题是我是否可以使用我自己的网络服务器作为代理来传递 url,或者我是否必须实际将每个图像下载到服务器然后使用它。
我在使用 API 时遇到过类似的问题。首先,我尝试在 JS 中做所有事情,可能会收到与您相同的错误消息。
我的解决方案是切换到 PHP 并在服务器端进行,因为现代浏览器会阻止您想要执行的操作。
所以是的,这是可能的。
在后台获取图片,然后提供给前台。
只需先检索图片,然后将它们作为输出发送到浏览器。您可以通过执行以下操作来同步执行此操作:
$ch = curl_init ...
...
$pic = curl_exec ... // get the picture
// and then echo it
这个我做过一次但是记错了。或者您可以异步执行,这通常是在使用 img-tags 时执行的。我不确定它是如何与 WebGL 一起工作的,但应该是相似的:
- 将图片下载到您的文件系统
- 然后向浏览器提供URL。
然后取决于图像有多大,需要多长时间,以及API是否要朝这个方向发展。
第一个评论的答案:
棘手。我没有使用 WebGL Earth 的经验,也不知道是否可以通过 Ajax(看 here) or if you use AngularJS (look here)将数据异步加载到其中。您需要尝试一下。我会特别注意加载时间。
有一个像 http://example.com/api/get_image/65446
这样的 API 调用,它下载图片,调整大小,然后将其发送到浏览器。
在这种情况下你会做的是:
- 将 'normal' 页面发送给用户
- 然后在此处查找要为其显示图片的事件
- 当事件发生时,使用我刚才提到的 API-call 并使用成功处理程序将其添加到您的页面。同样,它如何与 WebGL Earth 一起工作是另一个我无法回答的问题。
如果您想将其用于移动设备,则需要考虑图片尺寸。由于屏幕相对较小,您应该先将图片缩小。但是,要花多长时间才能拍到照片,我想这是最大的挑战。想要滚动地球仪的人希望立即看到图片,而不是 5 秒后(因为我滚动更有可能)
想想你能不能先准备下载和调整大小。如果你只想显示某些图片,比如总共10.000张,那么我会这样做。这样您就无需考虑加载时间以及何时删除哪些图片。您应该针对该主题打开另一个问题,然后先尝试 Ajax 是否可行。
我正在尝试使用从图像编译的网格填充 WebGL Earth。这些图像是 cross-domain,并托管在无法设置适当 headers 的服务器上。我可以 XMLHttpRequest 图像 url,然后通过 PHP 将它们返回给我以绕过 CORS 错误吗?
或者,更具体地说,我可以使用自己的网络服务器作为代理,在 WebGL 上下文中将 img url 返回给自己(绕过 CORS)吗?
编辑:这里真正的问题是我是否可以使用我自己的网络服务器作为代理来传递 url,或者我是否必须实际将每个图像下载到服务器然后使用它。
我在使用 API 时遇到过类似的问题。首先,我尝试在 JS 中做所有事情,可能会收到与您相同的错误消息。
我的解决方案是切换到 PHP 并在服务器端进行,因为现代浏览器会阻止您想要执行的操作。
所以是的,这是可能的。
在后台获取图片,然后提供给前台。
只需先检索图片,然后将它们作为输出发送到浏览器。您可以通过执行以下操作来同步执行此操作:
$ch = curl_init ...
...
$pic = curl_exec ... // get the picture
// and then echo it
这个我做过一次但是记错了。或者您可以异步执行,这通常是在使用 img-tags 时执行的。我不确定它是如何与 WebGL 一起工作的,但应该是相似的:
- 将图片下载到您的文件系统
- 然后向浏览器提供URL。
然后取决于图像有多大,需要多长时间,以及API是否要朝这个方向发展。
第一个评论的答案:
棘手。我没有使用 WebGL Earth 的经验,也不知道是否可以通过 Ajax(看 here) or if you use AngularJS (look here)将数据异步加载到其中。您需要尝试一下。我会特别注意加载时间。
有一个像 http://example.com/api/get_image/65446
这样的 API 调用,它下载图片,调整大小,然后将其发送到浏览器。
在这种情况下你会做的是:
- 将 'normal' 页面发送给用户
- 然后在此处查找要为其显示图片的事件
- 当事件发生时,使用我刚才提到的 API-call 并使用成功处理程序将其添加到您的页面。同样,它如何与 WebGL Earth 一起工作是另一个我无法回答的问题。
如果您想将其用于移动设备,则需要考虑图片尺寸。由于屏幕相对较小,您应该先将图片缩小。但是,要花多长时间才能拍到照片,我想这是最大的挑战。想要滚动地球仪的人希望立即看到图片,而不是 5 秒后(因为我滚动更有可能)
想想你能不能先准备下载和调整大小。如果你只想显示某些图片,比如总共10.000张,那么我会这样做。这样您就无需考虑加载时间以及何时删除哪些图片。您应该针对该主题打开另一个问题,然后先尝试 Ajax 是否可行。