在编写前端网页时，我们经常需要动态获取其他网站的元数据信息，如 title、description、image 等。这时我们可以使用 npm 包 get-meta-url。
安装
在命令行中输入以下命令进行安装：
--- ------- ------------
使用方法
引入
在使用时，先引入 get-meta-url：
----- ---------- - -----------------------
传参
使用 getMetaUrl() 方法获取元数据，需要传入两个参数：
- URL：表示需要获取元数据的网站地址
- Options（可选）：表示一些额外的配置，如指定请求头、超时时间等等。
----- --- - ------------------------
----- ------- - -
-------- -
------------- ------------ -------- -- ----- ------ ---- ------------------ ------- ---- ------ -------------------- --------------
--
-------- ----
-
--------------- --------
---------- -- -
-----------------
--
---------- -- -
------------------
--其中，headers 对象是指定请求头的设置，可以模拟浏览器访问，这样有些网站才能正常返回数据。timeout 是指定请求超时时间，单位为毫秒。
返回数据
getMetaUrl() 方法会返回一个 Promise 对象，当成功获取到元数据时，会返回一个包含以下属性的 meta 对象：
- ------ ------- -- ---- ------------ ------- -- ---- ------ ------- -- ------- ---- ------ -- ---- -
如果获取失败，则会返回一个带有 error 属性的 error 对象。
示例
以获取百度首页的元数据为例：
----- ---------- - -----------------------
----- --- - ------------------------
----- ------- - -
-------- -
------------- ------------ -------- -- ----- ------ ---- ------------------ ------- ---- ------ -------------------- --------------
--
-------- ----
-
--------------- --------
---------- -- -
-----------------
--
---------- -- -
------------------
--输出结果如下：
- ------ ------------ ------------ ---------------------------------------------------------------- ------ ---------- ---- ------------------------ -
结语
get-meta-url 是一个可以帮助我们在前端网页中获取其他网站元数据的工具，通过学习本篇文章，我们可以掌握它的使用方法，并在实际开发中有所应用。当然，这只是前端技术中的一个小小方面，我们需要继续深入学习和实践，才能成为更优秀的前端开发者。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/60066b5951ab1864dac66e59