Aurelia Browser Console Ошибка - POST-запрос - Ответ на предполётный запрос не проходит проверку контроля доступа - PullRequest
0 голосов
/ 11 мая 2018

Добрый день StackOverflow!Я открыл новый вопрос, потому что я - новичок в веб-службах, и текущие темы, похожие на мой вопрос, не имеют никакого смысла для меня в данный момент.Я очень рад узнать что-то новое.Я был бы рад получить ответ и поддержку от сообщества.

В настоящее время я прохожу тренинг по веб-разработке в компании, и одной из наших задач является создание веб-службы с использованием Microsoft ASP.NET Core 2.0 WebAPI "с использованием MVC и включением CORS для нашего приложения Aurelia.

Мое приложение Aurelia размещено в http://localhost:9000/, а веб-служба находится в http://localhost:5000/ в качестве тестов.

Вот проблемы, с которыми я столкнулся, и мои наблюдения:

  1. Всякий раз, когда я запускаю свое приложение Aurelia, я получаю эту ошибку в консоли браузера: "Failedзагрузить http://localhost:5000/api/sample: Ответ на предварительный запрос не проходит проверку контроля доступа: в запрошенном ресурсе отсутствует заголовок «Access-Control-Allow-Origin». Следовательно, Origin 'http://localhost:9000' не разрешенaccess. " Есть ли какая-либо конфигурация в моем коде C #, которую мне нужно добавить, чтобы эта ошибка исчезла?

  2. Я использовал PostMan, чтобы проверить, есть ли в Интернетесервис работаети да это сработало .Поэтому мне было интересно, что не так, если я получаю доступ к веб-сервису из моего приложения Aurelia, оно выдает ошибку.Я думаю, что ошибка на стороне клиента?Вот скриншот запроса и ответа PostMan.

PostMan request and response worked

Если я передаю объект из моего приложения aurelia в веб-службу в виде HTTP-запроса POST, понимает ли веб-служба / отображает ли сразу полученные значения объекта?

А также в консоли отладки веб-API: « Метод запроса POST не разрешен в политике CORS. »

Чтобы упростить эту задачу, у меня есть этот код в моих приложениях Aurelia, написанный на TypeScript, который запрашивает данные примера через глагол HTTP Post:

import { inject } from 'aurelia-framework';
import { HttpClient } from 'aurelia-http-client';

@inject(HttpClient)
export class WebAPITest {

  private httpClient: HttpClient;
  private static readonly BASE_URL = `http://localhost:5000/api/`;
  private message = `Web API Access Test! Pls. check the console.`;

  constructor(httpClient: HttpClient) {
    this.httpClient = httpClient;
    this.httpClient.configure(requestBuilder => {
      requestBuilder.withBaseUrl(WebAPITest.BASE_URL);
      requestBuilder.withHeader('Content-Type', 'application/json'); // (?) Need clarifications.
    });
  }

  activate() {
    let sampleData = new SampleData();
    return this.httpClient.post(`sample`, sampleData)
      .then(response => {
        if (response.isSuccess) {
          this.data = response.content;
          console.log(`SampleData Web Service Call SUCCEED!`);
        } else {
          console.log(`SampleData Web Service Call FAILED!`);
        }
    });
  }
}

export class SampleData {
   public name: string;
   public age: number;

   constructor() {
    this.name = "Garfield";
    this.age = 5;
   }
}

Вот код моего ASP.NET Core 2.0 MVC WebAPI: (Startup.cs)

using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
using Microsoft.AspNetCore.Builder;
using Microsoft.AspNetCore.Hosting;
using Microsoft.AspNetCore.Http;
using Microsoft.Extensions.DependencyInjection;

namespace Syslog.Web.GradeSheet.Backend
{
    public class Startup
    {
        public void ConfigureServices(IServiceCollection services)
        {
            services.AddMvc();
            services.AddCors();
        }

        public void Configure(IApplicationBuilder app, IHostingEnvironment env)
        {
            if (env.IsDevelopment())
            {
                app.UseDeveloperExceptionPage();
            }

            // For now it only accepts requests from localhost port 9000 which is the seat of our Aurelia applications.
            app.UseCors(corsPolicyBuilder => {
                corsPolicyBuilder.WithOrigins("http://localhost:9000");
            });

            app.UseMvc();

            // Normally this will be fired up when no route has been matched.
            app.Run(async (context) =>
            {
                await context.Response.WriteAsync("Welcome To GradeSheet Web Service! MVC has not found any Route that has been matched yet.");
            });
        }
    }
}

Вот код моего веб-API MVC ASP.NET Core 2.0: (SampleController.cs):

using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
using Microsoft.AspNetCore.Mvc;

namespace Syslog.Web.GradeSheet.Backend.Controllers
{
    [Route("api/[controller]")]
    public class SampleController : ControllerBase
    {
        [HttpPost]
        public IActionResult getSampleObject([FromBody] SampleData sampleData) {

            if(ModelState.IsValid) {
                System.Diagnostics.Debug.WriteLine($"PRINTED: {sampleData.name} is {sampleData.age} years old.");
            } else {
                System.Diagnostics.Debug.WriteLine("ModelState is not Valid.");
            }


            return Ok($"Ok, got it, {sampleData.name}! You are {sampleData.age} years old.");
        }
    }

    public class SampleData {
        public string name { get; set; }
        public int age { get; set; }
    }
}

СпасибоВы очень много времени читаете мою проблему.Буду признателен за любые решения, рекомендации, дополнительную информацию или критику по моему коду.Хорошего дня.

1 Ответ

0 голосов
/ 11 мая 2018

Проблема в MVC Startup здесь.Вы не полностью конфигурируете свой компоновщик CORS, вы конфигурируете только разрешенные источники, но не остальную часть конфигурации.

Если вы измените его на это, оно должно работать нормально:

app.UseCors(corsPolicyBuilder => {
  corsPolicyBuilder.WithOrigins("http://localhost:9000").AllowAnyHeader().AllowAnyMethod().AllowCredentials();
});
...