Connect to Azure Data Lake Storage Data from Blazor Apps

Blazor is a framework for developing modern, client-side web UIs using .NET technology. Instead of coding in JavaScript, developers can use the familiar C# language and .NET libraries to build app UIs.

The CData ADO.NET Provider for Azure Data Lake Storage can be used with standard ADO.NET interfaces, such as LINQ and Entity Framework, to interact with live Azure Data Lake Storage data. Since Blazor supports .NET Core, developers can use CData ADO.NET Providers in Blazor apps. In this article, we will guide you to build a simple Blazor app that talks to Azure Data Lake Storage using standard SQL queries.

Install the CData ADO.NET Provider for Azure Data Lake Storage

CData ADO.NET Providers allow users to access Azure Data Lake Storage just like they would access SQL Server, using simple SQL queries.

Install the Azure Data Lake Storage ADO.NET Data Provider from the CData website or from NuGet. Search NuGet for "Azure Data Lake Storage ADO.NET Data Provider."

Create a Azure Data Lake Storage-Connected Blazor App

Start by creating a Blazor project that references the CData ADO.NET Provider for Azure Data Lake Storage

1. Create a Blazor project on Visual Studio.
👁 Create a Blazor app project.

2. From the Solution Explorer, right click Dependencies, then click Add Project Reference.
3. In the Reference Manager, click the Browse button, and choose the .dll file of the installed ADO.NET Provider (e.g. System.Data.CData.ADLS.dll, typically located at C:\Program Files\CData\CData ADO.NET Provider for Azure Data Lake Storage\lib etstandard2.0).
👁 Reference ADO.NET for Azure Data Lake Storage .dll in the Blazor app.

SELECT Azure Data Lake Storage Data from the Blazor App

1. Open the Index.razor file from the Project page.
2. In a ADLSConnection object, set the connection string:

   Authenticating to a Gen 1 DataLakeStore Account

   Gen 1 uses OAuth 2.0 in Entra ID (formerly Azure AD) for authentication.

   For this, an Active Directory web application is required. You can create one as follows:

   1. Sign in to your Azure Account through the
   2. Select "Entra ID" (formerly Azure AD).
   3. Select "App registrations".
   4. Select "New application registration".
   5. Provide a name and URL for the application. Select Web app for the type of application you want to create.
   6. Select "Required permissions" and change the required permissions for this app. At a minimum, "Azure Data Lake" and "Windows Azure Service Management API" are required.
   7. Select "Key" and generate a new key. Add a description, a duration, and take note of the generated key. You won't be able to see it again.

   To authenticate against a Gen 1 DataLakeStore account, the following properties are required:

   • Schema: Set this to ADLSGen1.
   • Account: Set this to the name of the account.
   • OAuthClientId: Set this to the application Id of the app you created.
   • OAuthClientSecret: Set this to the key generated for the app you created.
   • TenantId: Set this to the tenant Id. See the property for more information on how to acquire this.
   • Directory: Set this to the path which will be used to store the replicated file. If not specified, the root directory will be used.

   Authenticating to a Gen 2 DataLakeStore Account

   To authenticate against a Gen 2 DataLakeStore account, the following properties are required:

   • Schema: Set this to ADLSGen2.
   • Account: Set this to the name of the account.
   • FileSystem: Set this to the file system which will be used for this account.
   • AccessKey: Set this to the access key which will be used to authenticate the calls to the API. See the property for more information on how to acquire this.
   • Directory: Set this to the path which will be used to store the replicated file. If not specified, the root directory will be used.

   For example: Schema=ADLSGen2;Account=myAccount;FileSystem=myFileSystem;AccessKey=myAccessKey;InitiateOAuth=GETANDREFRESH;

3. The code below creates a simple Blazor app for displaying Azure Data Lake Storage data, using standard SQL to query Azure Data Lake Storage just like SQL Server.

    @page "/"
    @using System.Data;
    @using System.Data.CData.ADLS;
    
    <h1>Hello, world!</h1>
    
    Welcome to your Data app.
    
    <div class="row">
    <div class="col-12">
    
    @using (ADLSConnection connection = new ADLSConnection(
    "Schema=ADLSGen2;Account=myAccount;FileSystem=myFileSystem;AccessKey=myAccessKey;InitiateOAuth=GETANDREFRESH;"))
    {
    var sql = "SELECT FullPath, Permission FROM Resources WHERE Type = 'FILE'";
    var results = new DataTable();
    
    ADLSDataAdapter dataAdapter = new ADLSDataAdapter(sql, connection);
    dataAdapter.Fill(results);
    
    <table class="table table-bordered">
    <thead class="thead-light">
    <tr>
    @foreach (DataColumn item in results.Rows[0].Table.Columns)
    {
    <th scope="col">@item.ColumnName</th>
    }
    </tr>
    </thead>
    <tbody>
    @foreach (DataRow row in results.Rows)
    {
    <tr>
    @foreach (var column in row.ItemArray)
    {
    <td>@column.ToString()</td>
    }
    </tr>
    }
    </tbody>
    </table>
    }
    </div>
    </div>
    

4. Rebuild and run the project. The ADO.NET Provider renders Azure Data Lake Storage data as an HTML table in the Blazor app. 👁 Query Azure Data Lake Storage from Blazor app.
   

   At this point, you have a Azure Data Lake Storage-connected Blazor app, capable of working with live Azure Data Lake Storage data just like you would work with a SQL Server instance. Download a free, 30-day trial and start working with live Azure Data Lake Storage data in your Blazor apps today.