What has to be changed on a Blazor Project for it to be hostable?

Question

Ive made a Blazor Server Side Project and i want to host it on Azure.
It uses CosmosDB NoSQL in it.
What has to be changed for it to be hosted? (stuff like appsettings.json, etc)

Im able to turn it on no issue on my main PC, just had to login to the Azure CLI and then run. My Azure link on the other hand still shows an empty page.

The hosting is setup to a github repository (main branch).

To clarify: i made this with vscode but after hosting it using the Github repo on the Azure portal, it didnt work, comment said to try hosting it using visual studio tool, i did, made no difference, No errors visible though, just an empty site. I modified the appsettings.json and the launchsettings and i added appsettings.Production.json with necessary data i found online, still no difference, if anymore info is needed ill provide it

New Error:

Answer 1

I created a sample Blazor Server-Side application with Azure Cosmos DB and deployed it to an Azure Web App on Linux using GitHub Actions.

I added the below lines of code to my Program.cs class to configure Azure Cosmos DB.

builder.Services.Configure<CosmosDbSettings>(builder.Configuration.GetSection("CosmosDb"));
builder.Services.AddSingleton<CosmosClient>(sp =>
{
    var cosmosDbSettings = sp.GetRequiredService<IOptions<CosmosDbSettings>>().Value;
    return new CosmosClient(cosmosDbSettings.AccountEndpoint, cosmosDbSettings.AccountKey);
});
builder.Services.AddSingleton<CosmosDbService<TodoItem>>(sp =>
{
    var cosmosDbSettings = sp.GetRequiredService<IOptions<CosmosDbSettings>>().Value;
    var cosmosClient = sp.GetRequiredService<CosmosClient>();
    return new CosmosDbService<TodoItem>(cosmosClient, cosmosDbSettings.DatabaseName, cosmosDbSettings.ContainerName);
});

appsettings.son:

"CosmosDb": {
  "AccountEndpoint": "https://<AzureCosmosDBAccountNamer>.documents.azure.com:443/",
  "AccountKey": "<AccountKey>",
  "DatabaseName": "<DatabaseName>",
  "ContainerName": "ContainerName"
}

By using the workflow file below, I successfully deployed the app to Azure.

GitHub Workflow file:

name: Build and deploy ASP.Net Core app to Azure Web App - kablazorcosmosdb
on:
  push:
    branches:
      - master
  workflow_dispatch:
jobs:
  build:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - name: Set up .NET Core
        uses: actions/setup-dotnet@v4
        with:
          dotnet-version: '8.x'
      - name: Build with dotnet
        run: dotnet build --configuration Release
      - name: dotnet publish
        run: dotnet publish -c Release -o ${{env.DOTNET_ROOT}}/myapp
      - name: Upload artifact for deployment job
        uses: actions/upload-artifact@v4
        with:
          name: .net-app
          path: ${{env.DOTNET_ROOT}}/myapp
  deploy:
    runs-on: ubuntu-latest
    needs: build
    environment:
      name: 'Production'
      url: ${{ steps.deploy-to-webapp.outputs.webapp-url }}
    permissions:
      id-token: write 
    steps:
      - name: Download artifact from build job
        uses: actions/download-artifact@v4
        with:
          name: .net-app
      - name: Login to Azure
        uses: azure/login@v2
        with:
          client-id: ${{ secrets.AZUREAPPSERVICE_CLIENTID_BE1BFEF934C747789370FA9529B537DF }}
          tenant-id: ${{ secrets.AZUREAPPSERVICE_TENANTID_A658578A15294EE0B10C41EFC4A32775 }}
          subscription-id: ${{ secrets.AZUREAPPSERVICE_SUBSCRIPTIONID_A16B6C99691C4997ABDD5AE882FCC4F7 }}
      - name: Deploy to Azure Web App
        id: deploy-to-webapp
        uses: azure/webapps-deploy@v3
        with:
          app-name: 'kablazorcosmosdb'
          slot-name: 'Production'
          package: .

What has to be changed on a Blazor Project for it to be hostable?

The changes you need for hosting a Blazor app with Azure Cosmos DB.

• Add the appsettings.json values to the Environment Variables section of the Azure Web App.

"AccountEndpoint": "https://<AzureCosmosDBAccountNamer>.documents.azure.com:443/",
  "AccountKey": "<AccountKey>",
  "DatabaseName": "<DatabaseName>",
  "ContainerName": "ContainerName"

• Add the following startup command to the Configuration section of the Azure Web App.

dotnet <ProjectName>.dll

-Make sure to add the correct IP address to the Firewall section under Selected networks in the Networking settings.

I'm Fetching the Data from Azure Cosmos DB.

Azure Output: