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

Add script's integrity and crossorigin attributes #173

Merged
merged 1 commit into from
Jun 6, 2024

Conversation

JulienTant
Copy link
Contributor

@JulienTant JulienTant commented Jun 5, 2024

When using <script> to pull a library from a CDN, it's usually a good idea to attach an integrity check so that if they get hacked and someone changes all the script, malicious scripts don't get executed on your website.

To achieve this, you need to attach integrity and crossorigin to your <script/> tag

Script(
	Scr("https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta1/dist/js/bootstrap.bundle.min.js"),
	Integrity("sha384-ygbV9kiqUc6oa4msXn9868pTtWMgiQaeYH7/t7LECLbyPA2x65Kgf80OJFdroafW"),
	CrossOrigin("anonymous"),
)

Turns into

<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta1/dist/js/bootstrap.bundle.min.js" 
    integrity="sha384-ygbV9kiqUc6oa4msXn9868pTtWMgiQaeYH7/t7LECLbyPA2x65Kgf80OJFdroafW" 
    crossorigin="anonymous"></script>

Hint for whoever likes unpkg.com, adding ?meta at the end of any script you import form them will give you the current integrity for the file. Example: https://unpkg.com/three@0.165.0/build/three.cjs?meta

@markuswustenberg
Copy link
Member

Thank you for that! 😊

@markuswustenberg markuswustenberg merged commit d944acd into maragudk:main Jun 6, 2024
8 checks passed
@JulienTant JulienTant deleted the add-script-attrs branch June 6, 2024 18:43
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

2 participants