如何将ASP Core Web API VueJS网站部署到IIS

时间:2020-06-12 00:08:47

标签: vue.js asp.net-core iis asp.net-web-api

一般来说,我是VueJS和SPA的新手。我创建了一个新的ASP Core站点,其中包含用于数据的WebAPI控制器和VueJS前端。我现在正在尝试将该站点部署到IIS,但不确定如何正确执行。我在IIS中创建了一个新应用程序,并将应用程序池设置为“无托管代码”,并将物理位置设置为VueJS应用程序/ dist文件夹。该网站正在加载中,但是我的所有服务调用都得到404。我认为这是因为网站的根目录设置为VueJS应用程序文件夹,而不是ASP Core文件夹的根目录。我该如何正确设置以从myServer / mySite为我的应用程序提供服务,并使服务端点为myServer / mySite / api / myController / myAction?

1 个答案:

答案 0 :(得分:2)

方案:您的dotnet核心应用程序具有API端点,并且您希望将客户端站点SPA托管在同一站点上。 API调用将进入dotnet应用程序,其他任何请求都将服务于SPA的index.html。

.NET核心使用Microsoft.AspNetCore.SpaServices命名空间中的方法,例如UseSpa()

来支持这种情况。

还请注意,在.NET 5中,这些扩展名移至单独的程序包Microsoft.AspNetCore.SpaServices.Extensions中。它现已上市,但记录不充分。

在此示例中,您的构建SPA应该进入ClientApp/dist

例如

using Microsoft.AspNetCore.SpaServices;

public class Startup
{
    // ...

    public void ConfigureServices(IServiceCollection services)
    {
        // In production, the SPA files will be served from this directory
        services.AddSpaStaticFiles(configuration =>
        {
            configuration.RootPath = "ClientApp/dist";
        });
    }

    public void Configure(IApplicationBuilder app, IHostingEnvironment env)
    {
        // ...

        app.UseStaticFiles();
        app.UseSpaStaticFiles();

        app.UseMvc();

        // Must be near the end of the method because 
        // it will send any unhandled requests to index.html for SPA
        app.UseSpa(spa =>
        {
            spa.Options.SourcePath = "ClientApp";

            if (env.IsDevelopment())
            {
                // Development requests are send through to local node server
                spa.UseProxyToSpaDevelopmentServer("http://localhost:8080/");
            }
        });
    }
}