.Net Core 2 & AngularJS SPA 不工作
.Net Core 2 & AngularJS SPA Not Working
我一直在将一个项目从 .NET Framework 迁移到 .NET Core 2,过程比预期的要顺利,但是当我认为我已经克服了最困难的挑战时,我终生无法我让 SPA 方面开始工作。
当我启动该应用程序时,只要我转到根目录,它就可以正常工作(https://localhost:5001) and I can navigate with the Angular routing just fine. However if I try and load a page via a route, eg. https://localhost:5001/login,我得到一个通用的 Chrome 404 "This localhost page can’t be found"。
我的 index.html
在目录 MyApp/Pages/
中,我的客户端代码在 MyApp/wwwroot/app/
中。将 index.html
移动到 wwwroot
文件夹时,我什么也得不到。
在我的 Startup.cs
中,我是这样设置的:
public class Startup
{
// This method gets called by the runtime. Use this method to configure the HTTP request pipeline.
public void Configure(IApplicationBuilder app, IHostingEnvironment env)
{
if (env.IsDevelopment())
{
app.UseDeveloperExceptionPage();
}
else
{
app.UseExceptionHandler("/Error");
app.UseHsts();
}
app.UseHttpsRedirection();
app.UseStaticFiles();
var defaultFileOptions = new DefaultFilesOptions();
defaultFileOptions.DefaultFileNames.Clear();
defaultFileOptions.DefaultFileNames.Add("/index.html");
app.UseDefaultFiles(defaultFileOptions);
app.Use(async (context, next) =>
{
await next();
if (context.Response.StatusCode == 404 &&
!Path.HasExtension(context.Request.Path.Value))
{
context.Request.Path = "/index.html";
context.Response.StatusCode = 200;
await next();
}
});
app.UseCookiePolicy();
app.UseAuthentication();
app.UseMvc();
}
}
我尝试了很多指南,但似乎我能找到的大多数都非常过时,或者当我尝试使用帖子中的方法时,它们是我没有的方法。非常感谢任何帮助,因为我很想完成迁移并继续从事该项目。
使用此代码:
public void Configure(IApplicationBuilder app, IHostingEnvironment env)
{
if (env.IsDevelopment())
{
app.UseDeveloperExceptionPage();
app.UseBrowserLink();
}
else
{
app.UseExceptionHandler("/Error");
}
app.UseStaticFiles();
app.UseMvc(routes =>
{
routes.MapRoute(
name: "default",
template: "{controller}/{action=Index}/{id?}");
});
}
这里的问题是你有一个 SPA,并且 Angular 有它自己的路由,但是当你尝试使用 URL 这样的 https://localhost:5001/login 时,这条路由被提供通过 MVC 而不是通过 Angular,MVC 找不到合适的控制器,结果是 returns 404。
您应该做的是 return index.html 响应此类请求,以便 Angular 路由可以处理它。你可以看看这篇文章:
原来我的问题出在我处理 404 的方式上。我在我的 Startup.cs 中做了 context.Request.Path = "/index.html";
,但它仍然无法解决 html文件,所以我让它重定向回根路径:
app.Use(async (context, next) =>
{
await next();
if (context.Response.StatusCode == 404 &&
!Path.HasExtension(context.Request.Path.Value))
{
// This is what I changed. I need to resolve to "/" instead of "/index.html"
context.Request.Path = "/";
context.Response.StatusCode = 200;
await next();
}
});
感谢@Anton Danylov 的建议,让我重新审视那部分代码。
我一直在将一个项目从 .NET Framework 迁移到 .NET Core 2,过程比预期的要顺利,但是当我认为我已经克服了最困难的挑战时,我终生无法我让 SPA 方面开始工作。
当我启动该应用程序时,只要我转到根目录,它就可以正常工作(https://localhost:5001) and I can navigate with the Angular routing just fine. However if I try and load a page via a route, eg. https://localhost:5001/login,我得到一个通用的 Chrome 404 "This localhost page can’t be found"。
我的 index.html
在目录 MyApp/Pages/
中,我的客户端代码在 MyApp/wwwroot/app/
中。将 index.html
移动到 wwwroot
文件夹时,我什么也得不到。
在我的 Startup.cs
中,我是这样设置的:
public class Startup
{
// This method gets called by the runtime. Use this method to configure the HTTP request pipeline.
public void Configure(IApplicationBuilder app, IHostingEnvironment env)
{
if (env.IsDevelopment())
{
app.UseDeveloperExceptionPage();
}
else
{
app.UseExceptionHandler("/Error");
app.UseHsts();
}
app.UseHttpsRedirection();
app.UseStaticFiles();
var defaultFileOptions = new DefaultFilesOptions();
defaultFileOptions.DefaultFileNames.Clear();
defaultFileOptions.DefaultFileNames.Add("/index.html");
app.UseDefaultFiles(defaultFileOptions);
app.Use(async (context, next) =>
{
await next();
if (context.Response.StatusCode == 404 &&
!Path.HasExtension(context.Request.Path.Value))
{
context.Request.Path = "/index.html";
context.Response.StatusCode = 200;
await next();
}
});
app.UseCookiePolicy();
app.UseAuthentication();
app.UseMvc();
}
}
我尝试了很多指南,但似乎我能找到的大多数都非常过时,或者当我尝试使用帖子中的方法时,它们是我没有的方法。非常感谢任何帮助,因为我很想完成迁移并继续从事该项目。
使用此代码:
public void Configure(IApplicationBuilder app, IHostingEnvironment env)
{
if (env.IsDevelopment())
{
app.UseDeveloperExceptionPage();
app.UseBrowserLink();
}
else
{
app.UseExceptionHandler("/Error");
}
app.UseStaticFiles();
app.UseMvc(routes =>
{
routes.MapRoute(
name: "default",
template: "{controller}/{action=Index}/{id?}");
});
}
这里的问题是你有一个 SPA,并且 Angular 有它自己的路由,但是当你尝试使用 URL 这样的 https://localhost:5001/login 时,这条路由被提供通过 MVC 而不是通过 Angular,MVC 找不到合适的控制器,结果是 returns 404。
您应该做的是 return index.html 响应此类请求,以便 Angular 路由可以处理它。你可以看看这篇文章:
原来我的问题出在我处理 404 的方式上。我在我的 Startup.cs 中做了 context.Request.Path = "/index.html";
,但它仍然无法解决 html文件,所以我让它重定向回根路径:
app.Use(async (context, next) =>
{
await next();
if (context.Response.StatusCode == 404 &&
!Path.HasExtension(context.Request.Path.Value))
{
// This is what I changed. I need to resolve to "/" instead of "/index.html"
context.Request.Path = "/";
context.Response.StatusCode = 200;
await next();
}
});
感谢@Anton Danylov 的建议,让我重新审视那部分代码。