Blazor WASM - fetch api

0

Cześć, postanowiłem się pobawić z Blazorem i użyć zewnętrznego api, a konkretnie forumowego - https://api.4programmers.net/. Chciałem pobrać listę ofert pracy i wyświetlić ją z pomocą ListView od Telerika. Niestety kiedy chcę pobrać ową listę w konsoli przeglądarki widzę że fetch się nie udał -> (failed) net::ERR_FAILED

screen1.PNG
screen2.PNG
screen3.PNG

Struktura projektu
screen4.PNG

Program.cs

public class Program
    {
        public static async Task Main(string[] args)
        {
            var builder = WebAssemblyHostBuilder.CreateDefault(args);
            builder.RootComponents.Add<App>("#app");

            builder.Services.AddHttpClient<IJobDataService, JobDataService>(
                client => client.BaseAddress = new Uri("https://api.4programmers.net/v1"));

            builder.Services.AddTelerikBlazor();

            await builder.Build().RunAsync();
        }
    }

JobOverview.cs

public partial class JobOverview
    {
        [Inject]
        public IJobDataService JobDataService { get; set; }
        public IEnumerable<Job> Jobs { get; set; }

        protected async override Task OnInitializedAsync()
        {
            Jobs = (await JobDataService.GetAllJobs()).ToList();
        }
    }

JobDataService.cs

public class JobDataService : IJobDataService
    {
        private readonly HttpClient _httpClient;

        public JobDataService(HttpClient httpClient)
        {
            _httpClient = httpClient;
        }

        public async Task<IEnumerable<Job>> GetAllJobs()
        {
            return await JsonSerializer.DeserializeAsync<IEnumerable<Job>>(
                await _httpClient.GetStreamAsync("v1/jobs"), new JsonSerializerOptions()
                {
                    PropertyNameCaseInsensitive = true
                });
        }

        public async Task<Job> GetJobDetails(int jobId)
        {
            return await JsonSerializer.DeserializeAsync<Job>(
                await _httpClient.GetStreamAsync($"v1/jobs/{jobId}"), new JsonSerializerOptions()
                {
                    PropertyNameCaseInsensitive = true
                });
        }
    }

Jedyne co znalazłem w google, to problem związany z CORS, ale wszystkie odpowiedzi dotyczyły BlazorServerSide. Co bym musiał poprawić by móc pobrać dane z zewnętrznego API?
Pozdrawiam.

1

Jeżeli to żądanie leci po stronie klienta, to musisz ogarnąć CORS i SOP. Wygląda na to, że API nie zwraca nagłówka Access-Control-Allow-Origin, więc albo przekonasz @Adam Boduch do jego zmiany, albo będziesz robił żądanie z backendu (żeby Twoja przeglądarka go nie blokowała).

1 użytkowników online, w tym zalogowanych: 0, gości: 1