我正在启动一个新的网络应用程序。后端是c# .net core,前端是一个react应用程序,通过webpack放置在wwwroot中。 Web 应用程序的管理员可以更改一些颜色(按钮颜色、标题颜色等)。这些颜色保存在数据库中,并且应注入(inject)样式表中。生产样式表看起来像
.my-button {
background: ##main-color##
}
当CSS提供时,我想用数据库中保存的颜色替换##main-color##。
在启动时,我尝试在请求管道上添加中间件。然而,这里永远不会触发对 css 文件的请求。
在之前的应用程序中,我使用了完全相同的设置,只是使用了 .net 框架而不是 .net core。我在请求管道上使用了重写规则和中间件。然后中间件检查是否请求了 css 文件。在这种情况下,我读取内存中的 css 文件并在写入响应之前进行字符串替换。
我正在努力让它在 .net core 中工作,我想知道我应该如何实现类似上面的东西?
最佳答案
我不会在运行时更改它。我会设置一个自动部署过程,在部署之前更新您的 css 文件。您可以在 Azure Devops(或 TFS)中使用此插件:https://marketplace.visualstudio.com/items?itemName=qetza.replacetokens
但是其他 CI-CD 系统也能够完成这些类型的任务,也许需要一些手动脚本。
但是如果你仍然想在启动过程中更新你的css文件。我会更新program.cs
public class Program
{
public static void Main(string[] args)
{
var myColors = new Dictionary<string,string>();
try{
var connectionString = Environment.GetEnvironmentVariable("CssDBConnection");
//select values from DB into the dictionary
myColors = GrabCssColorsFromDatabase(connectionString);
}catch(Exception e){
//use default css values in the dictionary
}
finally{
InjectCss(myColors);
BuildWebHost(args).Run();
}
}
这与 Nlogs 非布局目标的解决方法类似: https://github.com/NLog/NLog/wiki/WebService-target---Workaround-for-url-variables
如果您想即时更新它(没有新的部署)。 提供一个 IActionResultEndpoint,它返回注入(inject)的 CssFile。
端点可以是/Home/Styles 再说一遍:
- 从数据库获取变量或后备值
- 获取您的“cssTemplate”
- 注入(inject)变量
- 返回生成的 css 文件(作为 FileResult)
- 您的 UI 应从此端点获取样式,而不是文件
关于c# - 在 .net core/webpack Web 应用程序中注入(inject) css 样式的最佳实践,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57722486/