zoukankan      html  css  js  c++  java
  • 利用Asp.Net Core MVC的Razor引擎来做前端模版

    单独版本的Razor用起来像是后妈生的

    Asp.Net Core MVC本身是用来写服务端的,我有一个奇葩的想法:我准备用来做前端模板引擎,把cshtml渲染成静态的html文件部署
    我不想学Vue或者React的原因竟然是害怕node_modules的文件数量会造成地球爆炸

    搞个扩展,用于输出模版字符串

    //https://stackoverflow.com/questions/40912375/return-view-as-string-in-net-core
    
    using Microsoft.AspNetCore.Hosting;
    using Microsoft.AspNetCore.Mvc;
    using Microsoft.AspNetCore.Mvc.Rendering;
    using Microsoft.AspNetCore.Mvc.ViewEngines;
    using Microsoft.AspNetCore.Mvc.ViewFeatures;
    using System.IO;
    using System.Threading.Tasks;
    
    public static class ControllerExtensions
        {
            public static async Task<string> RenderViewAsync<TModel>(this Controller controller, string viewName, TModel model, bool isPartial = false)
            {
                if (string.IsNullOrEmpty(viewName))
                {
                    viewName = controller.ControllerContext.ActionDescriptor.ActionName;
                }
    
                controller.ViewData.Model = model;
    
                using (var writer = new StringWriter())
                {
                    IViewEngine viewEngine = controller.HttpContext.RequestServices.GetService(typeof(ICompositeViewEngine)) as ICompositeViewEngine;
                    ViewEngineResult viewResult = GetViewEngineResult(controller, viewName, isPartial, viewEngine);
    
                    if (viewResult.Success == false)
                    {
                        throw new System.Exception($"A view with the name {viewName} could not be found");
                    }
    
                    ViewContext viewContext = new ViewContext(
                        controller.ControllerContext,
                        viewResult.View,
                        controller.ViewData,
                        controller.TempData,
                        writer,
                        new HtmlHelperOptions()
                    );
    
                    await viewResult.View.RenderAsync(viewContext);
    
                    return writer.GetStringBuilder().ToString();
                }
            }
    
            private static ViewEngineResult GetViewEngineResult(Controller controller, string viewName, bool isPartial, IViewEngine viewEngine)
            {
                if (viewName.StartsWith("~/"))
                {
                    var hostingEnv = controller.HttpContext.RequestServices.GetService(typeof(IHostingEnvironment)) as IHostingEnvironment;
                    return viewEngine.GetView(hostingEnv.WebRootPath, viewName, !isPartial);
                }
                else
                {
                    return viewEngine.FindView(controller.ControllerContext, viewName, !isPartial);
                }
            }
        }
    

    准备在这里写事件,把其他模版进行编译,每次按F5把所有的cshtml都保存成.html静态文件

    public class HomeController : Controller
        {
            public async Task<IActionResult> IndexAsync()
            {
                var html = await this.RenderViewAsync("~/Views/Home/Index.cshtml", new { });
                Console.WriteLine(html);
                return View();
            }
        }
    

    防止静态js css文件被缓存

    <script src="js/access.js" asp-append-version="true"></script>
    

    编译后将生成:

    <script src="js/access.js?v=5GEX-XriYrVTj0KQYUQLJAoF2R-D-CbE88HQqoWdk9g"></script>
    
  • 相关阅读:
    CSS躬行记(9)——网格布局
    CSS躬行记(8)——裁剪和遮罩
    CSS躬行记(7)——合成
    CentOS 系统目录解析
    Linux 命令快捷键
    秒的精确度
    Oracle和mysql中装逼dual表的用途介绍
    mysql 的mgr集群
    ansible笔记
    cygwin
  • 原文地址:https://www.cnblogs.com/trykle/p/13780811.html
Copyright © 2011-2022 走看看