h5p-player-setup
Installation
SKILL.md
Put the H5P player on a site
@missing-elements/h5p-offline-player is one custom element, <h5p-player>. It plays a .h5p
package from a URL or a picked file: the archive is read in place and a Service Worker serves
its files to the H5P runtime. Three files matter: the element (h5p-player.js), the worker
(h5p-sw.js) and the runtime folder (frame-assets/). Only the worker has to be served from
the site's own origin; browsers refuse a cross-origin Service Worker.
1. Pick the setup
Ask, or read from the project, three things: is there a bundler; can a file be placed on the site's own origin; where do the packages come from.
| The site | Setup |
|---|---|
| Has a bundler: Vite, webpack 5, Rollup, or a framework on one (Next, Nuxt, Astro, SvelteKit) | A |
| Plain HTML, a CMS theme, a static site with no build | B |
| Cannot host even one file: a page builder, a locked-down CMS | C |