asp.net with vue js FsLightbox lybrary Access to XMLHttpRequest origin has been blocked by CORS policy

Question

asp.net with vue js FsLightbox lybrary Access to XMLHttpRequest at 'https://localhost:44347/CarImages/3e0da2fa7fd0417ea2e2f4678229e264Logo.png' from origin 'http://localhost:5173' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. error

when use FsLightbox library show this error , im use this images path in another slider its run good and im use another images from internet to FsLightbox also run good this problem just appear when use my images paths with FsLightbox !!??

// this is policy code from program.cs 

builder.Services.AddCors(options =>
{
    options.AddPolicy(name:"MyAllowSpecificOrigins",
       builder =>
       {
           builder.WithOrigins("http://localhost:5173")
            .AllowAnyMethod()
            .AllowAnyHeader()
            .SetIsOriginAllowedToAllowWildcardSubdomains();
       });
});

/////////////////////

// this in vue js FsLightbox like documntation

Answer 1

In ASP.NET Core the static file handler returns static files like images. You'll need to configure the static file handlers. I found the following article when doing a Google search for static file handler core and CORS.

https://www.bytefish.de/blog/aspnetcore_static_files_cors.html