在AspNet Core应用程序中,使用Angualr CLI工具进行访问时,某些情况下会存在单独部署模板的问题,如下所示:
"start": "ng serve",
"build": "ng build --prod",
如果使用上述代码的配置,那么将会出现跨域访问的问题,我们需要配置代理以解决这个问题。
在AspNet Core中的Startup.cs文件中,使用以下代码(修改apiUrl为你的应用程序URL)进行配置:
public void Configure(IApplicationBuilder app, IHostingEnvironment env)
{
if (env.IsDevelopment())
{
app.UseDeveloperExceptionPage();
}
else
{
app.UseExceptionHandler("/Error");
}
app.UseStaticFiles();
app.UseMvc();
// Configure Angular routing
app.MapWhen(x => !x.Request.Path.Value.StartsWith("/api"), builder =>
{
builder.UseMvc(routes =>
{
routes.MapSpaFallbackRoute(
name: "spa-fallback",
defaults: new { controller = "Home", action = "Index" }
);
});
});
// Configure proxy to Angular dev server
app.UseProxyToSpa(new Uri("http://localhost:4200"), new TimeSpan(0, 0, 90));
}
以上代码配置了一个代理将所有除/api以外的请求转发到Angular开发服务器。
接下来,我们需要将Angular的代理配置文件修改为:
{
"/api": {
"target": "http://localhost:5000",
"secure": false
}
}
这个代理配置将AspNet Core应用程序中的所有/api请求转发到目标URL。最后,我们需要运行npm start以启动AspNet Core应用程序和Angular开发服务器。
完成以上配置后,就可以在本地开发环境中使用和调试了,而且可以解决单独部署模板的问题。