javascript - Amazon URL を含む pdf.js から安全でないヘッダー「Accept-Ranges」エラーを取得することを拒否しました

Question

範囲リクエスト (pdf ドキュメントのプログレッシブ読み込み) で pdf.js を使用しようとしていますが、Amazon s3 URL から pdf を読み込もうとすると、コンソールに次のエラーが表示されます。

-安全でないヘッダー「Accept-Ranges」の取得を拒否

PDFは206の部分的なコンテンツ（範囲リクエスト）を介してロードされず、200を介してロードされ、ビューアで表示されます。

これは pdf url の例です:

https://kotob.s3.amazonaws.com/book.pdf?Signature=irgVfoAZuPPIp5kpCesni2MzpLo%3D&Expires=1366576877&AWSAccessKeyId=AKIAILBHXSTPUIBTRMSA

どんな助けでも

Answer 1

このようにAmazonでCORSポリシーを設定すると役立つようです。

<?xml version="1.0" encoding="UTF-8"?>
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
    <CORSRule>
        <AllowedOrigin>*</AllowedOrigin>
        <AllowedMethod>GET</AllowedMethod>
        <AllowedMethod>PUT</AllowedMethod>
        <AllowedMethod>POST</AllowedMethod>
        <AllowedMethod>DELETE</AllowedMethod>
        <MaxAgeSeconds>3000</MaxAgeSeconds>
        <!-- this part is critical -->
        <AllowedHeader>*</AllowedHeader>
        <ExposeHeader>Accept-Ranges</ExposeHeader>
        <ExposeHeader>Content-Encoding</ExposeHeader>
        <ExposeHeader>Content-Length </ExposeHeader>
        <ExposeHeader>Content-Range</ExposeHeader>
     </CORSRule>
</CORSConfiguration>

しかし、CDN にリソースを配置した後、これは機能しません。とにかく、CDN で 200 を使用した場合でも、S3 で 206 部分ダウンロードを使用した場合でも、はるかに高速に思えます。

Answer 2

回答が遅くなりましたが、Azure BLOB では (AWS について質問されたことは知っていますが、とにかく答えを見つけようとして夢中になりました)、Accept-Ranges を許可ヘッダーとして具体的に設定する必要があり、設定するだけで*は機能しません。

これを行うには、次の C# コードを使用しました。

var url = new Uri(String.Format("https://yourblob.blob.core.windows.net"));
var credentials = new StorageCredentials("accountname", "key");
var client = new CloudBlobClient(url, credentials);

var corsRule = new CorsRule();

corsRule.ExposedHeaders.Add("Accept-Ranges");
corsRule.ExposedHeaders.Add("Content-Encoding");
corsRule.ExposedHeaders.Add("Content-Length");
corsRule.ExposedHeaders.Add("Content-Type");

corsRule.AllowedHeaders.Add("Accept-Ranges");
corsRule.AllowedHeaders.Add("Content-Encoding");
corsRule.AllowedHeaders.Add("Content-Length");
corsRule.AllowedHeaders.Add("Content-Type");

var serviceProperties = CloudBlobClient.GetServiceProperties();
serviceProperties.Cors.CorsRules.Clear();
serviceProperties.Cors.CorsRules.Add(corsRule);
client.SetServiceProperties(serviceProperties);

Answer 3

設定する必要があります

Access-Control-Allow-Headers : Accept-Ranges