Blazor Server Login Page - different appearance on Server

Question

Hi there,

I deployed my Blazor Server app on Windows 10 Pro. I realized that the Login page layout is quite different. There is no problem with the appearance of other pages. I couldn't understand why, I will be glad if you help.

Here is Login screenshot on the server:

Here is how Login displays on my development PC:

Here is the Login.cshtml:

@page  
  
@using Microsoft.AspNetCore.Authorization  
@using Microsoft.AspNetCore.Mvc.TagHelpers  
@using IMS.WebApp.Shared  
@model LoginModel  
@attribute [AllowAnonymous]  
  
@{  
    Layout = "/Pages/Shared/_EmptyLayout.cshtml";  
}  
@{  
    ViewData["Title"] = "Log in";  
}  
  
  
      
          
          
          
        Please sign in  
          
          
              
              
              
            @*  
            Email address*@  
          
          
              
              
              
            @*  
            Password*@  
          
  
          
              
          
        © 2022  
      
  
  
  
@section Scripts {  
      
}

Here is _EmptyLayout.cshtml:

@using Microsoft.AspNetCore.Hosting  
@using Microsoft.AspNetCore.Mvc.ViewEngines  
@inject IWebHostEnvironment Environment  
@inject ICompositeViewEngine Engine  
  
  
  
      
      
    @ViewData["Title"] - Vorlance  
  
      
          
        @**@  
          
      
      
          
          
      
  
  
      
      
          
          
            @RenderBody()  
          
      
      
  
      
          
          
          
      
      
          
          
          
      
  
    @await RenderSectionAsync("Scripts", required: false)

Accepted Answer

Hi @Cenk ,

The issue might relate the tag in the _EmptyLayout page.

The Environment Tag Helper conditionally renders its enclosed content based on the current hosting environment. include & exclude attributes control rendering the enclosed content based on the included or excluded hosting environment names.

Code like this:

  
    IWebHostEnvironment.EnvironmentName is Development  
  

  
    IWebHostEnvironment.EnvironmentName is not Development

More detail information, see Environment Tag Helper in ASP.NET Core.

If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".
Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.

Best regards,
Dillion

Answer

To the browsers dev tools to determine the difference. Maybe a css file did not load, or the window size makes a difference.

Answer

@Zhi Lv - MSFT I saw that you helped before in this post (asp-net-core-embedded-resource-microsoft-identity-is-not-found-when-environm) but I couldn't find it on the Program.cs. Would you please guide me?

Program.cs

using IMS.Plugins.EFCore;  
using IMS.UseCases;  
using IMS.UseCases.Activities;  
using IMS.UseCases.Customers;  
using IMS.UseCases.Interfaces;  
using IMS.UseCases.Inventories;  
using IMS.UseCases.PluginInterfaces;  
using IMS.USeCases.PluginInterfaces;  
using IMS.UseCases.Products;  
using IMS.UseCases.Reports;  
using IMS.UseCases.Validations;  
using IMS.UseCases.Vendors;  
using IMS.WebApp.Areas.Identity;  
using IMS.WebApp.Data;  
using Microsoft.AspNetCore.Components.Authorization;  
using Microsoft.AspNetCore.Identity;  
using Microsoft.EntityFrameworkCore;  
using IMS.UseCases.Interfaces.Customer;  
using IMS.UseCases.Interfaces.Order;  
using IMS.UseCases.Interfaces.OrderDetail;  
using IMS.UseCases.Interfaces.Vendor;  
using IMS.UseCases.OrderDetails;  
using IMS.UseCases.Orders;  
using Microsoft.Extensions.DependencyInjection.Extensions;  
using NLog.Web;  
using Radzen;  
  
  
var builder = WebApplication.CreateBuilder(args);  
  
// Add services to the container.  
var connectionString = builder.Configuration.GetConnectionString("InventoryManagement");  
builder.Services.AddDbContext(options =>  
    options.UseSqlServer(connectionString));  
builder.Services.AddDatabaseDeveloperPageExceptionFilter();  
builder.Services.AddDefaultIdentity(options => options.SignIn.RequireConfirmedAccount = false)  
    .AddRoles()  
    .AddEntityFrameworkStores();  
builder.Services.AddRazorPages();  
builder.Services.AddServerSideBlazor();  
builder.Services.AddScoped>();  
builder.Services.AddSingleton();  
  
builder.Services.AddDbContextFactory(options =>  
    {  
        options.UseSqlServer(builder.Configuration.GetConnectionString("InventoryManagement"));  
    }  
);  
//Radzen DialogService  
builder.Services.AddScoped();  
//DI Repo  
builder.Services.AddTransient();  
builder.Services.AddTransient();  
builder.Services.AddTransient();  
builder.Services.AddTransient();  
builder.Services.AddTransient();  
  
//vendors  
builder.Services.AddTransient();  
//Customers  
builder.Services.AddTransient();  
//Order  
builder.Services.AddTransient();  
//DI Use cases  
builder.Services.AddTransient();  
builder.Services.AddTransient();  
builder.Services.AddTransient();  
builder.Services.AddTransient();  
builder.Services.AddTransient();  
builder.Services.AddTransient();  
builder.Services.AddTransient();  
builder.Services.AddTransient();  
builder.Services.AddTransient();  
builder.Services.AddTransient();  
builder.Services  
    .AddTransient();  
builder.Services.AddTransient();  
builder.Services.AddTransient();  
builder.Services.AddTransient();  
builder.Services.AddTransient();  
//vendors  
builder.Services.AddTransient();  
builder.Services.AddTransient();  
builder.Services.AddTransient();  
builder.Services.AddTransient();  
builder.Services.AddTransient();  
//customers  
builder.Services.AddTransient();  
builder.Services.AddTransient();  
builder.Services.AddTransient();  
builder.Services.AddTransient();  
builder.Services.AddTransient();  
//orders  
builder.Services.AddTransient();  
builder.Services.AddTransient();  
builder.Services.AddTransient();  
builder.Services.AddTransient();  
builder.Services.AddTransient();  
builder.Services.AddTransient();  
builder.Services.AddTransient();  
builder.Services.AddTransient();  
builder.Services.AddTransient();  
builder.Services.AddTransient();  
//order details  
builder.Services.AddTransient();  
builder.Services.AddTransient();  
builder.Services.AddTransient();  
builder.Services.AddTransient();  
builder.Services.AddTransient();  
builder.Services.AddTransient();  
  
//logging  
builder.Logging.ClearProviders();  
builder.Logging.AddConsole();  
builder.Host.UseNLog();  
  
//Aspnetcore_Environment  
builder.WebHost.UseWebRoot("wwwroot");  
builder.WebHost.UseStaticWebAssets();  
  
var app = builder.Build();  
  
var scope = app.Services.CreateScope();  
var imsContext = scope.ServiceProvider.GetRequiredService();  
//imsContext.Database.EnsureDeleted();  
//imsContext.Database.EnsureCreated();  
  
// Configure the HTTP request pipeline.  
if (app.Environment.IsDevelopment())  
{  
    app.UseMigrationsEndPoint();  
}  
else  
{  
    app.UseExceptionHandler("/Error");  
    // The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.  
    app.UseHsts();  
}  
  
app.UseHttpsRedirection();  
  
app.UseStaticFiles();  
  
app.UseRouting();  
  
app.UseAuthentication();  
app.UseAuthorization();  
  
app.MapControllers();  
app.MapBlazorHub();  
app.MapFallbackToPage("/_Host");  
  
app.Run();

Share via

Blazor Server Login Page - different appearance on Server

2 additional answers

Your answer