· Home

myframely `/api/v1` demo

Exercises all three response shapes (JSON / HTML fragment / web component) against a single URL. Server-loads via the authenticated path; web-component live-fetch uses /demo/proxy as a stand-in for a consumer's backend proxy.

1. JSON shape=json

{
  "url": "https://x.com/TheCinesthetic/status/2046740768828604734",
  "canonical": "https://x.com/TheCinesthetic/status/2046740768828604734",
  "title": "cinesthetic. on X",
  "description": "Quentin Tarantino once called this shot in Dunkirk the greatest ever put on film in a war movie.",
  "siteName": "X",
  "siteLogoUrl": "https://storage.mostly.film/myframely/logo/x.com/6503a35c95cdf2d08ed83e17ae81c8b0e58f49c2.ico",
  "favicon": "https://x.com/favicon.ico",
  "images": {
    "thumbnail": "https://storage.mostly.film/myframely/previews/ff43138b-62c5-4632-9e7c-a90f2459184c/e6be8c4f9e3d.jpg",
    "hero": "https://storage.mostly.film/myframely/previews/ff43138b-62c5-4632-9e7c-a90f2459184c/db14145ff1ae.jpg",
    "origin": "https://pbs.twimg.com/ext_tw_video_thumb/1776522088272007168/pu/img/0utv5IQ0Y6Emqnvx.jpg"
  },
  "provider": {
    "name": "twitter",
    "videoId": "2046740768828604734",
    "embedUrl": "https://platform.twitter.com/embed/Tweet.html?id=2046740768828604734&frame=true&dnt=true&theme=light&hideConversation=true&hideThread=true",
    "thumbnailUrl": "https://pbs.twimg.com/ext_tw_video_thumb/1776522088272007168/pu/img/0utv5IQ0Y6Emqnvx.jpg",
    "aspectRatio": "1 / 1",
    "media": {
      "kind": "video",
      "posterUrl": "https://pbs.twimg.com/ext_tw_video_thumb/1776522088272007168/pu/img/0utv5IQ0Y6Emqnvx.jpg",
      "mp4Url": "https://video.twimg.com/ext_tw_video/1776522088272007168/pu/vid/avc1/480x270/JeqzKod6gTxLeTXs.mp4?tag=12",
      "aspectRatio": "1 / 1",
      "durationMs": null
    },
    "author": {
      "name": "cinesthetic.",
      "verified": false,
      "avatarUrl": "https://pbs.twimg.com/profile_images/1385452682517745667/mfcIUnoX_normal.jpg",
      "screenName": "TheCinesthetic"
    }
  },
  "fetchedAt": "2026-10-13T17:33:27.190Z"
}

2. HTML fragment shape=html

raw thumbnail HTML

<div class="mPreview_card" data-variant="thumbnail"><a class="mPreview_link" href="https://x.com/TheCinesthetic/status/2046740768828604734" target="_blank" rel="noopener nofollow"><img class="mPreview_thumb" src="https://storage.mostly.film/myframely/previews/ff43138b-62c5-4632-9e7c-a90f2459184c/730997e4816f.jpg" alt="" loading="lazy"><div class="mPreview_body"><h3 class="mPreview_title">cinesthetic. on X</h3><p class="mPreview_description">Quentin Tarantino once called this shot in Dunkirk the greatest ever put on film in a war movie.</p><div class="mPreview_meta"><img class="mPreview_logo" src="https://storage.mostly.film/myframely/logo/x.com/6503a35c95cdf2d08ed83e17ae81c8b0e58f49c2.ico" alt="" loading="lazy"><span class="mPreview_site">X</span></div></div></a></div>

3. Web component (pre-fetched) <myframely-card preview=...>

default

theme="dark"

variant="hero"

themed via --mPreview-* (small/tight)

4. Web component (live-fetch) <myframely-card url=... endpoint=/demo/proxy>

This component fetches the preview from /demo/proxy on mount, no pre-serialized attribute. Simulates the pattern a consumer would use if they proxy the preview call through their own backend.