获取未配置CORS的存储项

时间:2017-12-30 18:28:56

标签: firebase cors firebase-storage

我通过这种技术(通常)从我的Firebase存储桶中获取了一个项目:

const url = await firebase.storage().ref('my/ref').getDownloadURL();
const filename = 'filename.ext';

const a = document.getElementById('link');
a.href = url;
a.download = filename;
a.click();

在从文档中尝试示例之前,我是按照上述方式完成的:

storageRef.child('images/stars.jpg').getDownloadURL().then(function(url) {
  // `url` is the download URL for 'images/stars.jpg'

  // This can be downloaded directly:
  var xhr = new XMLHttpRequest();
  xhr.responseType = 'blob';
  xhr.onload = function(event) {
    var blob = xhr.response;
  };
  xhr.open('GET', url);
  xhr.send();
});

以这种方式尝试时,我遇到了CORS错误。将CORS配置添加到我的存储桶后,它按预期工作。但是,在配置CORS之前,我无法确定为什么我能够通过第一种技术成功获取它。

我通过从我的CORS配置中删除GET方法并通过gsutil再次上传配置文件再次测试了它。我仍然能够通过上述第一种技术成功获取文件。

如果可以在不配置CORS的情况下执行此操作,如何阻止其限制访问?无论如何,没有人能够找出构建链接所需的ref,因为实际的ref有多个唯一ID,几乎不可能弄明白。这主要是出于好奇心的问题。

1 个答案:

答案 0 :(得分:1)

  

在配置CORS之前,我无法确定为什么我能够通过第一种方法成功获取它。

因为当Javascript无法访问数据时,同源策略不适用。在您的第一个示例中,JS调整文档,文档访问数据。在第二个示例中,JS访问跨源数据,缺少CORS会阻止此类访问。

  

如果可以在不配置CORS的情况下执行此操作,如何阻止其限制访问?

CORS并非旨在限制访问。 (等等,什么?)CORS旨在允许访问,否则将被认为是用户不希望的东西 - 对于一个页面上的脚本可以访问来自其他来源的数据,包括可能在访问外国站点时将用户凭证的使用移交给当前页面上的脚本。 CORS允许站点B告诉浏览器它来自站点A的脚本期望,因此这种访问不应该是意外的或假定未经授权。它对不属于同一原产地政策的请求没有影响。

解决方案 - 如果我说的是显而易见的话,我道歉 - 是getDownloadUrl()不应该为对象提取可用的URL,如果该对象实际上不可访问的话。您无法信任在浏览器上运行的代码,因此无论在何处使用凭据都不应该以这种方式使用,如果该对象不是可访问的...否则您的配置错误允许访问不应该被允许。