.Net Core MVC Routing : 컨트롤러마다 조건부로 MapSpaFallbackRoute 설정

단일 .Net Core 1.0 웹 응용 프로그램에서 호스팅되는 여러 단일 페이지 응용 프로그램이 포함 된 프로젝트를 개발 중입니다..Net Core MVC Routing : 컨트롤러마다 조건부로 MapSpaFallbackRoute 설정

목표는 각 SPA를 각각 별도의보기 및 컨트롤러가있는 별도로 존재하도록 분할하는 것입니다.

Startup.cs에서 Microsoft.AspNetCore.SpaServices MapSpaFallbackRoute를 사용하여 SPA (이 경우 Angular 2)에 대한 딥 링크를 전달하므로 MVC가 혼란스럽지 않고 페이지 새로 고침시 404가 표시됩니다.

MapSpaFallbackRoute에서 컨트롤러를 수동으로 설정할 때 한 SPA에 대해 작업하고 있지만 각 SPA 컨트롤러에 조건부로 설정하는 방법을 찾을 수 없습니다.

나는 Mapwhen()과 Run()의 조합을 통해 내가 필요한 곳으로 가겠다 고 가정하고 있지만 올바른 구문을 얻을 수없는 것 같습니다. SPA를 가정

은 다음 대체 경로가 Dash1을 위해 완벽하게 작동 등, 'Dash2', 'Dash1'의 이름은 다음과 같습니다

app.UseMvc(routes => 
     { 
      routes.MapRoute(
       name: "default", 
       template: "{controller=Home}/{action=Index}/{id?}"); 

      routes.MapSpaFallbackRoute("spa-fallback", new { controller = "Dash1", action = "Index" }); 
     });

나는 이것을 시도했다 :

public void Configure(IApplicationBuilder app, IHostingEnvironment env, ILoggerFactory loggerFactory) 
    { 

     app.UseMvc(routes => 
     { 
      routes.MapRoute(
       name: "default", 
       template: "{controller=Home}/{action=Index}/{id?}"); 
     }); 
     app.Map("/Dash1", HandleDash1); 

    } 

    private static void HandleDash1(IApplicationBuilder app) 
    { 
     app.UseMvc(routes => 
     { 
      routes.MapSpaFallbackRoute("spa-fallback", new { controller = "Dash1", action = "Index" }); 
     }); 
    } 
}

.. 그런 다음 Dash1로 이동하여 페이지를 새로 고치려고하면 브라우저는 모든 http 요청에 '/ Dash1 /'을 추가하고 모든 것을 중단합니다.

출처

2016-10-04 David

여기에 완전히 추측되었지만 처음 시도했을 때 routes.MapSpaFallbackRoute ("{컨트롤러}/spa-fallback", 새로운 {action = "인덱스"});를 사용해 보셨습니까? –

나는 한 번 시도했지만 여전히 404 페이지를 새로 고침.첫 번째 문자열 매개 변수는 경로의 이름 일 뿐이지 만 그렇게 할 수 있어야합니다. 현재 컨트롤러를 폴백으로 등록하면됩니다. – David

MapWhen()과 함께 작동 시키지만 각 SPA를이 방식으로 등록해야합니다.

app.MapWhen(context => context.Request.Path.Value.StartsWith("/Dash1"), builder => 
{ 
    builder.UseMvc(routes => 
    { 
     routes.MapSpaFallbackRoute("dash1-fallback", new { controller = "Dash1", action = "Index" }); 
    }); 
}); 

app.UseMvc(routes => 
{ 
    routes.MapRoute(
     name: "default", 
     template: "{controller=Home}/{action=Index}/{id?}"); 
});

이 방법을 사용하여 Angular (2+) 앱을 호스팅합니다. 원래 SystemJS를 사용하여 하나의 프로젝트에 모든 응용 프로그램을 유지했지만 버전 4가 출시되면 Angular CLI로 이동했습니다.

앱을 관리하는 가장 좋은 방법은 각 앱의 솔루션에 별도의 프로젝트를 만들고 NPM 스크립트를 사용하여 번들 된 파일을 "마스터"프로젝트의 wwwroot 내부 폴더로 복사하는 것입니다.

보기를 반환하는 대신 CLI로 만든 정적 HTML 파일을 제공하고 있지만보기가 제대로 작동합니다.

public IActionResult Index() 
{ 
    return PhysicalFile(Path.Combine(Directory.GetCurrentDirectory(), "wwwroot/dash1", "index.html"), "text/HTML"); 
}

까다로운 부분은 라우터를 관리하는 것입니다. 현재 컨트롤러의 경로와 일치하도록 창 [ '_ app_base']을 설정하여 기본 href를 설정하고 앵귤러 라우터로 라우팅을 전달해야합니다.

<head> 
    // Set base href. 
    // You need to include the path if serving the static file from wwwroot 
    // Use '/' if using a View (I think, I had to change this when I switched to static files). 

    <base href="/dash1/"> 

    <script> 
     (function() { 
      // You could type the controller path here again but this will infer it. 

      window['_app_base'] = '/' + window.location.pathname.split('/')[1]; 

     })(); 
    </script> 
</head>

그런 다음, 각 라우터는 윈도우 [ '_ app_base']에서 베어링의 얻을 수 있습니다

은 index.html을에 다음을 포함합니다. app.module.ts에는 다음이 포함됩니다.

import { NgModule, Provider } from '@angular/core'; 
import { APP_BASE_HREF, Location } from '@angular/common'; 
const baseHref: Provider = { 
    provide: APP_BASE_HREF, 
    useValue: window['_app_base'] || '/' 
};

마지막으로 @NgModule의 providers 배열에 baseHref를 포함합니다.

출처

2016-10-12 14:51:49 David

David, 단일 ASP.Net Core MVC 응용 프로그램 내에서 별도의 Angular 2 응용 프로그램을 만드는 방법을 이해하는 데 어려움을 겪고 있습니다. 통찰력을 기꺼이 제공 해주시겠습니까? – TDC

안녕하세요. 게시물을 조금 더 많은 정보로 업데이트했습니다. Webpack 대신 SystemJS를 사용하고 있으며 아직 배울 수없는 많은 새로운 빌드 기능이 있습니다. Nuget에서 사용할 수있는 새로운 Angular 템플릿에 관한 질문을 보았지만이 방법은 Webpack과 호환되지 않으므로 여기에서이 대답을 업데이트했습니다. 희망이 도움이됩니다. – David

데이비드에게 해명 해 주셔서 감사합니다. 이 모든 것이 어떻게 어울리는 지 이해하는 데 시간을 할애해야합니다. ASP.Net Core 내에서 Angular를 통합하는 것이 유리하거나 전혀 혼란 스럽습니까 (정중 한 구문). – TDC

.Net Core MVC Routing : 컨트롤러마다 조건부로 MapSpaFallbackRoute 설정

답변

관련 문제