如何为SaaS解决方案添加白名?

时间:2014-05-04 14:14:58

标签: javascript themes customization saas white-labelling

我正在构建SaaS产品,其中一个最重要的客户要求是允许他们使用白色标签。

  • 客户域
  • 在UI中包含客户徽标
  • 更改颜色方案以匹配客户品牌

在需要完成的所有事情中,我认为最容易掌握的部分是设置自定义子域(我在AppEngine上运行,但在任何服务器设置上它都非常简单)。

我的主要问题围绕前端造型的最佳实践。我的设置要求我定义颜色以覆盖CSS规则和覆盖Javascript变量。我所做的假设是我将任何图像资产/路径和颜色信息存储在数据库中。这些是我考虑的两条路径,但两者似乎都有相当严重的缺陷。

  1. 部署任务 - 在部署之前,运行Grunt(或其他自动化)任务,从数据库中提取客户样式信息并根据
  2. 创建自定义CSS / JS文件
  3. 运行时 - 在应用程序引导期间,从db中提取客户信息并动态覆盖样式(内联样式,JS覆盖等)
  4. 我已经看了很多建议或其他经历并且空洞。白标的最佳做法是什么?我应该继续沿着这两条路径中的一条走路还是有更好的选择?我应该注意哪些陷阱?是否存在对不同选项的性能影响?

    这个问题是有目的的语言和框架无关的,因为基本原则应该是相同的,无论它是如何实现的。

1 个答案:

答案 0 :(得分:4)

我在使用LESS之前实现了这个:

我们首先更新了所有CSS文件以使用LESS。基于每个客户的所有必要颜色都使用了LESS变量。我们称主要较少的站点文件为“main.less”。

当用户登录我们的系统时,它会从数据库中获取与客户主题相关的信息,并将其转换为LESS变量表示法。然后,它将获取main.less内容的副本,并将特定于客户端的较少变量添加到其中,然后将其写入特定于客户端的.less文件(client-a.less)。然后我们的系统会将其编译成一个css文件(client-a.css),然后我们的系统会包含在每个页面请求中(例如,我们的系统将根据客户端名称知道编译的css文件的名称)。 / p>

此方法将导致为每个客户端创建唯一的.less和.css文件,并且每次请求页面时都会减少从数据库调用客户端特定主题详细信息的任何需要,因为此编译过程仅在每次登录。

您可以通过序列化已编译的less文件(client-a.less)并将其存储为.cache文件来节省更多服务器资源。现在,当每个用户登录到您的系统时,您可以将要编译的内容序列化为client-a.less,将其与.cache文件进行比较,如果不同则继续编译client-a.css文件。如果没有区别,则无需编译css文件。