-
Notifications
You must be signed in to change notification settings - Fork 57
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
Stripe blocked by 'Cross-Origin-Embedder-Policy' #229
Comments
Heyo, Thanks for reporting this question. Could you try any of the answers provided by Alex here #138 (comment)? Maybe some of them will help you solve the issue. I will try to look for answers as well :) |
Adding proxy to the route: Tryied with nitro: {
routeRules: {
'/account': {
proxy: 'https://connect-js.stripe.com'
},
}
} I also updated my csp and didn't have results, considering that I configured correctly: contentSecurityPolicy: {
'base-uri': ["'self'"],
'font-src': ["'self'", 'https:', 'data:'],
'form-action': ["'self'"],
'frame-ancestors': ["'self'"],
'img-src': ["'self'", 'data:', 'https://*.stripe.com'],
'object-src': ["'none'"],
'script-src-attr': ["'none'"],
'script-src': [
"'self'",
'https://connect-js.stripe.com',
'https://js.stripe.com',
"'unsafe-inline'"
],
'frame-src': ['https://connect-js.stripe.com', 'https://js.stripe.com'],
'style-src': [
"'self'",
'https:',
"'unsafe-inline'",
'sha256-0hAheEzaMe6uXIKV4EehS9pu1am1lj/KnnzrOYqckXk='
],
}, Only when I update the page and the HTML document is fully loaded, that my |
Hmm, could you provide more details about your stack like Nuxt version and maybe your nuxt config? It sounds to me a bit like an issue with Nuxt itself but not sure. |
Could you share some light feom Nuxt perspective? Can this be an issue with the implementation of route rules on the security module side or is it an issue on the framework side? |
Using the latest version |
Also create a side project and tested the url changes export default defineEventHandler((event) => {
console.log('=========New request=========: ' + getRequestURL(event))
}) Correct me if I'm wrong, but this shoud be executed on every route change, right? But my middleware only trigger when I refresh or access manually the url, NuxtLink does not trigger this only if I use the anchor |
I think that if you want to trigger something on each route change, you should be looking into -> https://nuxt.com/docs/guide/directory-structure/middleware instead |
The route rules should take place and only register one header value. It shouldnt be like that. Have you tried to remove the require corp from the security config and just leave the route rules? Maybe there is a bug there. |
Any additional info @fabricioOak ? |
Tried to use only
I tried that routeRules: {
'/**': {
headers: {
'Cross-Origin-Embedder-Policy': 'require-corp',
}
},
'/account/**': {
headers: {
'Cross-Origin-Embedder-Policy': 'unsafe-none'
},
},
},
security: {
headers: {
contentSecurityPolicy: {
'base-uri': ["'self'"],
'font-src': ["'self'", 'https:', 'data:'],
'form-action': ["'self'"],
'frame-ancestors': ["'self'"],
'img-src': ["'self'", 'data:'],
'object-src': ["'none'"],
'script-src-attr': ["'none'"],
'style-src': ["'self'", 'https:', "'unsafe-inline'"],
'upgrade-insecure-requests': process.env.NODE_ENV !== 'development'
}'
}
}, But still the headers don't change and stripe is blocked. |
@Baroshem, I spoke with Daniel, and one alternative is to use a middleware to make navigation to that route act as an external one. You can achieve this by either using the 'external' attribute on the NuxtLink components or by creating a middleware like this: export default defineNuxtRouteMiddleware((to) => {
const routesForExternalLinks = ['/account']; // Or any other route you want
if (
process.client &&
!useNuxtApp().isHydrating &&
to.path &&
routesFor externalLinks.includes(to.path)
) {
window.location.href = to.fullPath;
return;
}
}); |
Interesting discovery @fabricioOak ! Woule you be open for writing some documentation about it? I think it could fit well in the FAQ section of the docs. If you target branch 1.0.0-rc.1 there will be a new and updated documentation and there you could copy the previous element and just replace the text, code, and maybe a link to your example. I think this could be very useful for the community who could be looking for similiar issue. When they will search the documentation with search bar, they will be able to find this faq section by keywords like navigation. |
After configuring @nuxt/security module, my Stripe requests are being blocked by the Cross-Origin-Embedder-Policy. While reading the documentation, I tried to configure it on a per-route basis as shown below:
However, the policy only changes when I refresh the page. Is there any other configuration I should do within the module or Nuxt itself, or is this a limitation?
The text was updated successfully, but these errors were encountered: