2017-01-14 2 views
3

Я разрабатываю приложение Angular2 с ASP.Net Core MVC и ASP.Net Web Api.HTML5 маршрутизации в приложении Angular2 с ASP.Net Core MVC и ASP.Net Web Api

Вот моя основная архитектура.

ASP.Net MVC проекта Ядро (MyProject.Web)

  • NuGet, NPM и Bower используется для зависимостей. Бауэр используется для копирования зависимости НПХ от node_modules к действию wwwroot/libs/
  • Home/Index контроллера обеспечивает первую страницу, которая загружает Angular2 и другие зависимости.
  • Шаблоны загружаются из ActionMethods т.е. Home/About
  • SystemJS загружает модули.
  • служба HTTP Angular2 призывает к Web Api Project ASP.Net (отдельный проект, чем MVC)

ASP.Net Api Project Web (MyProject.Api) - Каждый контроллер предназначен для CRUD операций юридическое лицо, а также ответы на HTTP Angular2 в

Проблема: Я не в состоянии использовать маршрутизацию HTML5, и я вынужден хэш маршрутизации, поскольку html5 маршрутизации вызовов сервера и мой проект MVC не соответствующий контроллер. Поэтому сервер ничего не возвращает.

+0

Вы должны иметь возможность настроить сервер для поддержки push5start HTML5. Ему просто нужно вернуть 'index.html 'для неизвестных URL-адресов –

+0

Во-первых, нет index.html, as ment ионизированные над методами действия, используются для доставки html. Во-вторых, что, если мой AngularApp запрашивает ресурс (т. Е. Изображение, css, js-файл и т. Д.), Который существует, но больше не доступен, и я хочу отобразить ошибку. Но в вашем решении возвращается действие индекса? Как с этим бороться? –

+0

Вы можете вернуть ответ 404 (не переписывать в index.html) для запросов, пытающихся получить доступ к ресурсам в каталоге 'asset' (или различать по другим критериям). –

ответ

1

Проблема: Я не могу использовать маршрутизацию HTML5, и я вынужден хэш маршрутизации, поскольку html5 маршрутизации вызовов сервера и мой проект MVC не соответствующий контроллер. Поэтому сервер ничего не возвращает.

Добавление # в пути маршрута, вероятно, является наиболее распространенным решением в таком случае, как вы, но ...

Есть ли у вас какие-либо особые причины для использования MVC с Угловое?


На мой взгляд, вам не нужно MVC - можно просто создать пустой ASP.NET основной проект и добавить в свой HTML/Угловая приложение - чистый, простой, удобный и не конфликты между MVC и угловой;)

Добавить файлы (в том числе index.html) в wwwroot и обновить Startup.cs файл:

public class Startup 
{ 
    public void ConfigureServices(IServiceCollection services) 
    { 
    } 

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

     if (env.IsDevelopment()) 
     { 
      app.UseDeveloperExceptionPage(); 
     } 
      app.UseDefaultFiles(); <- Add this line before UseStaticFiles 
      app.UseStaticFiles();    
    } 
} 


Вы можете найти более подробную информацию:

+0

Это то, что я видел в большинстве руководств. Тем не менее, я хочу воспользоваться также Razor (думаю, что я пока не знаю, но я думаю, что в конце концов я это сделаю), то есть я покажу статическую информацию (информацию, которая едва меняется часто) через ViewModel и не позволит угловым используйте http-вызовы для этой информации. Что вы скажете об этом случае использования? –

+0

Ответ зависит от вашего дизайна и реализации - если вы собираетесь в SPA, а Angular станет вашей основной технологией, и вы не увидите преимуществ от MVC. –

+0

Конечно, вы можете создать приложение MVC (как основную технологию) с помощью Angular в качестве дополнительной (поддерживающей) технологии, но я предполагаю, что вам не интересно это направление. –

5

Если вы планируете использовать в IIS, вы можете использовать модуль перезаписи URL. Он в основном сообщает веб-серверу, чтобы переписать все URL-адреса маршрутизации в index.html. ,

<?xml version="1.0" encoding="utf-8"?> 
<system.webServer> 
    <handlers> 
     <add name="aspNetCore" path="*" verb="*" modules="AspNetCoreModule" 
resourceType="Unspecified"/> 
    </handlers> 
    <aspNetCore processPath="%LAUNCHER_PATH%" arguments="%LAUNCHER_ARGS%" 
stdoutLogEnabled="true" stdoutLogFile=".\logs\stdout" 
forwardWindowsAuthToken="false" /> 
     <rewrite> 
     <rules> 
      <rule name="Angular 2 pushState routing" stopProcessing="true"> 
       <match url=".*" /> 
       <conditions logicalGrouping="MatchAll"> 
        <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" /> 
        <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" /> 
        <add input="{REQUEST_FILENAME}" pattern=".*\.[\d\w]+$" negate="true" /> 
        <add input="{REQUEST_URI}" pattern="^/(api)" negate="true" /> 
       </conditions> 
       <action type="Rewrite" url="/index.html" /> 
      </rule> 
     </rules> 
     </rewrite> 
    </system.webServer> 
</configuration> 
1

«Я не в состоянии использовать маршрутизацию HTML5, и я вынужден хэш маршрутизации, поскольку html5 маршрутизации вызовов сервера и мой проект MVC не соответствующий контроллер. Так что сервер ничего»

https://github.com/aspnet/JavaScriptServices

Посмотри на помощник Routing аки спа-услугу не возвращается NuGet и маршрут спа запасного варианта.

Когда нет серверного маршрута не найден, и маршрут не имеет расширения файла, то index.html должен быть возвращен клиенту, где текущий маршрут интерпретируется как маршрут на стороне клиента с помощью углового маршрутизатора.

Смежные вопросы