植入式Web前端开发
在博客园、凡科建站和其他的一些CMS系统中,提供有允许管理者向网页中插入自定义HTML代码的功能,我将其称之为“植入式”的Web前端代码。
因为CSS和JavaScript可以直接嵌入在HTML中,也可以使用HTML标签<link rel="stylesheet">
和<script>
来引入其文件,所以允许插入自定义HTML代码,其实就是允许使用任何前端资源。根据系统的不同,植入式的代码一般都会允许HTML和CSS,但不一定会允许JavaScript(过滤掉<script>
)。如果允许JavaScript,则自定义代码能做的事情的范围会极大地扩展。
在可植入并运行自定义JavaScript代码的情况下,几乎只要是在前端范畴内的能力,就都可以实现。除了常见的在局部用JavaScript优化页面原有的功能、添加新的功能之外,理论上,甚至完全可以把整个DOM树替换掉,换成与原页面内容完全不同的全新页面表现。比如现在这篇文章的页面,我完全可以通过植入的代码,令其最后展现给读者的是一个Web游戏应用程序。
当然,这种模式并不是随心所欲的,它有着诸多的限制,比如性能(原页面的所有资源都仍然要加载)、SEO(原页面的HTML仍然都在)等,限制的主要原因都是原页面代码始终都在,植入的代码只能在页面载入一段时间之后才能开始起作用。本质上,植入代码只是对前端的某个范围内可以做到一些灵活,获得一些掌控权,对后端,除了植入操作本身以外,没有任何影响。
所以可见,其实本质上植入代码的能力不过是正常的前后端能力的子集,虽然它确实能在某个范畴内玩出花来,但一般没什么人愿意这么做——真到要玩花的程度,走能控制后端的方案显然会更好。
因此,这种模式基本上仅用于在必要时,做页面局部的调整、优化或新增功能。比如凡科商城这种在线的CMS平台,管理员对Web后端没有控制权,系统提供的常规定制选项又无法满足需求,就必须通过这种手段来做二次开发了。
继续阅读:植入式Web前端开发方法