转到Azure门户并创建Azure网站-

然后在设置中设置一个额外的应用程序，如下所示-

现在在VisualStudio解决方案中创建两个项目-> 1）MVC和2）WebApi

下载上面创建的Azure网站的publishsettings文件。将publishsettings文件导入到Visual studio MVC项目发布中，如下所示-

对于WebApi项目，导入相同的发布设置，但创建一个新路径为website/webapi。

发布这两个项目。
现在，导航到http：//{yoursite}.azurewebsites.net以获取MVC站点。并导航到http：//{yoursite}.azurewebsites.net/webapi/api以获取WebApi。

基本上，这需要以下步骤来完成，使其工作。
溶液包含
i）sampleApp.API（.Net Core Web API）将部署在子文件夹中
ii）sampleApp.UI（Angular App）
为两个应用程序设置Azure门户
1)在Azure门户->设置->配置中转到您的Web应用
2)选择路径Map并在此为子站点创建新的Map条目。添加此条目时不要选中目录复选框以保持其为虚拟应用程序类型。单击保存

**Virtual Path:** /{folderName}            **physicalPath:**  /site/wwwroot/{folderName}

3)现在转到VS 2017右键单击API项目并单击发布
4)在发布设置窗口中将路径设置为

site name : existing + "/{folderName} "
DestinationUrl : existing + "/{folderName} "

5)现在ng-build --prod你的angular app并部署dist/clientApp文件夹，并使用根路径发布。
所以现在两者都应该

angular app https://{AzureAppName}.azurewebsites.net

Web API https：//{AzureAppName}.azurewebsites.net/{folderName}/api/{controllerName}/{action}

如果用户在访问API项目或获取错误代码502时仍然面临“无法从web.config读取配置数据”的问题，则
为此，在API项目中转到startup.cs并将configure函数更改为具有以下代码行

app.Map('/{folderName}', app1 => Configure1(app1, loggerFactory);

然后创建一个空拷贝的configure函数，并如上所述重新部署您的API项目。

public void Configure1(IApplicationBuilder app, ILoggerFactory loggerFactory)
        {
            //keep it blank
        }