在 ASP.NET Core MVC 应用程序的布局布局页面中存储个人资料图片、姓名、职位

Question

I'm building my first web app and have completed the login mechanism to Azure using Identity web/OIDC. I get the profile picture full name and job title using the Graph API.

I'm not sure what is the best way to store the profile picture, name and job title in the layout page. When my app starts up I make a call to graph and copy the photograph to the www root folder to avoid constantly calling graph every time the layout page is called. I could also collect the name and job title at this point as well but I'm not sure where to store this information for later retrieval. Can it be stored in memory, which I can then reference from the layout page?

Here is part of my layout code

<div class="sidebar-header d-flex align-items-center">
    <div class="avatar"><img src="~/img/avatar.jpg" alt="Avatar" class="img-fluid rounded-circle"></div>

    <div class="title">
        <h1 class="h4">Full name</h1>
        <p>Job Title</p>                   
    </div>
</div>

<ul class="list-unstyled">

<li><a asp-area="" asp-controller="graph" asp-action="Profile"> <i class="fas fa-user" aria-hidden="true"></i>My Profile </a></li>
<li><a asp-area="" asp-controller="Dashboard" asp-action="Index"> <i class="fas fa-chart-line" aria-hidden="true"></i>Dashboard </a></li>

I'd appreciate any advice/example on best ways to achieve this.

I'm using ASP.NET Core 3.1 MVC, Web Identity preview and Graph 3.7.0

Thanks,

Jono

Answer 1

You may try to use the in-memory cache in ASP.NET Core .

On the other hand, if the profile picture is not that big, you can convert it into a base64 string and store it in the browser's localStorage together with the name and the job title. Erase it when user logout.