web-dev-qa-db-fra.com

Comment puis-je définir CORS dans Azure BLOB Storage dans Portal?

Nous avons un stockage de blob sur Windows Azure.

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

J'ai téléchargé quelques fichiers sur le stockage en utilisant CloudBerry. Et je peux télécharger les fichiers par les navigateurs avec succès. Ces fichiers sont de simples fichiers texte, mais avec des extensions de fichier différentes. Par exemple,

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

Je veux télécharger les fichiers via jquery ($ .get), cependant, cela a échoué à cause de CORS.

Comment configurer CORS dans Azure BLOB Storage dans Portal?

Et devrais-je aussi faire quelque chose pour la SCRO du côté client?

jqueryajaxazurecors
14
Zach

UPDATE: Au moment de cette réponse, le portail Azure ne disposait pas de cette fonctionnalité. Il fait maintenant comme décrit ici . Ce qui suit explique comment procéder avant l'ajout de l'interface utilisateur.

Comment configurer CORS dans Azure BLOB Storage dans Portal?

Si vous le souhaitez, vous pouvez toujours définir les règles CORS pour le stockage d'objets blob par programme. Si vous utilisez la bibliothèque .Net Storage Client, consultez ce billet de blog de l'équipe de stockage: http://blogs.msdn.com/b/windowsazurestorage/archive/2014/02/03/windows-Azure-storage- introduction-cors.aspx . Code de paramétrage CORS de cet article de blog:

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
     });
}

Si vous recherchez un outil pour faire de même, quelques explorateurs de stockage prennent en charge la configuration de CORS - Explorateur Azure Storage, Cerebrata Azure Management Studio, Cloud Portam (Disclosure - Je construis un utilitaire Cloud Portam).

Une fois que le CORS est configuré correctement, vous pouvez utiliser le code mentionné dans la réponse de Rory pour télécharger le fichier à partir du stockage d'objets blob. Comme le dit Rory, vous n'avez rien à faire de spécial côté client.

16
Gaurav Mantri

Ceci est possible maintenant, heureusement, directement dans le portail. Si vous sélectionnez simplement le compte, vous verrez le menu avec diverses options et CORS sera l’une d’elles pour chacun des services Blob, Fichier, etc.

 enter image description here  enter image description here

20
Ilya Chernomordik

Désormais, vous pouvez facilement définir/modifier/afficher les règles CORS avec Azure Power Shell. Trouvez plus d'informations sur ce lien:

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

Pour résumer, les commandes suivantes de Power Shell définiront le CORS de votre blob:

  1. Exécutez Add-AzureAccount pour vous connecter à votre compte.
  2. Voir vos abonnements dans Azure Get-AzureSubscription | Format-Table SubscriptionName, IsDefault, IsCurrent, CurrentStorageAccountName
  3. Définir l'abonnement souhaité $SubscriptionName = 'Your subscription name'
  4. Vérifiez votre blob désiré Get-AzureStorageBlob
  5. Vous devez maintenant créer un contexte d'autorisation pour votre objet blob $ctx = New-AzureStorageContext et entrer les paramètres souhaités.
  6. Vous êtes maintenant prêt à obtenir ou à définir des règles CORS pour votre blob. Vérifier Règles CORS en vigueur Get-AzureStorageCORSRule -ServiceType Blob -Context $ctx
  7. Définissez les règles CORS actuelles, par exemple: $CorsRules = (@{ AllowedHeaders=@("*"); AllowedOrigins=@("*"); ExposedHeaders=@("content-length"); MaxAgeInSeconds=200; AllowedMethods=@("Get","Connect", "Head")})
  8. Set-AzureStorageCORSRule -ServiceType Blob -CorsRules $CorsRules -Context $ctx
5
Waqas

Une façon plus succincte de configurer CORS via PowerShell: 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

Pour que votre personnalisation B2C fonctionne, vous devez prendre en compte les éléments suivants:

  1. Assurez-vous que votre contenu est conforme à HTML5 et accessible.
  2. Assurez-vous que votre serveur de contenu est activé pour CORS. Lien: Comment puis-je définir CORS dans Azure BLOB Storage dans Portal?
  3. (Très important) Servir le contenu via HTTPS.
  4. (facultatif) Utilisez des URL absolues telles que https: // votredomaine/contenu pour tous les liens et le contenu CSS.

Conseil: pour vérifier que CORS est activé sur le site sur lequel vous hébergez votre contenu et tester les demandes CORS, vous pouvez utiliser le site http://test-cors.org/ . Grâce à ce site, vous pouvez simplement envoyer la demande CORS à un serveur distant (pour tester si CORS est pris en charge) ou envoyer la demande CORS à un serveur de test (pour explorer certaines fonctionnalités de CORS).

Lien de référence: https://docs.Microsoft.com/en-us/Azure/active-directory-b2c/active-directory-b2c-reference-customize-ui-custom

1
Vandana Negi

C’est ainsi que j’ai activé cors avec une application console. Il vous suffit de fournir vos informations d’identification dans 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
        });
    }
0
engel

Le stockage Azure Blob prend en charge CORS, mais vous devez définir les en-têtes avant de faire la demande. Pour ce faire, il serait préférable d'utiliser $.ajax car cela vous donne plus de contrôle sur les informations envoyées. Voici un exemple re-travaillé de cette démo :

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