Блог

Вместо строк подключения, токена SAS и других подходов, как мы можем добиться функциональности, используя аутентификацию «Принципал службы (OAuth)».

Принципал службы обычно предоставляет значения «Идентификатор клиента», «Секрет клиента» и «Идентификатор клиента» из Azure.

Шаги по решению этой проблемы следующие:

• Сгенерировать токен OAuth
• Создайте объект учетных данных токена.
• Получите ссылку на облачный контейнер Azure.
• Получить ссылку на большой двоичный объект, прочитать в поток и преобразовать в базовые 64 байта
• Отображение изображения массива байтов на странице Angular 6

Пространства имен:

 using Microsoft.IdentityModel.Clients.ActiveDirectory;
using Microsoft.WindowsAzure.Storage;
using Microsoft.WindowsAzure.Storage.Auth;
using Microsoft.WindowsAzure.Storage.Blob;
  

Шаг 1. Сгенерируйте токен OAuth — используя идентификатор клиента и секрет клиента, сгенерируйте токен доступа. Мы будем использовать это позже для аутентификации.

 public string GetUserOAuthToken()
{
    const string ResourceId = "https://storage.azure.com/";
    const string AuthInstance = "https://login.microsoftonline.com/{0}/";
    string authority = string.Format(CultureInfo.InvariantCulture, AuthInstance, ConfigHelper.AzStorAccTenantId);
    AuthenticationContext authContext = new AuthenticationContext(authority);
    var clientCred = new ClientCredential(ConfigHelper.AzStorAccClientId, ConfigHelper.AzStorAccClientSecret);
    AuthenticationResult result = authContext.AcquireTokenAsync(ResourceId, clientCred).Resu<
    return result.AccessToken;
}
  

Шаг 2. Создайте объект учетных данных токена

 public bool GenerateTokenCredentials()
{
    if (string.IsNullOrEmpty(authenticationError))
    {
        string authenticationResult = GetUserOAuthToken();
        if (string.IsNullOrEmpty(authenticationResult))
        {
            return false;
        }
        else
        {
            _tokenCredentials = new TokenCredential(authenticationResult);
            //_tokenCredentials is a global object
            return true;
        }
    }
    else
    {
        return false;
    }
}
  

Шаг 3. Получение ссылки на облачный контейнер Azure

 public CloudBlobContainer CreateCloudBlobContainer()
{
    try
    {
        GenerateTokenCredentials();
        StorageCredentials storageCredentials = new StorageCredentials(_tokenCredentials);
        CloudStorageAccount cloudStorageAccount = new CloudStorageAccount(storageCredentials, ConfigHelper.AzStorAccName, ConfigHelper.AzStorageEndPoint, useHttps: true);
        CloudBlobClient blobClient = cloudStorageAccount.CreateCloudBlobClient();
        return blobClient.GetContainerReference(ConfigHelper.AzStorAccBlobContName);
    }
    catch (Exception ex)
    {

    }
    return null;
}
  

Шаг 4. Получаем ссылку на большой двоичный объект, считываем в поток и преобразуем в базовые 64 байта

 public async Task<string> DownloadFile(string blobFileName)
{
    try
    {
        CloudBlobContainer blobContainer = CreateCloudBlobContainer();
        var blob = blobContainer.GetBlobReference(blobFileName);
        blob.FetchAttributes();
        var stream = await blob.OpenReadAsync();
        var byteData = ReadFully(stream);
        string byteImageUrl = string.Format("data:image/{0};base64,"   Convert.ToBase64String(byteData), GetBlobImageExtension(blobFileName));
        return byteImageUrl;
    }
    catch (Exception ex)
    {

    }
    return string.Empty;
}
  

Вспомогательные частные методы

 private byte[] ReadFully(Stream input)
{
    byte[] buffer = new byte[16 * 1024];
    using (MemoryStream ms = new MemoryStream())
    {
        int read;
        while ((read = input.Read(buffer, 0, buffer.Length)) > 0)
        {
            ms.Write(buffer, 0, read);
        }
        return ms.ToArray();
    }
}

private string GetBlobImageExtension(string blobFileName)
{
    string extension = Path.GetExtension(blobFileName).Trim().ToLower().Replace(".", string.Empty);
    string formattedExtensionForByteArray = !string.IsNullOrEmpty(extension) ? extension.Equals("svg") ? extension   " xml" : extension : string.Empty;
    return formattedExtensionForByteArray;
}
  

Шаг 5. Отобразите изображение массива байтов в Angular 6

 <img [src]="LogoFileName" class="logo" />
  

• Typescript

 LogoFileName: SafeResourceUrl;
this.LogoFileName = this.sanitizer.bypassSecurityTrustResourceUrl(responseLogoFileName);
  

Это полный рабочий пример использования образов контейнеров больших двоичных объектов Azure и их отображения без загрузки на диск.