This project ensures your browser's complicated Cross Origin Isolation (COI) settings "just work"™ for web workers. This is especially useful when you have no control over the HTTP headers returned by the server.
The simplest way to use mini-coi is to place the mini-coi.js file in the
root of your website (i.e. /), and reference it as the first child tag in the
<head> of your HTML documents:
<script src="/mini-coi.js" scope="./"></script>For more complete technical details, read on...
A minimalistic CLI utility or a simplified version of coi-serviceworker, with an optional scope attribute to define where Cross Origin Isolation should happen.
Bootstrap a local server with all headers enforced:
npx mini-coi .
# the third argument is a path so ...
# npx mini-coi ./public/
# npx mini-coi ./test/
# ...The CLI brings in what's possible already to do with static-handler by passing --coi by default.
Allow headers in places like GitHub pages or any other server where you cannot change current headers:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="./mini-coi.js" scope="./"></script>
</head>
</html>- no options at all: "it just works" ™
- always require-corp to have this working on Safari as well as Chrome or Firefox
- errors are just thrown in devtools
- the file must be a local file, you can't use any CDN or raw GitHub URL, you need to copy the file content locally 1
- the script must not be a module, it has to be exactly a
<script src="./mini-coi.js"></script>at the top of your<head>tag in your page (or in general before any otherscriptorlinkorstyleis used, it can be aftermetaandtitlethough)
Footnotes
-
You can either use the CLI utility:
npx mini-coi -sw public/mini-coi.js // or ... npx mini-coi --service-worker public/mini-coi.jsOr you can grab the file from a CDN and save it locally:
↩# grab mini-coi.js and save it locally as mini-coi.js curl -LO https://raw.githubusercontent.com/WebReflection/mini-coi/main/mini-coi.js