前言
在前端开发中，我们经常需要将嵌入到网页中的链接转换成富文本来渲染。Embedly是一个非常好用的npm包，它可以帮助我们在网页中将链接转为富文本呈现出来。本篇文章将详细介绍如何使用Embedly，希望可以对开发者们有所帮助。
安装
直接通过npm安装即可：
npm install embedly
使用方法
在需要的页面引入Embedly包：
import Embedly from 'embedly';
接着在需要使用的地方调用Embedly的方法，并传入要呈现的链接：
-- -------------------- ---- ------- ----- ------- - --- --------- ---- ---------------------- --- ----------------- ---- ------------------------- --------- ---- --------- ---- ---------------- - -- ------- -- -------------- - -- ---- --
在这里，我们先通过Embedly的构造函数传递了我们的Embedly API密钥，这样Embedly就可以正确地处理我们的请求。接着调用extract()方法，并传递链接并可选参数，如maxwidth和autoplay。extract()方法将返回一个promise对象，我们可以通过then()方法来获取响应的数据，或通过catch()方法来捕获任何错误。
可选参数
以下是extract()方法中可选参数的一些介绍：
maxwidth
该选项指定了Embedly可以从内容提取的最大宽度（以像素为单位），这样可以使嵌入物保持在合适的大小，并有助于页面加载速度优化。
autoplay
该选项指定了是否自动播放嵌入的内容。默认情况下，此选项将被
youtube
和vimeo
的视频使用。
更多的可选参数可以查看官方文档：https://api.embedly.com/docs/extract
响应数据格式
由于我们调用的是extract()方法，因此响应数据将是一个对象，其中包含以下属性：
title:页面的标题。description:页面的描述。type:页面的内容类型，如“video”、“image”、“link”。thumbnail_url:缩略图的URL。original_url:页面的原始URL。url:页面的可以展示的URL。provider_display:与页面相关的服务提供商名称。provider_name:提供服务的名称。provider_url:关联的服务提供商URL。favicon_url:页面的Favicon URL。media:与页面相关的媒体。images:页面的映像列表。
示例代码
-- -------------------- ---- ------- ------ ------- ---- ---------- ----- ------- - --- --------- ---- ---------------------- --- ----------------- ---- ------------------------- --------- ---- --------- ---- ---------------- - ------------------ -- -------------- - ------------------- --
总结
Embedly是一个非常方便且易用的npm包，它能够帮助我们快速地将网页链接转换成富文本，提升用户体验。在实际开发中，我们可以根据具体的需求配置不同的参数，来获取我们需要的响应数据。希望这篇文章对大家有所帮助！
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/109067