React App должен пройти аутентификацию на ASP. Net Core API Project через MSAL - PullRequest
0 голосов
/ 30 января 2020

Я полный новичок ie, чтобы реагировать и MSAL. Я создал ASP. Net Core MVC WebApplication, который подключается к базе данных в Azure. Он использует. Net Core 3 и Identity UI. Теперь мне нужно создать реагирующее веб-приложение, которое использует API моего MVC веб-приложения.

У меня есть требование использовать нашу существующую Azure AD для аутентификации и создания веб-приложения React в качестве пользовательского интерфейса. Моя проблема в том, где и как начать. Приложение React должно выполнить процесс входа в систему. Роли пользователей должны управляться в существующей базе данных. Перед требованием приложение MVC обрабатывало регистрацию и вход в систему через личный интерфейс пользователя и сохраняло пользователей и роли в базе данных azure. Теперь пользователи должны проходить аутентификацию через azure объявление.

Насколько я понимаю, msal, приложение реагировать должно перенаправить на azure объявление входа в систему и получит токен, а служба azure после успешного входа перенаправит обратно в приложение реагирования.

Как приложение реагирует с токеном моего MVC веб-приложения? Как мне изменить контроллеры, чтобы токен передавался и проверялся? мне нужно настроить некоторые вещи для MSAL или аутентификации в файле startup.cs?

Я создал контроллер для тестирования:

public class TestAPIController : Controller
{
    private readonly IBaseRepository<Articles> _BaseRepository;

    public TestAPIController(IBaseRepository<Articles> _BaseRepository)
    {
        this._BaseRepository = _BaseRepository;
    }

    // GET
    [HttpGet]
    [Route("GetArticles")]
    public async Task<IActionResult> GetArticles()
    {
        return Ok(JsonConvert.SerializeObject(await _BaseRepository.GetAllAsync()));
    }
}

Мой файл startup.cs выглядит следующим образом:

public class Startup
{
    public Startup(IConfiguration configuration)
    {
        Configuration = configuration;
    }

    public IConfiguration Configuration { get; }

    // This method gets called by the runtime. Use this method to add services to the container.
    public void ConfigureServices(IServiceCollection services)
    {
        services.AddDbContext<BaseContext>(opts => opts.UseSqlServer(Configuration.GetConnectionString("My_ConnectionString")));

        //CookiePolice
        services.Configure<CookiePolicyOptions>(options =>
        {
            options.CheckConsentNeeded = context => true;
            options.MinimumSameSitePolicy = SameSiteMode.None;
        });

        services.AddIdentity<ApplicationUser, IdentityRole>(options => 
        {
            options.SignIn.RequireConfirmedEmail = true;
            options.Stores.MaxLengthForKeys = 128;
        })
            .AddEntityFrameworkStores<BaseContext>()
            .AddDefaultUI()
            .AddDefaultTokenProviders();

        services.ConfigureApplicationCookie(options =>
        {
            options.Cookie.HttpOnly = true;
            options.ExpireTimeSpan = TimeSpan.FromMinutes(30);
            options.LoginPath = $"/Identity/Account/Login";
            options.LogoutPath = $"/Identity/Account/Logout";
            options.AccessDeniedPath = $"/Identity/Account/AccessDenied";
            options.SlidingExpiration = true;
            options.Cookie.Name = Common.Common_Ressources.LoginCookieName;
        });

        services.AddMvc().SetCompatibilityVersion(CompatibilityVersion.Version_3_0)
            .AddRazorPagesOptions(options =>
            {
                options.Conventions.AuthorizeAreaFolder("Identity", "/Account/Manage");
                options.Conventions.AuthorizeAreaPage("Identity", "/Account/Logout");
            });
    }

    // This method gets called by the runtime. Use this method to configure the HTTP request pipeline.
    public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
    {
        if (env.IsDevelopment())
        {
            app.UseDeveloperExceptionPage();
        }
        else
        {
            app.UseExceptionHandler("/Home/Error");
            app.UseHsts();
        }

        app.UseRouting();
        app.UseHttpsRedirection();
        app.UseStaticFiles();
        app.UseAuthentication();
        app.UseCookiePolicy();
        app.UseAuthorization();

        app.UseEndpoints(endpoints =>
        {
            endpoints.MapControllerRoute("default", "{controller=Home}/{action=Index}/{id?}");
            endpoints.MapControllers();
            endpoints.MapRazorPages();
        });
    }
}

Есть небольшой фрагмент кода, который покажет Как приложение «Реакция» должно получить токен и передать его в приложение MVC? Не могли бы вы предоставить некоторые детали, которые я должен знать, прежде чем приступить к реализации? Я надеюсь, что смогу найти лучший способ для достижения цели требования. Каждый маленький кусочек кода может помочь мне понять его немного лучше.

Заранее спасибо

1 Ответ

0 голосов
/ 05 февраля 2020

Есть два основных шага.

1. Защитите свой веб-интерфейс ( сервер ) с помощью azure объявления. Вы можете сослаться на этот пример (TodoListService).

2. Получить токен доступа из своего реагирующего приложения ( клиент ), а затем получить доступ к webapi с помощью токена.

Вот полное видео учебное пособие и исходный код о том, как использовать MSAL с React для вызова Microsoft Graph.

Единственное отличие в вашем Дело в том, что вместо вызова Microsoft Graph вы будете вызывать свой собственный API.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...