Quantcast
Channel: Active questions tagged blazor - Stack Overflow
Viewing all articles
Browse latest Browse all 4839

Upload an image with NET8 and Blazor in the user profile with Microsoft Identity

$
0
0

I'm creating a new website with Blazor and the NET8 framework using the boilerplate from Visual Studio 2022 Preview. The source code of this test is on GitHub.

I have already changed the ApplicationUser adding a new property called ProfilePicture defined as

public byte[]? ProfilePicture { get; set; }

Now, in the file Index.razor under Components > Pages > Account > Manage, I like to allow the users to upload an image for their profile. Also, I have another issue in this form that I explain in this post.

So, I added this code in the HTML part

<InputFile OnChange="LoadFiles" />

and then the code

private async Task LoadFiles(InputFileChangeEventArgs e){    MemoryStream ms = new MemoryStream();    await e.File.OpenReadStream().CopyToAsync(ms);    var bytes = ms.ToArray();    _user.ProfilePicture = bytes;    await UserManager.UpdateAsync(_user);    Input.ProfilePicture = bytes;}

When I change an image to upload, the function LoadFiles is not fired at all. I tried to render a page as RenderModeInteractiveAuto but definitely this raises an error.

Update

I created a new Razor page for uploading the image (I removed the code it is not essential for the resulting error)

@using BlazorIdentity.Data@using Microsoft.AspNetCore.Identity@rendermode RenderMode.InteractiveServer@inject AuthenticationStateProvider AuthenticationStateProvider@inject UserManager<ApplicationUser> UserManager<InputFile OnChange="LoadFiles" />@code {    [Parameter] public ApplicationUser? User { get; set; } = default!;    private async Task LoadFiles(InputFileChangeEventArgs e)    {        MemoryStream ms = new MemoryStream();        await e.File.OpenReadStream().CopyToAsync(ms);        var bytes = ms.ToArray();        User.ProfilePicture = bytes;        await UserManager.UpdateAsync(User);    }}

Now, the problem occurs when the application performs the UpdateSync. I got this error

System.InvalidOperationException: The instance of entity type 'ApplicationUser' cannot be tracked because another instance with the same key value for {'Id'} is already being tracked. When attaching existing entities, ensure that only one entity instance with a given key value is attached. Consider using 'DbContextOptionsBuilder.EnableSensitiveDataLogging' to see the conflicting key values.

I'm not changing the ID, I only change a value in the ApplicationUser.

Update/2

The pages for the Identity are the boilerplate from Visual Studio 2022 Preview. I added some new fields. But look at that.

enter image description here

Without changing anything, clicking on the menu to jump from one page to another, I get the error

A second operation was started on this context instance before a previous operation completed. This is usually caused by different threads concurrently using the same instance of DbContext. For more information on how to avoid threading issues with DbContext, see https://go.microsoft.com/fwlink/?linkid=2097913.


Viewing all articles
Browse latest Browse all 4839

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>