1
0
mirror of https://codeberg.org/fediverse/fep.git synced 2026-08-09 05:56:10 +00:00
Files
fep/fep/22b6/index.html
T
2025-11-18 18:55:26 +00:00

755 lines
28 KiB
HTML

<!doctype html>
<html lang="en" class="no-js">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<meta name="description" content="Links are a fundamental part of the internet. This FEP describes how to use links to link a HTML page to an ActivityPub object. The mechanisms described in this document are not new and are used to link to RSS feeds (see [alternate][], second example).">
<link rel="canonical" href="https://helge.codeberg.page/fep/fep/22b6/">
<link rel="icon" href="../../assets/logo.png">
<meta name="generator" content="mkdocs-1.6.1, mkdocs-material-9.7.0">
<title>FEP-22b6: Linking an ActivityPub Object to a HTML page and back - Fediverse Enhancement Proposals</title>
<link rel="stylesheet" href="../../assets/stylesheets/main.618322db.min.css">
<link rel="stylesheet" href="../../assets/stylesheets/palette.ab4e12ef.min.css">
<link rel="stylesheet" href="../../styles/theme.css">
<script>__md_scope=new URL("../..",location),__md_hash=e=>[...e].reduce(((e,_)=>(e<<5)-e+_.charCodeAt(0)),0),__md_get=(e,_=localStorage,t=__md_scope)=>JSON.parse(_.getItem(t.pathname+"."+e)),__md_set=(e,_,t=localStorage,a=__md_scope)=>{try{t.setItem(a.pathname+"."+e,JSON.stringify(_))}catch(e){}}</script>
</head>
<body dir="ltr" data-md-color-scheme="default" data-md-color-primary="indigo" data-md-color-accent="indigo">
<input class="md-toggle" data-md-toggle="drawer" type="checkbox" id="__drawer" autocomplete="off">
<input class="md-toggle" data-md-toggle="search" type="checkbox" id="__search" autocomplete="off">
<label class="md-overlay" for="__drawer"></label>
<div data-md-component="skip">
<a href="#fep-22b6-linking-an-activitypub-object-to-a-html-page-and-back" class="md-skip">
Skip to content
</a>
</div>
<div data-md-component="announce">
</div>
<header class="md-header" data-md-component="header">
<nav class="md-header__inner md-grid" aria-label="Header">
<a href="../.." title="Fediverse Enhancement Proposals" class="md-header__button md-logo" aria-label="Fediverse Enhancement Proposals" data-md-component="logo">
<img src="../../assets/logo.png" alt="logo">
</a>
<label class="md-header__button md-icon" for="__drawer">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M3 6h18v2H3zm0 5h18v2H3zm0 5h18v2H3z"/></svg>
</label>
<div class="md-header__title" data-md-component="header-title">
<div class="md-header__ellipsis">
<div class="md-header__topic">
<span class="md-ellipsis">
Fediverse Enhancement Proposals
</span>
</div>
<div class="md-header__topic" data-md-component="header-topic">
<span class="md-ellipsis">
FEP-22b6: Linking an ActivityPub Object to a HTML page and back
</span>
</div>
</div>
</div>
<form class="md-header__option" data-md-component="palette">
<input class="md-option" data-md-color-media="(prefers-color-scheme: light)" data-md-color-scheme="default" data-md-color-primary="indigo" data-md-color-accent="indigo" aria-label="Switch to dark mode" type="radio" name="__palette" id="__palette_0">
<label class="md-header__button md-icon" title="Switch to dark mode" for="__palette_1" hidden>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 8a4 4 0 0 0-4 4 4 4 0 0 0 4 4 4 4 0 0 0 4-4 4 4 0 0 0-4-4m0 10a6 6 0 0 1-6-6 6 6 0 0 1 6-6 6 6 0 0 1 6 6 6 6 0 0 1-6 6m8-9.31V4h-4.69L12 .69 8.69 4H4v4.69L.69 12 4 15.31V20h4.69L12 23.31 15.31 20H20v-4.69L23.31 12z"/></svg>
</label>
<input class="md-option" data-md-color-media="(prefers-color-scheme: dark)" data-md-color-scheme="slate" data-md-color-primary="indigo" data-md-color-accent="indigo" aria-label="Switch to light mode" type="radio" name="__palette" id="__palette_1">
<label class="md-header__button md-icon" title="Switch to light mode" for="__palette_0" hidden>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 18c-.89 0-1.74-.2-2.5-.55C11.56 16.5 13 14.42 13 12s-1.44-4.5-3.5-5.45C10.26 6.2 11.11 6 12 6a6 6 0 0 1 6 6 6 6 0 0 1-6 6m8-9.31V4h-4.69L12 .69 8.69 4H4v4.69L.69 12 4 15.31V20h4.69L12 23.31 15.31 20H20v-4.69L23.31 12z"/></svg>
</label>
</form>
<script>var palette=__md_get("__palette");if(palette&&palette.color){if("(prefers-color-scheme)"===palette.color.media){var media=matchMedia("(prefers-color-scheme: light)"),input=document.querySelector(media.matches?"[data-md-color-media='(prefers-color-scheme: light)']":"[data-md-color-media='(prefers-color-scheme: dark)']");palette.color.media=input.getAttribute("data-md-color-media"),palette.color.scheme=input.getAttribute("data-md-color-scheme"),palette.color.primary=input.getAttribute("data-md-color-primary"),palette.color.accent=input.getAttribute("data-md-color-accent")}for(var[key,value]of Object.entries(palette.color))document.body.setAttribute("data-md-color-"+key,value)}</script>
<label class="md-header__button md-icon" for="__search">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M9.5 3A6.5 6.5 0 0 1 16 9.5c0 1.61-.59 3.09-1.56 4.23l.27.27h.79l5 5-1.5 1.5-5-5v-.79l-.27-.27A6.52 6.52 0 0 1 9.5 16 6.5 6.5 0 0 1 3 9.5 6.5 6.5 0 0 1 9.5 3m0 2C7 5 5 7 5 9.5S7 14 9.5 14 14 12 14 9.5 12 5 9.5 5"/></svg>
</label>
<div class="md-search" data-md-component="search" role="dialog">
<label class="md-search__overlay" for="__search"></label>
<div class="md-search__inner" role="search">
<form class="md-search__form" name="search">
<input type="text" class="md-search__input" name="query" aria-label="Search" placeholder="Search" autocapitalize="off" autocorrect="off" autocomplete="off" spellcheck="false" data-md-component="search-query" required>
<label class="md-search__icon md-icon" for="__search">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M9.5 3A6.5 6.5 0 0 1 16 9.5c0 1.61-.59 3.09-1.56 4.23l.27.27h.79l5 5-1.5 1.5-5-5v-.79l-.27-.27A6.52 6.52 0 0 1 9.5 16 6.5 6.5 0 0 1 3 9.5 6.5 6.5 0 0 1 9.5 3m0 2C7 5 5 7 5 9.5S7 14 9.5 14 14 12 14 9.5 12 5 9.5 5"/></svg>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M20 11v2H8l5.5 5.5-1.42 1.42L4.16 12l7.92-7.92L13.5 5.5 8 11z"/></svg>
</label>
<nav class="md-search__options" aria-label="Search">
<button type="reset" class="md-search__icon md-icon" title="Clear" aria-label="Clear" tabindex="-1">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M19 6.41 17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"/></svg>
</button>
</nav>
</form>
<div class="md-search__output">
<div class="md-search__scrollwrap" tabindex="0" data-md-scrollfix>
<div class="md-search-result" data-md-component="search-result">
<div class="md-search-result__meta">
Initializing search
</div>
<ol class="md-search-result__list" role="presentation"></ol>
</div>
</div>
</div>
</div>
</div>
<div class="md-header__source">
<a href="https://codeberg.org/fediverse/fep" title="Go to repository" class="md-source" data-md-component="source">
<div class="md-source__icon md-icon">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><!--! Font Awesome Free 7.1.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2025 Fonticons, Inc.--><path d="M439.6 236.1 244 40.5c-5.4-5.5-12.8-8.5-20.4-8.5s-15 3-20.4 8.4L162.5 81l51.5 51.5c27.1-9.1 52.7 16.8 43.4 43.7l49.7 49.7c34.2-11.8 61.2 31 35.5 56.7-26.5 26.5-70.2-2.9-56-37.3L240.3 199v121.9c25.3 12.5 22.3 41.8 9.1 55-6.4 6.4-15.2 10.1-24.3 10.1s-17.8-3.6-24.3-10.1c-17.6-17.6-11.1-46.9 11.2-56v-123c-20.8-8.5-24.6-30.7-18.6-45L142.6 101 8.5 235.1C3 240.6 0 247.9 0 255.5s3 15 8.5 20.4l195.6 195.7c5.4 5.4 12.7 8.4 20.4 8.4s15-3 20.4-8.4l194.7-194.7c5.4-5.4 8.4-12.8 8.4-20.4s-3-15-8.4-20.4"/></svg>
</div>
<div class="md-source__repository">
fediverse/fep
</div>
</a>
</div>
</nav>
</header>
<div class="md-container" data-md-component="container">
<nav class="md-tabs" aria-label="Tabs" data-md-component="tabs">
<div class="md-grid">
<ul class="md-tabs__list">
<li class="md-tabs__item">
<a href="../.." class="md-tabs__link">
Fediverse Enhancement Proposals
</a>
</li>
<li class="md-tabs__item">
<a href="../../final/" class="md-tabs__link">
Final
</a>
</li>
<li class="md-tabs__item">
<a href="../../draft/" class="md-tabs__link">
Draft
</a>
</li>
<li class="md-tabs__item">
<a href="../../withdrawn/" class="md-tabs__link">
Withdrawn
</a>
</li>
</ul>
</div>
</nav>
<main class="md-main" data-md-component="main">
<div class="md-main__inner md-grid">
<div class="md-sidebar md-sidebar--primary" data-md-component="sidebar" data-md-type="navigation" hidden>
<div class="md-sidebar__scrollwrap">
<div class="md-sidebar__inner">
<nav class="md-nav md-nav--primary md-nav--lifted" aria-label="Navigation" data-md-level="0">
<label class="md-nav__title" for="__drawer">
<a href="../.." title="Fediverse Enhancement Proposals" class="md-nav__button md-logo" aria-label="Fediverse Enhancement Proposals" data-md-component="logo">
<img src="../../assets/logo.png" alt="logo">
</a>
Fediverse Enhancement Proposals
</label>
<div class="md-nav__source">
<a href="https://codeberg.org/fediverse/fep" title="Go to repository" class="md-source" data-md-component="source">
<div class="md-source__icon md-icon">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><!--! Font Awesome Free 7.1.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2025 Fonticons, Inc.--><path d="M439.6 236.1 244 40.5c-5.4-5.5-12.8-8.5-20.4-8.5s-15 3-20.4 8.4L162.5 81l51.5 51.5c27.1-9.1 52.7 16.8 43.4 43.7l49.7 49.7c34.2-11.8 61.2 31 35.5 56.7-26.5 26.5-70.2-2.9-56-37.3L240.3 199v121.9c25.3 12.5 22.3 41.8 9.1 55-6.4 6.4-15.2 10.1-24.3 10.1s-17.8-3.6-24.3-10.1c-17.6-17.6-11.1-46.9 11.2-56v-123c-20.8-8.5-24.6-30.7-18.6-45L142.6 101 8.5 235.1C3 240.6 0 247.9 0 255.5s3 15 8.5 20.4l195.6 195.7c5.4 5.4 12.7 8.4 20.4 8.4s15-3 20.4-8.4l194.7-194.7c5.4-5.4 8.4-12.8 8.4-20.4s-3-15-8.4-20.4"/></svg>
</div>
<div class="md-source__repository">
fediverse/fep
</div>
</a>
</div>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../.." class="md-nav__link">
<span class="md-ellipsis">
Fediverse Enhancement Proposals
</span>
</a>
</li>
<li class="md-nav__item">
<a href="../../final/" class="md-nav__link">
<span class="md-ellipsis">
Final
</span>
</a>
</li>
<li class="md-nav__item">
<a href="../../draft/" class="md-nav__link">
<span class="md-ellipsis">
Draft
</span>
</a>
</li>
<li class="md-nav__item">
<a href="../../withdrawn/" class="md-nav__link">
<span class="md-ellipsis">
Withdrawn
</span>
</a>
</li>
</ul>
</nav>
</div>
</div>
</div>
<div class="md-sidebar md-sidebar--secondary" data-md-component="sidebar" data-md-type="toc" >
<div class="md-sidebar__scrollwrap">
<div class="md-sidebar__inner">
<nav class="md-nav md-nav--secondary" aria-label="Table of contents">
<label class="md-nav__title" for="__toc">
<span class="md-nav__icon md-icon"></span>
Table of contents
</label>
<ul class="md-nav__list" data-md-component="toc" data-md-scrollfix>
<li class="md-nav__item">
<a href="#summary" class="md-nav__link">
<span class="md-ellipsis">
Summary
</span>
</a>
</li>
<li class="md-nav__item">
<a href="#linking-from-a-html-page" class="md-nav__link">
<span class="md-ellipsis">
Linking from a HTML page
</span>
</a>
<nav class="md-nav" aria-label="Linking from a HTML page">
<ul class="md-nav__list">
<li class="md-nav__item">
<a href="#discussions" class="md-nav__link">
<span class="md-ellipsis">
Discussions
</span>
</a>
</li>
<li class="md-nav__item">
<a href="#example" class="md-nav__link">
<span class="md-ellipsis">
Example
</span>
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item">
<a href="#alternatives" class="md-nav__link">
<span class="md-ellipsis">
Alternatives
</span>
</a>
</li>
<li class="md-nav__item">
<a href="#references" class="md-nav__link">
<span class="md-ellipsis">
References
</span>
</a>
</li>
<li class="md-nav__item">
<a href="#copyright" class="md-nav__link">
<span class="md-ellipsis">
Copyright
</span>
</a>
</li>
</ul>
</nav>
</div>
</div>
</div>
<div class="md-content" data-md-component="content">
<article class="md-content__inner md-typeset">
<h1 id="fep-22b6-linking-an-activitypub-object-to-a-html-page-and-back">FEP-22b6: Linking an ActivityPub Object to a HTML page and back<a class="headerlink" href="#fep-22b6-linking-an-activitypub-object-to-a-html-page-and-back" title="Permanent link">&para;</a></h1>
<table>
<thead>
<tr>
<th>Authors</th>
<th>Status</th>
<th>Date received</th>
<th>Tracking issue</th>
<th>Discussions</th>
<th>Repository</th>
</tr>
</thead>
<tbody>
<tr>
<td>Helge <a href="&#109;&#97;&#105;&#108;&#116;&#111;&#58;&#64;&#104;&#101;&#108;&#103;&#101;&#64;&#109;&#121;&#109;&#97;&#116;&#104;&#46;&#114;&#111;&#99;&#107;&#115;">&#64;&#104;&#101;&#108;&#103;&#101;&#64;&#109;&#121;&#109;&#97;&#116;&#104;&#46;&#114;&#111;&#99;&#107;&#115;</a></td>
<td><code>DRAFT</code></td>
<td>2025-11-12</td>
<td><a href="https://codeberg.org/fediverse/fep/issues/730">#730</a></td>
<td><a href="https://socialhub.activitypub.rocks/t/fep-22b6-linking-an-activitypub-object-to-a-html-page-and-back/8369">Discussions</a></td>
<td><a href="https://codeberg.org/fediverse/fep/src/branch/main/fep/22b6/fep-22b6.md">codeberg</a></td>
</tr>
</tbody>
</table>
<h2 id="summary">Summary<a class="headerlink" href="#summary" title="Permanent link">&para;</a></h2>
<p>Links are a fundamental part of the internet. This FEP describes how to use
links to link a HTML page to an ActivityPub object. The mechanisms described
in this document are not new and are used to link to RSS feeds (see <a href="https://html.spec.whatwg.org/multipage/links.html#rel-alternate">alternate</a>,
second example).</p>
<h2 id="linking-from-a-html-page">Linking from a HTML page<a class="headerlink" href="#linking-from-a-html-page" title="Permanent link">&para;</a></h2>
<p>The HTML living standard states about <a href="https://html.spec.whatwg.org/multipage/links.html#rel-alternate">alternate</a></p>
<blockquote>
<p>The keyword creates a hyperlink referencing an alternate representation of the current document.</p>
</blockquote>
<p>In this sense, we can link from the HTML page to an ActivityPub object
using </p>
<div class="highlight"><pre><span></span><code><span class="p">&lt;</span><span class="nt">head</span><span class="p">&gt;</span>
...
<span class="p">&lt;</span><span class="nt">link</span> <span class="na">rel</span><span class="o">=</span><span class="s">&quot;alternate&quot;</span> <span class="na">type</span><span class="o">=</span><span class="s">&quot;application/activity+json&quot;</span> <span class="na">href</span><span class="o">=</span><span class="s">&quot;http://location.example/object.id&quot;</span><span class="p">&gt;</span>
...
<span class="p">&lt;/</span><span class="nt">head</span><span class="p">&gt;</span>
</code></pre></div>
<p>which can be used for automatic discovery.
To provide a link for the user, one should use an anchor, e.g.</p>
<div class="highlight"><pre><span></span><code><span class="p">&lt;</span><span class="nt">body</span><span class="p">&gt;</span>
...
<span class="p">&lt;</span><span class="nt">a</span> <span class="na">rel</span><span class="o">=</span><span class="s">&quot;alternate&quot;</span> <span class="na">type</span><span class="o">=</span><span class="s">&quot;application/activity+json&quot;</span> <span class="na">href</span><span class="o">=</span><span class="s">&quot;http://location.example/object.id&quot;</span><span class="p">&gt;</span>
ActivityPub Object
<span class="p">&lt;/</span><span class="nt">a</span><span class="p">&gt;</span>
...
<span class="p">&lt;/</span><span class="nt">body</span><span class="p">&gt;</span>
</code></pre></div>
<p>We recommend using both forms as they serve different purposes.</p>
<div class="admonition warning">
<p class="admonition-title">Warning</p>
<p>One might be tempted to use <a href="https://html.spec.whatwg.org/multipage/links.html#link-type-canonical">canonical</a> instead of <a href="https://html.spec.whatwg.org/multipage/links.html#rel-alternate">alternate</a> if the HTML page
just renders the content of the ActivityPub object. The author believes that sticking
to the single format giving here has the highest chance of leading to widespread support.</p>
</div>
<h3 id="discussions">Discussions<a class="headerlink" href="#discussions" title="Permanent link">&para;</a></h3>
<p>As the <a href="#example">example</a> below shows, there are use cases when the ActivityPub object
and the page are on different servers. One can however still check the relationship,
by verifying the ActivityPub object contains a link back to the page.</p>
<p>Similarly, the ActivityPub object might provide less content than the webpage.</p>
<h3 id="example">Example<a class="headerlink" href="#example" title="Permanent link">&para;</a></h3>
<p>The page <a href="https://bovine.codeberg.page/comments/">https://bovine.codeberg.page/comments/</a> contains
the link element</p>
<div class="highlight"><pre><span></span><code><span class="p">&lt;</span><span class="nt">link</span> <span class="na">rel</span><span class="o">=</span><span class="s">&quot;alternate&quot;</span>
<span class="na">href</span><span class="o">=</span><span class="s">&quot;https://comments.bovine.social/pages/aHR0cHM6Ly9ib3ZpbmUuY29kZWJlcmcucGFnZS9jb21tZW50cy8=&quot;</span>
<span class="na">type</span><span class="o">=</span><span class="s">&quot;application/activity+json&quot;</span><span class="p">&gt;</span>
</code></pre></div>
<p>and the linked object resolves to</p>
<div class="highlight"><pre><span></span><code><span class="p">{</span>
<span class="w"> </span><span class="nt">&quot;@context&quot;</span><span class="p">:</span><span class="w"> </span><span class="s2">&quot;https://www.w3.org/ns/activitystreams&quot;</span><span class="p">,</span>
<span class="w"> </span><span class="nt">&quot;type&quot;</span><span class="p">:</span><span class="w"> </span><span class="s2">&quot;Page&quot;</span><span class="p">,</span>
<span class="w"> </span><span class="nt">&quot;attributedTo&quot;</span><span class="p">:</span><span class="w"> </span><span class="s2">&quot;https://comments.bovine.social/actor/rF4xnx1QraAIU3Krg-2Qzg&quot;</span><span class="p">,</span>
<span class="w"> </span><span class="nt">&quot;to&quot;</span><span class="p">:</span><span class="w"> </span><span class="p">[</span>
<span class="w"> </span><span class="s2">&quot;https://www.w3.org/ns/activitystreams#Public&quot;</span>
<span class="w"> </span><span class="p">],</span>
<span class="w"> </span><span class="nt">&quot;published&quot;</span><span class="p">:</span><span class="w"> </span><span class="s2">&quot;2025-10-20T17:45:11Z&quot;</span><span class="p">,</span>
<span class="w"> </span><span class="nt">&quot;url&quot;</span><span class="p">:</span><span class="w"> </span><span class="p">[</span>
<span class="w"> </span><span class="p">{</span>
<span class="w"> </span><span class="nt">&quot;type&quot;</span><span class="p">:</span><span class="w"> </span><span class="s2">&quot;Link&quot;</span><span class="p">,</span>
<span class="w"> </span><span class="nt">&quot;href&quot;</span><span class="p">:</span><span class="w"> </span><span class="s2">&quot;https://bovine.codeberg.page/comments/&quot;</span><span class="p">,</span>
<span class="w"> </span><span class="nt">&quot;mediaType&quot;</span><span class="p">:</span><span class="w"> </span><span class="s2">&quot;text/html&quot;</span>
<span class="w"> </span><span class="p">}</span>
<span class="w"> </span><span class="p">],</span>
<span class="w"> </span><span class="nt">&quot;name&quot;</span><span class="p">:</span><span class="w"> </span><span class="s2">&quot;Comment Tracking System&quot;</span><span class="p">,</span>
<span class="w"> </span><span class="nt">&quot;summary&quot;</span><span class="p">:</span><span class="w"> </span><span class="kc">null</span><span class="p">,</span>
<span class="w"> </span><span class="nt">&quot;id&quot;</span><span class="p">:</span><span class="w"> </span><span class="s2">&quot;https://comments.bovine.social/pages/aHR0cHM6Ly9ib3ZpbmUuY29kZWJlcmcucGFnZS9jb21tZW50cy8=&quot;</span><span class="p">,</span>
<span class="w"> </span><span class="nt">&quot;context&quot;</span><span class="p">:</span><span class="w"> </span><span class="s2">&quot;https://comments.bovine.social/pages/aHR0cHM6Ly9ib3ZpbmUuY29kZWJlcmcucGFnZS9jb21tZW50cy8=/context&quot;</span><span class="p">,</span>
<span class="w"> </span><span class="nt">&quot;replies&quot;</span><span class="p">:</span><span class="w"> </span><span class="s2">&quot;https://comments.bovine.social/pages/aHR0cHM6Ly9ib3ZpbmUuY29kZWJlcmcucGFnZS9jb21tZW50cy8=/replies&quot;</span><span class="p">,</span>
<span class="w"> </span><span class="nt">&quot;likes&quot;</span><span class="p">:</span><span class="w"> </span><span class="s2">&quot;https://comments.bovine.social/pages/aHR0cHM6Ly9ib3ZpbmUuY29kZWJlcmcucGFnZS9jb21tZW50cy8=/likes&quot;</span><span class="p">,</span>
<span class="w"> </span><span class="nt">&quot;shares&quot;</span><span class="p">:</span><span class="w"> </span><span class="s2">&quot;https://comments.bovine.social/pages/aHR0cHM6Ly9ib3ZpbmUuY29kZWJlcmcucGFnZS9jb21tZW50cy8=/shares&quot;</span>
<span class="p">}</span>
</code></pre></div>
<p>The Page object can be understood as <a href="https://www.w3.org/TR/activitystreams-vocabulary/#dfn-page">Page in the ActivityVocabulary</a> here, i.e. "Represents a Web Page".</p>
<h2 id="alternatives">Alternatives<a class="headerlink" href="#alternatives" title="Permanent link">&para;</a></h2>
<p>As already said, we recommend using this suggested approach to link from
the HTML to an ActivityPub object.</p>
<p>However, there are other methods that are in use to provide the link,
and should be considered valid options.</p>
<ul>
<li><a href="https://developer.mozilla.org/en-US/docs/Web/HTTP/Guides/Content_negotiation">Content Negotiation</a></li>
<li><a href="https://developer.mozilla.org/en-US/docs/Web/HTTP/Reference/Headers/Link">Link Headers</a></li>
</ul>
<p>For the use case of <a href="https://bovine.codeberg.page/comments/136c/fep-136c/">FEP-136c: Comment Tracking Services</a>, that motivates
this work, embedding the links in the HTML is the only viable option.
This is due to the HTML often being hosted on static sites that do
not provide the option to use Content Negotiation or Link Headers.</p>
<h2 id="references">References<a class="headerlink" href="#references" title="Permanent link">&para;</a></h2>
<ul>
<li>Helge, <a href="https://bovine.codeberg.page/comments/136c/fep-136c/">FEP-136c: Comment Tracking Services</a>, in preparation</li>
<li>HTML Living Standard, <a href="https://html.spec.whatwg.org/multipage/links.html#rel-alternate">4.6.7.1 Link type "alternate"</a></li>
<li>HTML Living Standard, <a href="https://html.spec.whatwg.org/multipage/links.html#link-type-canonical">4.6.7.4 Link type "canonical"</a></li>
<li>James M Snell, Evan Prodromou, <a href="https://www.w3.org/TR/activitystreams-vocabulary/#dfn-page">Activity Vocabulary</a></li>
</ul>
<h2 id="copyright">Copyright<a class="headerlink" href="#copyright" title="Permanent link">&para;</a></h2>
<p>CC0 1.0 Universal (CC0 1.0) Public Domain Dedication</p>
<p>To the extent possible under law, the authors of this Fediverse Enhancement Proposal have waived all copyright and related or neighboring rights to this work.</p>
</article>
</div>
<script>var target=document.getElementById(location.hash.slice(1));target&&target.name&&(target.checked=target.name.startsWith("__tabbed_"))</script>
</div>
</main>
<footer class="md-footer">
<div class="md-footer-meta md-typeset">
<div class="md-footer-meta__inner md-grid">
<div class="md-copyright">
Made with
<a href="https://squidfunk.github.io/mkdocs-material/" target="_blank" rel="noopener">
Material for MkDocs
</a>
</div>
</div>
</div>
</footer>
</div>
<div class="md-dialog" data-md-component="dialog">
<div class="md-dialog__inner md-typeset"></div>
</div>
<script id="__config" type="application/json">{"annotate": null, "base": "../..", "features": ["navigation.tabs"], "search": "../../assets/javascripts/workers/search.7a47a382.min.js", "tags": null, "translations": {"clipboard.copied": "Copied to clipboard", "clipboard.copy": "Copy to clipboard", "search.result.more.one": "1 more on this page", "search.result.more.other": "# more on this page", "search.result.none": "No matching documents", "search.result.one": "1 matching document", "search.result.other": "# matching documents", "search.result.placeholder": "Type to start searching", "search.result.term.missing": "Missing", "select.version": "Select version"}, "version": null}</script>
<script src="../../assets/javascripts/bundle.e71a0d61.min.js"></script>
<script src="../../javascripts/tablesort@5.3.0/tablesort.min.js"></script>
<script src="../../javascripts/tablesort.js"></script>
</body>
</html>