Question

我认识一下，关于Amazon S3 Buckets和CORS，有很多问题。但是，请允许我加我的。

所以我在Dart编写了一个应用程序，我正在对S3上托管的资源执行ajax请求。我原本想抓住资源的前100个字节，这就是为什么我想出了以下漂亮的代码：

   HttpRequest req = new HttpRequest();
   req.open('GET', item.get('upload').get('url'));
   req.setRequestHeader('Range', 'bytes=0-99');
   req.onReadyStateChange.where((e) => req.readyState == HttpRequest.DONE).first.then((e) {
      print(req.responseText);
   });
   req.send();

正如您可能从这个问题的标题中猜到的那样，这段代码没有用，我得到了

否＆＃39;访问控制 - 允许 - 来源＆＃39;标头出现在请求的资源上。起源＆＃39; http://localhost:8080＆＃39;因此不允许访问。

这对我来说似乎很奇怪，因为我设置了CORS来防止这个问题......

<?xml version="1.0" encoding="UTF-8"?>
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
    <CORSRule>
        <AllowedOrigin>*</AllowedOrigin>
        <AllowedHeader>*</AllowedHeader>
        <AllowedMethod>GET</AllowedMethod>
        <AllowedMethod>PUT</AllowedMethod>
        <AllowedMethod>POST</AllowedMethod>
    </CORSRule>
</CORSConfiguration>

出于任何原因，这显然不起作用。我在Firefox中加载了应用程序，瞧，它正在运行。似乎CORS确实有效，问题可能是Chrome或Dart。

我摆弄了一下，由于某些原因，你可以原谅我，这已经很晚了，我想出了这个：

   HttpRequest req = new HttpRequest();
   req.open('GET', item.get('upload').get('url'));
   req.setRequestHeader('Range', '0-99');
   req.onReadyStateChange.where((e) => req.readyState == HttpRequest.DONE).first.then((e) {
      print(req.responseText);
   });
   req.send();

是的，我刚刚删除了之前代码中的bytes=。猜猜看，突然我的ajax请求贯穿并打印全文。 Wooot？我可以添加已损坏的Range Header并解决此安全问题？嗯，这正是刚刚发生的事情。当然，我得到的不仅仅是前100个字节，但至少我得到了一些东西。由于我没有解释为什么损坏的Range标头使请求有效，我将Range标头替换为其他一些随机字符串，但没有一个工作。

我知道，你的思绪可能只是被炸 - 我的也是！因此，我想总结一下我们刚刚发现的东西。

使用Dart在Chrome中制作跨域ajax请求由于安全问题而无法正常工作，尽管
设置的CORS似乎至少适用于Firefox。
可以利用Chrome的安全问题＆＃39;通过添加损坏的Range请求标头，但
没有其他标题具有相同的效果。

真的吗？我的意思是，我不知道这里发生了什么。任何人都可以向我解释至少一些东西吗？ - 如果某人有想法或解决方案来解决我无法获得Chrome中前100个字节的问题，我会感谢你的余生。

提前谢谢！

Answer 1

我终于设法修复了这个错误。

不，它既不是Chrome也不是Dart错误。它有一些缓存的东西。解决方案是一个脏字符串查询hack，这很容易做到：

   HttpRequest req = new HttpRequest();
   req.open('GET', '${item.get('upload').get('url')}?t=${new Random().nextInt(99999)}');
   req.setRequestHeader('Range', '0-99');
   req.onReadyStateChange.where((e) => req.readyState == HttpRequest.DONE).first.then((e) {
      print(req.responseText);
   });
   req.send();

在查询中添加一个随机数会导致缓存，我不知道它是亚马逊还是Chrome缓存，做正确的事情。

Chrome中的跨域问题可能是B / C奇怪的Dart HttpRequest行为

1 个答案: