You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
To read more about every security middleware, go to that middleware page in `security` section.
132
+
::alert{type="warning"}
133
+
To modify these default settings and further increase the security of your application, read about our `strict` mode and our user-friendly approach on how to [Improve Security](/documentation/advanced/improve-security)
Copy file name to clipboardexpand all lines: docs/content/1.documentation/2.headers/3.crossOriginEmbedderPolicy.md
+26-2
Original file line number
Diff line number
Diff line change
@@ -44,10 +44,10 @@ You can also disable this header by `crossOriginEmbedderPolicy: false`.
44
44
45
45
## Default value
46
46
47
-
By default, Nuxt Security will set following value for this header.
47
+
By default, Nuxt Security will set the following value for this header.
48
48
49
49
```http
50
-
Cross-Origin-Embedder-Policy: require-corp
50
+
Cross-Origin-Embedder-Policy: credentialless
51
51
```
52
52
53
53
## Available values
@@ -73,3 +73,27 @@ no-cors cross-origin requests are sent without credentials. In particular, it me
73
73
::alert{type="warning"}
74
74
⚠️ Read more about `Avoiding blockage with CORS`[here](https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Cross-Origin-Embedder-Policy#avoiding_coep_blockage_with_cors).
75
75
::
76
+
77
+
## Cross-Origin Isolation issues
78
+
79
+
Setting cross-origin isolation by using the COEP header can sometimes have tricky consequences. This is because the COEP/COOP specification requires **both** your application **and** the embedded resource to set corresponding headers properly. If only one of the two parties does not set the headers properly, the frame can be blocked.
80
+
81
+
As a consequence, in order to avoid being blocked in websites that do not have COEP/COOP headers, some major third-party providers have chosen to _not_ deliver COEP/COOP headers. This in turn prevents you from using COEP in your application! If you want some background, please read the [excellent blog note from Stackblitz that explains their decision](https://blog.stackblitz.com/posts/cross-browser-with-coop-coep/).
82
+
83
+
If you encounter this situation, you will be left with a tough dilemna:
84
+
- If you choose to apply the `require-corp` option, the embedded resource will be blocked _if it does not deliver the proper headers_.
85
+
- If you choose to apply the `unsafe-none` option, the embedded resource will not be cross-origin isolated and therefore _might not work properly_.
86
+
87
+
This is the reason why we use the `credentialless` option by default, which is a reasonable fallback.
88
+
However even with this setting, you might encounter difficulties.
89
+
90
+
1. Inspect COEP/COOP issues in your browser's Developer Tools:
91
+
92
+
- If your console logs tell you that the Embedded Resource is blocked because it does not deliver proper COEP/COOP headers, this means that the third-party resource prevents you from using `credentialless`. In that case you might have to fallback to `unsafe-none`.
93
+
- If your console logs tell you that some features (e.g. SharedArrayBuffers) are blocked because your application is not cross-origin isolated, your application might still be able to run properly. If it's not the case, you might have to upgrade to `require-corp`.
94
+
95
+
2. Have a look at our documentation example code
96
+
97
+
Our own documentation website includes iframes from Youtube and Stackblitz.
98
+
Please have a look at our [Github source code](https://github.com/Baroshem/nuxt-security/blob/main/docs/nuxt.config.ts) to see how we set the Nuxt Security options to allow these iframes.
0 commit comments