Skip to content

Commit e78722f

Browse files
tsotimustsotimus
authored
Feat/nonces ssr (#230)
1 parent 24e72b1 commit e78722f

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

47 files changed

+2198
-3099
lines changed

‎.github/ISSUE_TEMPLATE/generic-bug-report.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ name: Generic Bug Report
33
about: A non framework/library specific bug report
44
title: "[BUG]"
55
labels: bug
6-
assignees: RockiRider
6+
assignees: tsotimus
77

88
---
99

‎.github/ISSUE_TEMPLATE/react-bug-report.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ name: React Bug Report
33
about: React specific bug report
44
title: "[BUG]"
55
labels: bug, react
6-
assignees: RockiRider
6+
assignees: tsotimus
77

88
---
99

‎.github/pull_request_template.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
## Key Changes
1+
# Key Changes
22

33
- Change 1
44

‎.github/workflows/triage.yml

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -21,10 +21,13 @@ jobs:
2121
- run: corepack --version
2222

2323
- run: pnpm install
24+
2425
- name: Build All Publishable Packages
2526
run: pnpm p:build
27+
2628
- name: Run Unit Tests
2729
run: pnpm p:test
30+
2831
- name: Build Apps
2932
run: pnpm build
3033

‎README.md

Lines changed: 12 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,22 @@
1-
# Repo for all things CSP related
1+
# Vite Plugin CSP Guard
22

3-
## What's inside?
3+
<!-- BEGIN BADGES -->
4+
[![npm version](https://img.shields.io/npm/v/vite-plugin-csp-guard)](https://www.npmjs.com/package/vite-plugin-csp-guard)
5+
[![npm downloads](https://img.shields.io/npm/dt/vite-plugin-csp-guard)](https://www.npmjs.com/package/vite-plugin-csp-guard)
6+
[![npm weekly downloads](https://img.shields.io/npm/dw/vite-plugin-csp-guard)](https://www.npmjs.com/package/vite-plugin-csp-guard)
7+
[![License](https://img.shields.io/npm/l/vite-plugin-csp-guard)](https://github.com/tsotimus/vite-plugin-csp-guard/blob/main/LICENSE)
8+
[![GitHub stars](https://img.shields.io/github/stars/tsotimus/vite-plugin-csp-guard?style=social)](https://github.com/tsotimus/vite-plugin-csp-guard)
9+
<!-- END BADGES -->
10+
11+
This is a monorepo for the Vite Plugin CSP Guard.
412

5-
This is a turborepo monorepo using pnpm.
13+
## What's inside?
614

715
All the apps under `/apps` are used to test the plugin.
816

9-
All the packages under `/packages` include the packages im building, as well as some others.
17+
All the packages under `/packages` include the packages im building, as well as some utilities.
1018

1119
- [Vite Plugin CSP Guard](https://npmjs.com/package/vite-plugin-csp-guard)
12-
- [CSP Toolkit](https://npmjs.com/package/csp-toolkit)
1320

1421
## Documentation you might be looking for
1522

‎apps/docs/pages/guides/mpa.mdx

Lines changed: 3 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -3,45 +3,14 @@ import { Callout } from "nextra-theme-docs";
33
# Multi-Page Applications (MPAs)
44

55
<Callout type="info">
6-
Examples of MPA frameworks include Nuxt.js, Remix, and others.
6+
Examples of MPA frameworks include Nuxt, Remix, and others.
77
</Callout>
88

99
## Current Status
1010

1111
### The Bad News
12-
The **Vite Plugin CSP Guard** currently does not support Multi-Page Applications (MPAs). Unfortunately, this limitation is unlikely to change due to the inherent differences between how MPAs operate in Vite.
12+
The **Vite Plugin CSP Guard** package currently does not support Multi-Page Applications (MPAs). Unfortunately, this limitation is unlikely to change due to the inherent differences between how MPAs operate in Vite.
1313

1414
### The Good News
15-
We are actively working on solutions to bring CSP support to MPAs. While the main plugin does not support this today, additional packages are on the way to address these needs.
15+
You should be able to use the **CSP Toolkit** to generate a nonce & a CSP policy. Check out the [CSP Toolkit documentation](https://csp-toolkit.tsotne.co.uk) for more information. It has framework specific examples for popular frameworks.
1616

17-
---
18-
19-
## Our Roadmap
20-
Here’s what we’re working on to support CSP in MPA environments:
21-
22-
1. **Build a common toolkit** (✅ Done! Check out [CSP Toolkit](https://www.npmjs.com/package/csp-toolkit)).
23-
2. Develop **framework-specific solutions** tailored for popular MPA frameworks.
24-
3. Create a lightweight **Vite Server solution** focused solely on attaching nonces.
25-
26-
---
27-
28-
## What You Can Do in the Meantime
29-
30-
MPAs typically have access to a server, making it feasible to implement a **nonce-based CSP**. Here’s how you can set up your CSP for MPAs:
31-
32-
### Steps to Implement a Nonce-Based CSP
33-
34-
1. **Generate a new [nonce](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/nonce)** on every page request.
35-
*Use [CSP Toolkit](https://www.npmjs.com/package/csp-toolkit) to simplify this process.*
36-
37-
2. **Add the nonce to the CSP header or meta tag.**
38-
Refer to the [MDN documentation on CSP](https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP) for guidance on how to format the policy.
39-
40-
3. **Attach the nonce to your script and style tags.**
41-
This ensures compliance with the CSP policy for inline scripts and styles.
42-
43-
---
44-
45-
## Stay Tuned
46-
47-
We are committed to supporting developers across all frameworks, including MPAs. Progress on our roadmap is ongoing, and you can expect updates soon. For now, implementing a nonce-based CSP is the best practice to secure your MPA.

‎apps/docs/pages/guides/spa.mdx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -102,7 +102,7 @@ If you are using a library that dynamically injects CSS into the page (e.g., `st
102102

103103
The only alternative is to move to a server and use nonce-based CSPs.
104104

105-
We are actively working to find a solution to this [issue](https://github.com/RockiRider/vite-plugin-csp-guard/issues/2), but there isn't much support for hash-based CSPs in those libraries yet.
105+
We are actively working to find a solution to this [issue](https://github.com/tsotimus/vite-plugin-csp-guard/issues/2), but there isn't much support for hash-based CSPs in those libraries yet.
106106

107107
<Callout type="warning">
108108
There are risks to using `'unsafe-inline'` for your styles. However, most of these could potentially be mitigated by the rest of the CSP. [Read more about this here](https://scotthelme.co.uk/can-you-get-pwned-with-css/)

‎apps/docs/pages/index.mdx

Lines changed: 9 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,3 @@
1-
21
# Vite Plugin CSP Guard
32
Simplify CSP setup for your Vite SPA with Vite Plugin CSP Guard! Say goodbye to the hassle of managing Content Security Policies and hello to an easy way to protect your app from XSS attacks.
43

@@ -17,16 +16,16 @@ Here is a quick overview of the technologies we support, categorized by the leve
1716

1817
| Framework/Library | Support Level | Notes |
1918
|--------------------|-------------------------|------------------------------------------------------------|
20-
| React | ✅ Out of the Box | |
19+
| React | ✅ Out of the Box | |
2120
| Vue | ⚙️ Small Extra Config | Requires `outlierSupport: ["vue"]` in [config](/api-docs/#dev) |
22-
| Svelte | ✅ Out of the Box | |
23-
| Solid | ✅ Out of the Box | |
24-
| Quik | ❌ Not Supported | We are actively working on a solution for this. |
25-
| Lit | ❌ Not Supported | |
26-
| Remix | ❌ Not Supported | |
27-
| Remix SPA Mode | ❌ Not Supported | We are working on a solution for this. |
28-
| Nuxt (Vue) | ❌ Not Supported | |
29-
| Astro | ❌ Not Supported | |
21+
| Svelte | ✅ Out of the Box | |
22+
| Solid | ✅ Out of the Box | |
23+
| Quik | ❌ Not Supported | We are actively working on a solution for this. |
24+
| Lit | ❌ Not Supported | |
25+
| Remix | ℹ️ See MPA Guide | [MPA Guide](/guides/mpa) |
26+
| Remix SPA Mode | ❌ Not Supported | We are working on a solution for this. |
27+
| Nuxt (Vue) | ℹ️ See MPA Guide | |
28+
| Astro | ❌ Not Supported | |
3029

3130
### CSS Solutions
3231

‎apps/docs/pages/toolkit.mdx

Lines changed: 0 additions & 61 deletions
This file was deleted.

‎apps/docs/theme.config.jsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
export default {
22
logo: <span style={{ fontWeight: 600 }}>Vite CSP Guard</span>,
33
project: {
4-
link: "https://github.com/RockiRider/csp",
4+
link: "https://github.com/tsotimus/vite-plugin-csp-guard",
55
},
6-
docsRepositoryBase: "https://github.com/RockiRider/csp/tree/main/apps/docs",
6+
docsRepositoryBase: "https://github.com/tsotimus/vite-plugin-csp-guard/tree/main/apps/docs",
77
useNextSeoProps() {
88
return {
99
titleTemplate: "%s | Vite CSP Guard",

‎apps/remix-spa/package.json

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -12,17 +12,17 @@
1212
"typecheck": "tsc"
1313
},
1414
"dependencies": {
15-
"@remix-run/node": "^2.10.3",
16-
"@remix-run/react": "^2.10.3",
17-
"@remix-run/serve": "^2.10.3",
15+
"@remix-run/node": "^2.16.0",
16+
"@remix-run/react": "^2.16.0",
17+
"@remix-run/serve": "^2.16.0",
1818
"isbot": "^4.1.0",
1919
"react": "^18.2.0",
2020
"react-dom": "^18.2.0"
2121
},
2222
"devDependencies": {
23-
"@remix-run/dev": "^2.10.3",
24-
"@repo/typescript-config": "workspace:^",
23+
"@remix-run/dev": "^2.16.0",
2524
"@repo/testing": "workspace:^",
25+
"@repo/typescript-config": "workspace:^",
2626
"@types/react": "^18.2.20",
2727
"@types/react-dom": "^18.2.7",
2828
"@typescript-eslint/eslint-plugin": "^6.7.4",
@@ -37,8 +37,8 @@
3737
"postcss": "^8.4.38",
3838
"tailwindcss": "^3.4.4",
3939
"vite": "^5.1.0",
40-
"vite-tsconfig-paths": "^4.2.1",
41-
"vite-plugin-csp-guard": "workspace:^"
40+
"vite-plugin-csp-guard": "workspace:^",
41+
"vite-tsconfig-paths": "^4.2.1"
4242
},
4343
"engines": {
4444
"node": ">=20.0.0"

‎apps/remix-spa/vite.config.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ export default defineConfig({
1313
},
1414
ssr: false,
1515
}),
16-
tsconfigPaths(),
16+
tsconfigPaths() as PluginOption,
1717
csp({
1818
dev: {
1919
run: true,

‎apps/remix/.eslintrc.cjs

Lines changed: 0 additions & 84 deletions
This file was deleted.

‎apps/remix/.gitignore

Lines changed: 0 additions & 5 deletions
This file was deleted.

0 commit comments

Comments
 (0)