C# 从数据库初始化的less.css变量_C#_Css_Less

C# 从数据库初始化的less.css变量

c# css less

C# 从数据库初始化的less.css变量,c#,css,less,C#,Css,Less,我正在为asp.netweb表单应用程序使用dotnetless（），它工作得非常好。我喜欢使用颜色、字体大小等变量，但就我所知，变量值是静态的是否有任何方法可以使用dotnetless根据用户ID从数据库中初始化这些变量值基本上我想把这个web应用程序转换成一个基于主题的网站，这样每个用户都可以选择自己的颜色、字体、字体大小等任何方向都将受到极大的欢迎。这肯定是可能的，但不幸的是，您无法从LESS本身查询数据库，因此您基本上需要为用户编写LESS文件，并使用所需的变量值，然后加载它您可

我正在为

asp.net

web表单应用程序使用dotnetless（），它工作得非常好。我喜欢使用颜色、字体大小等变量，但就我所知，变量值是静态的

是否有任何方法可以使用dotnetless根据用户ID从数据库中初始化这些变量值

基本上我想把这个web应用程序转换成一个基于主题的网站，这样每个用户都可以选择自己的颜色、字体、字体大小等

任何方向都将受到极大的欢迎。

这肯定是可能的，但不幸的是，您无法从LESS本身查询数据库，因此您基本上需要为用户编写LESS文件，并使用所需的变量值，然后加载它

您可以从这里的另一个答案中找到一个示例：

最简单的解决方案可能是在网页中内联较少的代码：（如上所述）


//这里的DB和用户相关代码
...

这样，您就可以像自定义网页一样自定义较少的样式表

如果要使用无点编译的CSS，可以将自定义样式表传递给无点解析器：

Less.Parse(".foo { font-size: <user-dependent-value>;}")

Less.Parse（“.foo{font size:；}”）

然后，您需要将编译后的CSS输出直接包含在您的网页中：

<html>
  <head>
    <style type="text/css">
      // result of Less.Parse(...)
    </style>
  </head>
  ...
</html>


//Less.Parse（）的结果
...

这取决于你将拥有多少主题。如果数量有限，最好（从性能和复杂性两方面考虑）将用户映射到预编译的主题之一

但是，如果您允许每个用户自定义主题，以便有许多（或无限数量）主题，那么最好在更改主题时构造、编译、优化.less（或CSS）文件并保存结果。在每次页面加载时，您都会引用该主题文件，直到用户选择新主题为止。最好的情况是，它会在用户系统中缓存很长一段时间

除非是少量定制的LESS/CSS，否则我将避免内联CSS路由。它会增加每个页面的文件大小/带宽，因此在移动设备上的加载速度较慢。相反，我将使用最近的bundle来帮助您在主题更改时构建、编译和优化LESS->CSS并缓存结果

因此，在页面加载时，大多数页面都会引用数据库中保存的现有自定义页面主题。更改主题后，您将经历完整的less->css过程。

我认为，如果这是您想要采用的路径，那么您应该创建一个IHttpHandler来替换无点SCSSHttpHandler。此处理程序将执行与lesssshttphandler基本相同的操作，但会在编译为css之前将数据库变量插入less

您可以查看使用dotless进行较少翻译的LESS项目。它也有一个IHttpHandler，你可以根据它来选择

正如其他人所说，这可能不是最好的行动方针

编辑： 处理程序的基本起点

public class LessHandler : IHttpHandler
{
    public void ProcessRequest(HttpContext context)
    {
        var request = context.Request;
        var response = context.Response;
        var user = context.User;

        string assetUrl = request.Url.LocalPath;
        string assetPath = context.Server.MapPath(assetUrl);

        //load less file into the data.
        var data = "";
        using (var file = new StreamReader(assetPath))
        {
            data = file.ReadToEnd();
        }

        DotlessConfiguration lessEngineConfig = DotlessConfiguration.GetDefault();
        lessEngineConfig.MapPathsToWeb = false;
        lessEngineConfig.CacheEnabled = false;
        lessEngineConfig.DisableUrlRewriting = false;
        lessEngineConfig.Web = false;
        lessEngineConfig.MinifyOutput = true;
        lessEngineConfig.LessSource = typeof(VirtualFileReader);
        var lessEngineFactory = new EngineFactory(lessEngineConfig);
        ILessEngine lessEngine = lessEngineFactory.GetEngine();

        string vars = "";
        //TODO set default for vars
        if (user != null)
        {
            //TODO get vars for user
        }

        var content = lessEngine.TransformToCss(string.Format("{0}{1}", vars, data), null);

        // Output text content of asset
        response.ContentType = "text/css";
        response.Write(content);
        response.End();
    }

    public bool IsReusable
    {
        get { return true; }
    }
}

为什么不创建一个自定义的.LESS插件，其中包含执行所需查找的函数

如图所示，对下面的代码进行了测试。我实际上并没有在数据库中查找数据，但所有必要的信息都应该可用。我验证了在网站上以Windows身份验证模式运行时，我能够通过

HttpContext.current.user.Identity.Name

检索当前用户

要使用下面的函数，请在less文件中键入如下内容：

--lookup using custom function (hit db)
@brand_color:getCustomColor(usersThemeAttribute);

--then use the variable like normal
color: @brand_color;

代码

[DisplayName("UserProfilePlugin")]
public class UserProfilePlugin : IFunctionPlugin
{
    public Dictionary<string, Type> GetFunctions()
    {
        return new Dictionary<string, Type> 
        {
            { "getCustomColor", typeof(GetCustomColorFunction) }
        };
    }
}

public class GetCustomColorFunction : Function
{
    protected override Node Evaluate(Env env)
    {
        Guard.ExpectNumArguments(1, Arguments.Count(), this, Location);
        Guard.ExpectNode<Keyword>(Arguments[0], this, Arguments[0].Location);
        //the idea is that you would have many colors in a theme, this would be the name for a given color like 'bgColor', or 'foreColor'
        var colorAttrName = Arguments[0] as Keyword;

        //Lookup username
        // string username = HttpContext.Current.User.Identity.Name;

        //perform some kind of DB lookup using the username, get user theme info
        // UserProfile up = new UserProfile();
        // System.Drawing.Color c = up.GetColorByAttribute(colorAttrName.Value);
        //return the appropriate color using RGB/etc...
        // return new Color(c.R, c.G, c.B);
        return new Color(129, 129, 129);
    }
}

[DisplayName（“UserProfilePlugin”）]
公共类UserProfilePlugin:IFunctionPlugin
{
公共字典GetFunctions（）
{
返回新词典
{
{“getCustomColor”，typeof（GetCustomColorFunction）}
};
}
}
公共类GetCustomColorFunction:函数
{
受保护的覆盖节点求值（Env Env）
{
ExpectNumArguments（1，Arguments.Count（），this，Location）；
ExpectNode（参数[0]，此，参数[0]。位置）；
//这个想法是，一个主题中有许多颜色，这将是一个给定颜色的名称，如“bgColor”或“foreColor”
var coloratrname=参数[0]作为关键字；
//查找用户名
//字符串username=HttpContext.Current.User.Identity.Name；
//使用用户名执行某种DB查找，获取用户主题信息
//UserProfile up=newuserprofile（）；
//System.Drawing.Color c=up.GetColorByAttribute（colorAttrName.Value）；
//使用RGB/etc返回适当的颜色。。。
//返回新颜色（c.R、c.G、c.B）；
返回新颜色（129、129、129）；
}
}

要注册插件，请将其添加到web.config：

<dotless cache="false" >
    <plugin name="UserProfilePlugin" assembly="Your.Assebly.Name" />
</dotless>

考虑禁用无点缓存，以便用户所做的更改立即生效

链接：

这意味着应该为我的变量文件实现这个IFileReader。这个文件阅读器就像一个处理器，将无点等待我的进程。对不起，我只是不明白它将如何适应服务器端的无点进程。请你给我解释一下好吗。此解决方案是否适用于每个用户。谢谢你给我这个指导。基本上每个用户都会有一个带有不同变量的自定义.less文件。该文件是在单独的过程中编写的，可能是在用户创建/编辑其主题时编写的。有道理吗？这就是维护问题。我的想法更像是，没有任何文件等，我们无法拦截无点处理器并初始化每个用户的变量。我真的非常感谢您的帮助。非常感谢。是的，那是我唯一能想到的办法。如果您不想使用任何文件等，您可以始终以内联方式加载变量CSS@JesúsCarrera-你可以用它做任何你想做的事情。如果你愿意做一个自定义函数，就可以少做一些

<dotless cache="false" >
    <plugin name="UserProfilePlugin" assembly="Your.Assebly.Name" />
</dotless>