在前端开发中，经常需要使用 oEmbed 协议来获取外部媒体资源，如视频、音频、图片等。而在实现 oEmbed 协议前，我们需要先选择一个符合规范的 npm 包。这里推荐 @activelylearn/oembed 包。
@activelylearn/oembed 是什么
@activelylearn/oembed 是一个符合 oEmbed 协议的 npm 包，可以用来获取并解析支持 oEmbed 协议的网站的媒体资源信息。它包含以下特性：
- 支持的 oEmbed 协议版本：1.0、1.0a、1.1、2.0；
- 可以解析多种格式的媒体资源，如视频、音频、图片等；
- 支持缓存，可以设置缓存过期时间和媒体资源的最大大小限制。
如何使用
安装
在命令行工具中输入以下命令进行安装：
npm install @activelylearn/oembed
使用示例
引入包
在需要使用的 js 文件中，引入包：
const oembed = require('@activelylearn/oembed');解析媒体资源信息
-- -------------------- ---- ------- ----- --- - ---------------------------------------------- ----- ------- - - ------------- ---- - ----- -- ----------- ------------- ----- -- ------ -- --------------- --------------------- -- - ------------------- ---------------- -- - --------------------- ---
以上代码使用了 @activelylearn/oembed 包中的 get() 方法，该方法用于获取并解析指定 url 的媒体资源信息。其中，第二个参数 options 为可选项。maxMediaSize 指定了媒体资源的最大大小限制，单位为字节；cacheTimeout 指定了缓存过期时间，单位为秒。
现在，我们来运行一下代码，看看控制台输出了什么：
-- -------------------- ---- ------- - ----- -------- ------ --------- ---------- --- ------------ ---- --- -------- ------- ------- --- ---------- ----------- ------------------------------------------------- -------------- ---------- ------------- --------------------------- -------------- --------------------------------------------------- ---------------- ---- ----------------- ---- ------ ---- ------- ---- ----- -------- ----------- ------------ -------------------------------------------------------------- --------------- ---------------- ---------------- -------------------------- -
我们可以看到，输出了一个媒体资源的对象。其中包含了媒体资源的类型、标题、作者、提供者、缩略图地址、尺寸和代码等信息。这就是 @activelylearn/oembed 包帮我们获取并解析外部媒体资源的能力。
结论
@activelylearn/oembed 是一个符合 oEmbed 协议的 npm 包，使用方便、功能强大，可以帮助我们获取并解析外部媒体资源。在实际开发中，我们可以通过 @activelylearn/oembed 包来简化 oEmbed 协议的实现，提高开发效率。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/600558ee81e8991b448d6410