web-dev-qa-db-ja.com

ポータルのAzure BLOBストレージでCORSを設定するにはどうすればよいですか？

Windows Azureにblobストレージがあります。

http://mytest.blob.core.windows.net/forms

CloudBerryを使用してストレージにいくつかのファイルをアップロードしました。また、ブラウザでファイルを正常にダウンロードできます。これらのファイルは単純なテキストファイルですが、ファイル拡張子が異なります。例えば、

http://mytest.blob.core.windows.net/forms/f001.etx

Jquery（$ .get）を使用してファイルをダウンロードしたいのですが、CORSが原因で失敗しました。

ポータルのAzure BLOBストレージでCORSを構成するにはどうすればよいですか？

また、クライアント側でもCORSに何かする必要がありますか？

jqueryajaxazurecors
17
Zach

UPDATE：この回答の時点では、Azureポータルにこの機能はありませんでした。 ここで概説 のようになりました。以下は、UIが追加される前にこれを行う方法の概要です。

ポータルのAzure BLOBストレージでCORSを構成するにはどうすればよいですか？

必要に応じて、ブロブストレージのCORSルールを常にプログラムで設定できます。 .Net Storage Clientライブラリを使用している場合は、ストレージチームからのこのブログ投稿を確認してください： http://blogs.msdn.com/b/windowsazurestorage/archive/2014/02/03/windows-Azure- storage-introducing-cors.aspx 。そのブログ投稿からCORS設定を設定するためのコード：

private static void InitializeCors()
{
     // CORS should be enabled once at service startup
     // Given a BlobClient, download the current Service Properties 
     ServiceProperties blobServiceProperties = BlobClient.GetServiceProperties();
     ServiceProperties tableServiceProperties = TableClient.GetServiceProperties();

     // Enable and Configure CORS
     ConfigureCors(blobServiceProperties);
     ConfigureCors(tableServiceProperties);

     // Commit the CORS changes into the Service Properties
     BlobClient.SetServiceProperties(blobServiceProperties);
     TableClient.SetServiceProperties(tableServiceProperties);
}

private static void ConfigureCors(ServiceProperties serviceProperties)
{
    serviceProperties.Cors = new CorsProperties();
    serviceProperties.Cors.CorsRules.Add(new CorsRule()
    {
        AllowedHeaders = new List<string>() { "*" },
        AllowedMethods = CorsHttpMethods.Put | CorsHttpMethods.Get | CorsHttpMethods.Head | CorsHttpMethods.Post,
        AllowedOrigins = new List<string>() { "*" },
        ExposedHeaders = new List<string>() { "*" },
        MaxAgeInSeconds = 1800 // 30 minutes
     });
}

同じことを行うツールを探している場合、いくつかのストレージエクスプローラーがCORSの構成をサポートしています-Azure Storage Explorer、Cerebrata Azure Management Studio、Cloud Portam（開示-私はCloud Portamユーティリティを構築しています）。

CORSが適切に構成されたら、Roryの回答に記載されているコードを使用して、BLOBストレージからファイルをダウンロードできます。 Roryが述べたように、クライアント側で特別なことをする必要はありません。

19
Gaurav Mantri

幸いなことに、これはポータルで直接行うことができます。アカウントを選択するだけで、メニューが表示され、さまざまなオプションが表示されます。CORSは、Blob、Fileなどのサービスごとに1つになります。

enter image description hereenter image description here

26
Ilya Chernomordik

Azure Power Shellを使用してCORSルールを簡単に設定/編集/表示できるようになりました。このリンクの詳細については、以下をご覧ください。

https://Azure.Microsoft.com/en-us/documentation/articles/storage-powershell-guide-full/

以下のPower Shellコマンドを要約すると、BLOBのCORSが設定されます。

  1. _Add-AzureAccount_を実行してアカウントにサインインします
  2. Azureでサブスクリプションを確認する_Get-AzureSubscription | Format-Table SubscriptionName, IsDefault, IsCurrent, CurrentStorageAccountName_
  3. 希望するサブスクリプションを設定する_$SubscriptionName = 'Your subscription name'_
  4. 目的のblobを確認してください_Get-AzureStorageBlob_
  5. 次に、BLOB _$ctx = New-AzureStorageContext_の認証コンテキストを作成し、必要なパラメーターを入力する必要があります。
  6. これで、ブロブのCORSルールを取得または設定する準備ができました。現在のCORSルールを確認する_Get-AzureStorageCORSRule -ServiceType Blob -Context $ctx_
  7. たとえば、現在のCORSルールを設定します：$CorsRules = (@{ AllowedHeaders=@("*"); AllowedOrigins=@("*"); ExposedHeaders=@("content-length"); MaxAgeInSeconds=200; AllowedMethods=@("Get","Connect", "Head")})
  8. _Set-AzureStorageCORSRule -ServiceType Blob -CorsRules $CorsRules -Context $ctx_
5
Waqas

BLOBストレージのJSONファイルにREST APIとしてアクセスする場合は、ストレージアカウントからCORSを有効にする必要があります。 ストレージアカウント> CORS> Blobサービス>に移動し、必要なすべての値を設定します。 enter image description here

3
Sher Singh

PowerShellを介してCORSを設定するより簡潔な方法： https://Gist.github.com/irwinwilliams/4cf93b6e2461c753ff125590650186ae

#works with Azure in Powershell v 1.3.2
clear 
$StorageAccountName = "[storageaccountname]"
$Key = "[storageaccountkey]"
$Context = New-AzureStorageContext -StorageAccountKey $Key -StorageAccountName $StorageAccountName
$CorsRules = (@{
    AllowedHeaders=@("*");
    AllowedOrigins=@("*");
    ExposedHeaders=@("content-length");
    MaxAgeInSeconds=200;
    AllowedMethods=@("Get","Connect", "Head")})
Set-AzureStorageCORSRule -ServiceType Blob -CorsRules $CorsRules -Context $Context
$CORSrule = Get-AzureStorageCORSRule -ServiceType Blob -Context $Context
echo "Current CORS rules: "
echo $CORSrule
3
Irwin

これは、コンソールアプリケーションでcorsを有効にする方法です。StorageCredentials内に資格情報を指定するだけです。

private static CloudStorageAccount StorageAccount;

    public static CloudBlobClient BlobClient
    {
        get;
        private set;
    }

    static void Main(string[] args)
    {

        StorageAccount = new CloudStorageAccount(new StorageCredentials("AccountName", "AccountKey"), true);
        BlobClient = StorageAccount.CreateCloudBlobClient();

        InitializeCors(BlobClient);
    }

    private static void InitializeCors(CloudBlobClient blobClient)
    {           
        ServiceProperties blobServiceProperties = BlobClient.GetServiceProperties();

        ConfigureCors(blobServiceProperties);

        BlobClient.SetServiceProperties(blobServiceProperties);         
    }

    private static void ConfigureCors(ServiceProperties serviceProperties)
    {
        serviceProperties.Cors = new CorsProperties();
        serviceProperties.Cors.CorsRules.Add(new CorsRule()
        {
            AllowedHeaders = new List<string>() { "*" },
            AllowedMethods = CorsHttpMethods.Put | CorsHttpMethods.Get | CorsHttpMethods.Head | CorsHttpMethods.Post,
            AllowedOrigins = new List<string>() { "*" },
            ExposedHeaders = new List<string>() { "*" },
            MaxAgeInSeconds = 1800 // 30 minutes
        });
    }
1
engel

B2Cのカスタマイズを確実に機能させるには、以下のことに注意する必要があります。

  1. コンテンツがHTML5準拠でアクセス可能であることを確認する
  2. コンテンツサーバーでCORSが有効になっていることを確認します。リンク： ポータルのAzure BLOBストレージでCORSを設定するにはどうすればよいですか？
  3. （非常に重要）HTTPS経由でコンテンツを提供します。
  4. （オプション）すべてのリンクとCSSコンテンツに https：// yourdomain/content などの絶対URLを使用します。

ヒント：コンテンツをホストしているサイトでCORSが有効になっていることを確認し、CORSリクエストをテストするには、サイト http://test-cors.org/ を使用できます。このサイトのおかげで、CORS要求をリモートサーバーに送信する（CORSがサポートされているかどうかをテストする）か、CORS要求をテストサーバーに送信する（CORSの特定の機能を調べる）ことができます。

参照リンク： https://docs.Microsoft.com/en-us/Azure/active-directory-b2c/active-directory-b2c-reference-customize-ui-custom

1
Vandana Negi

Azure BlobストレージはCORSをサポートしていますが、リクエストを行う前にヘッダーを設定する必要があります。これを行うには、送信される情報をより詳細に制御できるため、$.ajaxを使用することをお勧めします。 このデモ の作り直しの例を次に示します。

function setHeader(xhr) {
    xhr.setRequestHeader('x-ms-version', '2013-08-15');
    xhr.setRequestHeader('MaxDataServiceVersion', '3.0');
    xhr.setRequestHeader('Accept', 'application/json;odata=nometadata');
}

$.ajax({
    type: 'GET',
    datatype: "json",
    url: 'http://mytest.blob.core.windows.net/forms/f001.etx',
    beforeSend: setHeader,
    success: function(data) {
        // do something with the retrieved file.
    },
    error: function (res, status, xhr) {
        alert("can't get the data for the specified table");
    }
});
0
Rory McCrossan

Azureポータルの新しいインターフェイスを使用すると、ストレージアカウントに移動するだけでCORSを有効にできます

enter image description here

そして、必要な設定でCORSを有効にします

enter image description here

0
Sajeetharan