angular - UI 和 API 的两个独立解决方案

Question

我有一个非技术性的开箱即用问题，无法找到解决方案。

我在很多地方看到开发人员正在使用 Visual Studio Code 创建单独的 Angular 应用程序项目，并使用 Visual Studio 2019 IDE 为 .NET Core Web API 应用程序创建单独的项目。

我还发现在某些地方只有一种 .NET Core 解决方案，而我们也将 Angular 应用程序作为同一 Visual Studio 解决方案中的项目之一。我理解的一个优点是可以很容易地从前端调试 API 代码，同时后端 API 代码保持运行。

但是，当我们在前端使用 Angular，在后端使用 Web Api 时，哪一种是创建解决方案的好方法以及原因。抱歉，我是 Angular 的新手，所以试图理解这种差异。任何帮助将不胜感激。

Answer 1

您看到的方式(2 个独立的项目，一个在 Angular 的 VS 代码中，一个在 Visual Studio for .NET CORE 中)是绝对正确的。

原因有很多:

1 - Vscode 是前端开发的最佳编辑器之一，并且有大量 Angular 插件

2 - Visual Studio 。是 .NET 和 .NET 核心项目的最佳 IDE，具有漂亮的智能感知和许多其他 IDE 中找不到的功能。现在您也可以在 MAC 上使用它(https://visualstudio. microsoft.com/it/vs/mac/) ..但是对于前端来说它不如 vscode

3 - 您可以仅在前端或仅在后端工作，而无需加载所有项目。

4 - 如果您需要同时处理两者并调试所有堆栈，您可以毫无问题地完成(只需在后端启用 CORS)

您可以通过将此代码放入您的startupl.cs文件中的configureService方法put中来做到这一点

services.AddCors(options =>
            {
                options.AddPolicy("AllowAllOrigins",
                    builder =>
                    {
                        //builder.WithOrigins("https://yoursite.com",
                        //    "https://stage.yoursite.com",
                        //     
                        //    "https://www.yoursite.com");
                        builder
                                                .AllowAnyOrigin()
                        .AllowAnyHeader()
                        .AllowCredentials()
                        .WithExposedHeaders("Content-Disposition")
                        .AllowAnyMethod();
                    });
            });

然后在您的Configure方法中

 app.UseCookiePolicy();

            app.UseCors("AllowAllOrigins"); //<-- USE IT
            app.UseAuthentication();

希望对你有帮助!