0.1.2 • Published 4 years ago
@aki77/oembed-element v0.1.2
<o-embed />
oEmbed web component
Installation
$ npm install @aki77/oembed-elementUsage
import '@aki77/oembed-element'<o-embed url="https://www.youtube.com/watch?v=P_HNazfxhlU" proxy="https://cors-proxy?%{url}"></o-embed>Attributes
Required
urlproxymost of the the sites do not have cors enabled, so cors proxy is necessary in most cases. Above used proxy is just for demonstration and is slow and highly rate limited, so provide your own Cors proxy.
Optional
option-query<o-embed url="..." proxy="..." option-query="maxwidth=700&maxheight=400"></o-embed>providersDefault providers are just a handful, you have hundreds to choose from. Say you want to extend suppport to more sites, go to https://oembed.com/providers.json, choose a provider object and pass it. Say we pick the first one, TwoThreeHQ, we will use it like this.
<o-embed url="..." proxy="..." providers="[{\"provider_name\":\"23HQ\",\"provider_url\":\"http://www.23hq.com\",\"endpoints\":[{\"schemes\":[\"http://www.23hq.com/*/photo/*\"],\"url\":\"http://www.23hq.com/23/oembed\"}]}]"></o-embed>
Browser support
Browsers without native custom element support require a polyfill.
- Chrome
- Firefox
- Safari
- Microsoft Edge
Development
npm install
npm testLicense
Distributed under the MIT license. See LICENSE for details.