Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Importmap integrity section #33712

Merged
merged 15 commits into from
May 31, 2024
Merged
32 changes: 32 additions & 0 deletions files/en-us/web/html/element/script/type/importmap/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -145,6 +145,30 @@ For example, the map below will only use the scoped map if the loading module ha
If multiple scopes match the referrer URL, then the most specific scope path is used (the scope key name with the longest name).
The browser falls back to the next most specific scoped path if there is no matching specifier, and so on, eventually falling back to the module specifier map in the `imports` key.

### Integrity metadata map

You can use the `integrity` key to provide mapping for module [integrity metadata](/en-US/docs/Web/Security/Subresource_Integrity#using_subresource_integrity).
yoavweiss marked this conversation as resolved.
Show resolved Hide resolved
This enables you to ensure the integrity of dynamically or statically imported modules.
`integrity` also enables you to provide a fallback for top-level or preloaded modules, in case they don't already include an `integrity` attribute.

The map keys represent module URLs, which can be absolute or relative (starting with `/`, `./`, or `../`).
The map values represent integrity metadata, identical to that used in [`integrity`](/en-US/docs/Web/HTML/Element/script#integrity) attribute values.

For example, the map below defines integrity metadata for the `square.js` module (directly) and its bare specifier (transitively, via the `imports` key).

```html
<script type="importmap">
{
"imports": {
"square": "./module/shapes/square.js"
},
"integrity": {
"./module/shapes/square.js": "sha384-oqVuAfXRKap7fdgcCY5uykM6+R9GqQ8K/uxy9rx7HNQlGYl1kPzQho1wx4JwY8wC"
}
}
</script>
```

## Import map JSON representation

The following is a "formal" definition of the import map JSON representation.
Expand All @@ -169,6 +193,14 @@ The import map must be a valid JSON object that can define at most two optional
A key with a trailing `/` can be used as a prefix for when mapping (or remapping) modules addresses.
- The object properties' ordering is irrelevant: if multiple keys can match the module specifier, the most specific key is used (in other words, a specifier "olive/branch/" would match before "olive/").

- `integrity` {{optional_inline}}

- : Defines a valid JSON object where the _keys_ are strings containing valid absolute or relative URLs (starting with `/`, `./`, or `../`),
and the corresponding _values_ are valid [integrity metadata](/en-US/docs/Web/Security/Subresource_Integrity#using_subresource_integrity).

If the URL of a script importing or preloading a module matches a key in the `integrity` object, the corresponding integrity metadata is applied to the script's fetch options,
unless they already have integrity metadata attached to them.

- `scopes` {{optional_inline}}

- : Scopes define path-specific [module specifier maps](#module_specifier_map), allowing the choice of map to depend on the path of the code importing the module.
Expand Down