Embed

Embed renders supplied metadata immediately. When metadata is incomplete, it tries a supported oEmbed provider, selected Schema.org websites, and finally OpenGraph.

Import

import { Embed } from '@prosefly/astro-components';

Full props

When all display metadata is supplied, Embed renders it directly without a remote request. Explicit props always take precedence over resolved metadata.

Prosefly

Astro Theme Lotus

A documentation theme for Astro, built for expressive content.

<Embed
  kind="link"
  url="https://astro-theme-lotus.prosefly.dev/"
  title="Astro Theme Lotus"
  description="A documentation theme for Astro, built for expressive content."
  image="https://astro-theme-lotus.prosefly.dev/images/og.png"
  siteName="Prosefly"
/>

oEmbed providers

With only a URL, supported providers are resolved through their official oEmbed endpoint. Resolution happens while Astro renders the component and the result is cached.

YouTube

YouTube watch pages, short URLs, Shorts, playlists, live pages, and embed URLs are recognized.

<Embed url="https://www.youtube.com/watch?v=-a0ecQMq-rM" />

Vimeo

<Embed url="https://vimeo.com/863362136" />

Spotify

Spotify supports tracks, albums, playlists, artists, podcast shows, and episodes.

<Embed url="https://open.spotify.com/track/4cOEzug87glLzWjM0jYwlH" />

SoundCloud

<Embed url="https://soundcloud.com/forss/flickermood" />

Apple Music

<Embed url="https://music.apple.com/us/album/alan-wake/1466178819?i=1466178821" />

Apple Podcasts

<Embed url="https://podcasts.apple.com/us/podcast/how-bullying-spreads-and-how-social-bravery-stops-it/id160904630?i=1000788701823" />

X

Both x.com and legacy twitter.com status URLs are recognized. Legacy URLs are normalized before calling the X oEmbed endpoint. Script elements are removed from the returned HTML before it is cached and rendered.

<Embed url="https://x.com/astrodotbuild/status/2034318549532000277" />

Bluesky

<Embed url="https://bsky.app/profile/lepture.com/post/3mqjcd6ggkc2i" />

Flickr

Flickr photo pages and short URLs are resolved without retaining its provider script.

<Embed url="https://www.flickr.com/photos/30081478@N08/54195026854/" />

Schema.org providers

Schema.org parsing is intentionally restricted to selected websites. Each provider selects the relevant JSON-LD entity and normalizes it into the same card data used by explicit props.

Apple App Store

Application, offer, developer, and aggregate rating data are used. The full storefront URL remains part of the cache key so regional prices stay separate.

App Store · Myoland, Inc.

Miraa - AI transcribe & shadow

Want to learn languages and shadowing through videos and podcasts you love? Try Miraa! Audio and video bilingual subtitle transcription, real-time translation, and AI assistance to navigate the challenging section. All of these services are now available in multiple languages, including: - English - Japanese - Chinese - Korean - Spanish - German - Italian - French Echo Method In Miraa, you can easily learn languages through four steps: "Listen" "Understand" "Imitate" and "Compare." Just like playing a mimicry game, it helps you learn languages more effectively, enhancing your linguistic intuition and listening skills. Real-time Translation Miraa's real-time translation feature allows you to understand subtitles instantly, whether you're watching movies or listening to podcasts. Learning languages and understanding cultures has never been easier. AI Interpretation Stuck on something you don't understand? No worries, Miraa's AI interpretation helps you grasp every word and grammar rule in depth. Chatting with AI makes learning languages so easy and fun. Terms of use: https://miraa.app/terms/usage.html Privacy Policy: https://miraa.app/terms/privacy-policy.html

★4.6 / 5(1,288 ratings)Free

<Embed url="https://apps.apple.com/us/app/miraa-ai-transcribe-shadow/id6462883096" />

Google Play

Google Play · Google LLC

Google Maps

Real-time GPS navigation & local suggestions for food, events, & activities

★3.24(19,529,467 ratings)Free

<Embed url="https://play.google.com/store/apps/details?id=com.google.android.apps.maps" />

Product Hunt

Product pages use application metadata, maker names, and aggregate ratings.

Product Hunt · Ryan Nystrom, Simon Last, Jake Teton-Landis

Notion

Notion is an all-in-one workspace that combines note-taking, project management, and task organization. It allows users to create customized databases, documents, and calendars to streamline their personal and professional workflows.

★4.83 / 5(1,396 ratings)

<Embed url="https://www.producthunt.com/products/notion" />

Letterboxd

Film pages use poster, description, director, and aggregate rating data.

Letterboxd · Hayao Miyazaki

Spirited Away

A young girl, Chihiro, becomes trapped in a strange new world of spirits. When her parents undergo a mysterious transformation, she must call upon the courage she never knew she had to free her family.

★4.43 / 5(3,986,716 ratings)

<Embed url="https://letterboxd.com/film/spirited-away/" />

Rotten Tomatoes

Movie and TV pages use artwork, description, director, and aggregate rating data.

Rotten Tomatoes · Hayao Miyazaki

Spirited Away

Discover reviews, ratings, and trailers for Spirited Away on Rotten Tomatoes. Stay updated with critic and audience scores today!

★96 / 100(226 ratings)

<Embed url="https://www.rottentomatoes.com/m/spirited_away" />

OpenGraph

URLs that do not match an oEmbed or Schema.org provider use OpenGraph metadata.

Astro Theme Lotus

Build beautiful, accessible, and fast Astro documentation with MDX, search, i18n, and configurable design tokens.

<Embed url="https://astro-theme-lotus.prosefly.dev/" />

Resolution and overrides

Metadata is resolved in this order:

1. Return complete explicit props without fetching.
2. Try a supported oEmbed provider.
3. Try Schema.org on a selected website.
4. Parse OpenGraph metadata.
5. Fall back to an ordinary linked card.

Explicit props override individual resolved fields. For example, this keeps the YouTube player while replacing its resolved title:

<Embed
  url="https://www.youtube.com/watch?v=-a0ecQMq-rM"
  title="A title chosen by the author"
/>

Persistent cache

Resolved pages and oEmbed responses are cached in memory and persisted under .astro/prosefly/embed. Valid entries are reused across Astro dev sessions and builds until their TTL expires. Page metadata is cached for one hour; oEmbed providers may supply their own TTL, limited to between one minute and 24 hours.

Set PROSEFLY_EMBED_CACHE_DIR to store these cache files in another directory. If the directory is unavailable or read-only, Embed continues with its in-memory cache.

Disable fetching

Set fetch={false} when intentionally rendering incomplete metadata without a remote request.

<Embed
  url="https://example.com/article"
  title="A deliberately minimal card"
  fetch={false}
/>

Props