npm 包 oembed-providers-unofficial 使用教程

oembed-providers-unofficial 是一款基于 npm 包的 oEmbed 提供商库,它包含了超过 500 多个社交媒体平台,如 YouTube、Twitter、Instagram、Vimeo 等提供商的 oEmbed 信息。今天,我们将学习如何使用 oembed-providers-unofficial npm 包。

安装

运行以下命令可以全局安装 oembed-providers-unofficial:

--- ------- -- ---------------------------

也可以将其作为项目依赖进行安装:

--- ------- ------ ---------------------------

导入 oembed-providers-unofficial 模块

要在项目中使用 oembed-providers-unofficial,我们需要首先导入这个模块。可使用以下命令:

--- --------------- - ---------------------------------------

获取所有的提供商信息

使用 providers 关键字可以获取所有的提供商信息。对返回的数组进行遍历,我们可以获得数组中每个元素的提供商信息并且操作这些内容。可以使用以下代码:

------------------------------------------ -- -
  ------------------------------------
---

根据 URL 获取提供商信息

oembed-providers-unofficial 还允许我们根据 URL 获取 oEmbed 提供商的信息。使用 getProviderByUrl(url) 方法可以实现这个目的。例如:

--- -------- - --------------------------------------------------------------------------------
------------------------------------

将会输出 'YouTube'。

重写 oEmbed URL

有时候,我们可能需要对 oEmbed URL 进行重写以使用不同的查询参数或 ISO 语言代码。 oembed-providers-unofficial 还提供了一种简便的方式来实现这个目的。使用 rewriteUrl(url, options) 方法可以重写 URL。这里的 options 参数包含两个属性: localeembedlocale 用于指定 ISO 语言代码,而 embed 则是一个关键字,用于指定重写 URL 时返回 embed 代码而不是 oEmbed URL。例如:

--- ------- - -
  ------- --------
  ------ ----
--

--- ------------ - ------------------------------------------------------------------------- ---------
--------------------------

将会输出 '//www.youtube.com/embed/dQw4w9WgXcQ?hl=zh-CN'

总结

oembed-providers-unofficial 是一款使用方便的 npm 包,它可以帮助我们轻松地获取超过 500 多个社交媒体平台的 oEmbed 提供商信息。在本文中,我们学习了如何安装和使用这个有用的 npm 包。通过实践,您将能更好地理解 oEmbed 并在您的项目中使用它。

来源:JavaScript中文网 ,转载请联系管理员! 本文地址:https://www.javascriptcn.com/post/60066fad3d1de16d83a671f8


猜你喜欢

  • npm 包 redux-simple-actions 使用教程

    简介 redux-simple-actions 是一个简单易用的 npm 包,用于在 Redux 中定义和管理 action。它可以帮助前端开发者更简洁地编写 Redux 代码,减少冗余和重复的代码。

    4 年前
  • npm 包 reduce-right-async 使用教程

    介绍 reduce-right-async 是一个能够以异步方式执行 JavaScript 中 Array.prototype.reduceRight() 方法的 npm 包。

    4 年前
  • npm 包 reduce-stream-to-promise 使用教程

    在 Node.js 中,Stream 是同步处理大量数据的一种方式。但是在某些情况下,需要将多个 Stream 数据流合并处理,这时候我们可以使用 reduce-stream-to-promise。

    4 年前
  • npm 包 redux-shuttle 使用教程

    在前端开发中,redux 是一个很常用的状态管理工具。redux-shuttle 是一个可用于在 redux 中修改嵌套状态的 npm 包。它是一个具有简单 API 的函数式工具,适用于修改复杂的嵌套...

    4 年前
  • npm 包 redux-devtools-bubbles-monitor 使用教程

    简介 redux-devtools-bubbles-monitor 是一个基于 Redux DevTools 的监控组件,它可以让你更加直观地观察你的 Redux 状态变化及其历史记录。

    4 年前
  • npm 包 redux-side-effect 使用教程

    作为前端开发者,我们经常需要管理应用程序中的状态。Redux 是一个流行的状态管理库,它提供了一个可预测的状态管理解决方案。但是,Redux 的工作方式需要我们编写大量的模板代码,并且无法处理副作用(...

    4 年前
  • npm 包 redux-side-effects 使用教程

    在前端开发中,状态管理是一项非常重要的任务。Redux 是一个非常出色的状态管理库,能够帮助我们更好地组织和管理应用程序的状态。但是,Redux 还不是完美的,因为它没有能够处理副作用的能力。

    4 年前
  • npm 包 redux-devtools-chart-monitor-immutable-fix 使用教程

    前言 在前端开发中,状态管理是一个至关重要的部分。redux-devtools-chart-monitor-immutable-fix 是一个 npm 包,可以帮助我们更好地监控和管理状态。

    4 年前
  • npm包redux-devtools-clipboard使用教程

    前言 在开发过程中,我们会经常需要利用redux-devtools来调试redux应用的状态。redux-devtools可以让我们清晰地了解应用整体的状态,并可以修改状态并回放state的变化。

    4 年前
  • npm 包 reduce-to 使用教程

    在前端开发中,reduce 方法是非常常用的一个数组方法,它接受一个函数作为参数,这个函数会被数组中的每一个元素调用,最终返回一个累加器。 在实际开发中,我们会遇到许多类似的累加逻辑,而 reduce...

    4 年前
  • npm 包 reduce-web-component 使用教程

    简介 reduce-web-component 是一个开源的 npm 包,它可以将传统的 Web 页面转化为组件化的架构,实现页面复用和可维护性的提高。本教程将介绍如何使用该 npm 包。

    4 年前
  • npm 包 reduce-umls-terms 使用教程

    在前端开发中,优化项目结构和代码质量是开发者必须要面临的问题之一。尤其是在涉及海量数据处理时,使用合适的工具可以大大提高开发效率。npm 是前端开发中常用的包管理器,reduce-umls-terms...

    4 年前
  • npm 包 redux-devtools-chart-monitor-15 使用教程

    在前端开发中,Redux 是一个非常流行的状态管理工具。而 redux-devtools-chart-monitor-15 是一个用于 Redux 的图表监视器插件,它可以帮助我们更好地理解 Redu...

    4 年前
  • npm 包 redux-devtools-chart-monitor-immutable 使用教程

    介绍 redux-devtools-chart-monitor-immutable 是一个 redux 开发者工具包中的可视化工具,它用于在开发过程中可视化地检测 Redux store 中的状态变化...

    4 年前
  • npm 包 redux-minifetch 使用教程

    redux-minifetch 是一个基于 redux 和 fetch 的轻量级网络请求库,用于在前端开发中进行数据获取和处理。在本篇文章中,我们将深入介绍如何使用 redux-minifetch 进...

    4 年前
  • npm 包 reduced-actions-redux 使用教程

    什么是 reduced-actions-redux reduced-actions-redux 是一个基于 Redux 的状态管理工具,它可以让你更容易地在 Redux 中使用 action。

    4 年前
  • NPM 包 reduceless 使用教程

    介绍 Reduceless 是一个轻量级的 LESS 函数库,它封装了许多有用的方法供开发人员使用。该库支持 LESS 版本 3.0 及以上,并运行于 Node.js 环境。

    4 年前
  • npm 包 redux-devtools-deku-slider-monitor 使用教程

    redux-devtools-deku-slider-monitor 是一个基于 react 和 redux 的调试工具包,能够帮助前端开发者更好地调试应用程序的状态。

    4 年前
  • npm 包 redux-devtools-dispatch 使用教程

    前言 redux-devtools-dispatch 是一款为 Redux 开发者提供的工具包,可以帮助开发者更好地进行 Redux 状态管理。在开发过程中,经常需要查看当前状态、修改状态,以及跟踪状...

    4 年前
  • npm 包 redux-devtools-dispatch-ie8 使用教程

    redux-devtools-dispatch-ie8 是一款基于 Redux 开发的前端工具包,旨在提供 IE8 浏览器下对 Redux 开发调试的支持。在开发中使用此工具,可以帮助开发者更高效、准...

    4 年前

相关推荐

    暂无文章