移花接木：藉助 IViewLocationExpander 更換 ASP.NET Core View Component 視圖路徑

端午節在家將一個 asp.net 項目向 asp.net core 遷移時遇到了一個問題，用 view component 取代 Html.RenderAction 以後，運行時 view component 找不到視圖文件。

System.InvalidOperationException: The view 'Components/AggSitePostList/PostList' was not found. The following locations were searched:
/Views/AggSite/Components/AggSitePostList/PostList.cshtml
/Views/Shared/Components/AggSitePostList/PostList.cshtml
/Pages/Shared/Components/AggSitePostList/PostList.cshtml
   at Microsoft.AspNetCore.Mvc.ViewEngines.ViewEngineResult.EnsureSuccessful(IEnumerable`1 originalLocations)
   at Microsoft.AspNetCore.Mvc.ViewComponents.ViewViewComponentResult.ExecuteAsync(ViewComponentContext context)
   at Microsoft.AspNetCore.Mvc.ViewComponents.DefaultViewComponentInvoker.InvokeAsync(ViewComponentContext context)

原先用的是 Html.RenderAction ，視圖都放在 Controller 對應的視圖路徑，對於 AggSiteController ，Html.RenderAction 的視圖都放在 /Views/AggSite/ 文件夾中，換成 view component 以後，在 AggSiteController 中運行的 view component 卻把 /Views/AggSite/ 置之度外，不把這個路徑列爲視圖文件查找範圍。因爲視圖文件比較多，一個一個建立文件夾並移動視圖文件比較麻煩，view compoent 這種不夠大度的特性讓遷移進程受阻。

有沒有什麼方法能夠讓將 /Views/AggSite/ 歸入 view component 搜索視圖的範圍，讓其變得更加寬容呢？

網上搜索後得知原來 ASP.NET Core 料事如神，早已料到這種狀況，經過 IViewLocationExpander 提供了對應的擴展能力。

對於這裏遇到的問題，只需實現 IViewLocationExpander 接口，在 ExpandViewLocations 方法中添加新的視圖路徑。

public class ComponentViewLocationExpander : IViewLocationExpander
{
    public IEnumerable<string> ExpandViewLocations(ViewLocationExpanderContext context, IEnumerable<string> viewLocations)
    {
        if (context.ControllerName + "Controller" == nameof(AggSiteController)
            && viewLocations.Any(l=>l.Contains("Components/")))
        {
            var vcLocation =  "/Views/AggSite/{0}" + RazorViewEngine.ViewExtension;
            viewLocations.ToList().Add(vcLocation);
            return viewLocations;
        }

        return viewLocations;
    }

    public void PopulateValues(ViewLocationExpanderContext context) { }
}

而後在 Startup.ConfigureServices 在註冊一下

services.Configure<RazorViewEngineOptions>(o =>
{
    o.ViewLocationExpanders.Add(new ComponentViewLocationExpander());
});

原覺得這種臨時鋪路的變通方法能夠輕鬆搞定問題，但實際運行時發現問題依舊，此路不通。

被迫在 ComponentViewLocationExpander 中埋點排查問題，埋點日誌打印出來後立馬發現了其中的蹊蹺。

ViewName: Components/AggSitePostList/PostList
viewLocations: /Views/{1}/{0}.cshtml;/Views/Shared/{0}.cshtml;/Pages/Shared/{0}.cshtml

原來 view component 的路徑信息包含在 ViewName 中，並無包含在 viewLocations 中，難怪以前的臨時鋪路無論用。

ViewName 中居然包含視圖文件的路徑信息，這種偷懶、投機取巧形成的名不符實，很容易誤導人。

知道了問題的真正緣由後解決起來就不難了。臨時鋪路行不通，移花接木任我行，直接修改 ViewName 生成新的 viewLocations 便可。

public class ComponentViewLocationExpander : IViewLocationExpander
{
    public IEnumerable<string> ExpandViewLocations(ViewLocationExpanderContext context, IEnumerable<string> viewLocations)
    {
        if (context.ControllerName + "Controller" == nameof(AggSiteController)
            && context.ViewName.Contains("Components/"))
        {
            var viewName = context.ViewName.Substring(context.ViewName.LastIndexOf("/") + 1);
            return new string[] { "/Views/AggSite/" + viewName + RazorViewEngine.ViewExtension };
        }

        return viewLocations;
    }

    public void PopulateValues(ViewLocationExpanderContext context) { }
}