1.0.1 • Published 3 years ago

docsify-codeblock-iframe v1.0.1

Weekly downloads
6
License
MIT
Repository
github
Last release
3 years ago

docsify-codeblock-iframe

version download cnpmVersion cnpmDownload jsdelivr

一个通过markdown扩展语法为docsify提供更加安全进行iframe渲染的插件

简体中文 | English

体验一下

Demo

使用方法

插入script标签引用

<script src="//cdn.jsdelivr.net/npm/codeblock-iframe@latest/dist/index.min.js"></script>
<script src="//cdn.jsdelivr.net/npm/docsify-codeblock-iframe@latest/dist/index.min.js"></script>

src符合下面的格式才会被支持

www.baidu.com
//www.baidu.com
http://www.baidu.com
https://www.baidu.com
  • iframe属性
属性名
src
height
width
align
frameborder
longdesc
marginheight
marginwidth
name
sandbox
scrolling
seamless
srcdoc
textContent

为什么要写这个库

讲道理, Markdown原生就支持HTML! 但是下面场景我们会遇到一些问题:

  1. 如果我不想让我的用户通过iframe给我们的网站插入广告, 但是我们支持他们用codepen来分享自己的代码, 咋办?
  2. 有时候我们想在一些markdown编辑器中插入iframe。为了即时渲染, 浏览器会在我们输入的时候发送大量的GET请求给我们的目标网站, 我们如何去做优化?甚至于当我们开发的时候开启SSR渲染页面, 可能会导致页面崩溃

怎么实现

代码块渲染对我们拓展markdown原生语法非常简单, 所以我们可以通过上面的策略来限制iframe渲染的频率

感谢

  • iarna-toml: Better TOML parsing and stringifying all in that familiar JSON interface.