Web Preview Plugin CORS issue

Hello,

I am using Web Previews Plugin and I have followed the steps in the documentation. It was working last week and I am sure there wasnt any code change on my end. The plugin gave me a CORS error now

Is there anything on my end that I need to do / configure for it to work?

Hey @nirodriguez,

Did you already try setting the CORS headers for your website: https://github.com/datocms/plugins/tree/master/web-previews#installation-and-configuration

[…]if your website implements a Content Security Policy frame-ancestors directive, you need to add https://plugins-cdn.datocms.com to your list of allowed sources, ie.:

Content-Security-Policy: frame-ancestors 'self' https://plugins-cdn.datocms.com;

Hi @roger

If by adding it to the Custom Headers in teh plugin (like the screenshot below), then yes

Hey @nirodriguez,

Is there a chance you’re using Vercel’s auth protection for non-prod branches?

If you’re working with multiple environments, and you have this enabled, you’ll find that your prod branch is publicly accessible but all other branches require a Vercel account to be logged in to access the site. Hence the plugin can’t access it.

Turning this off for non-prod branches (or changing Vercel plans) might grant that access.
Hopefully this helps!

Andrew

Hi @av

Thanks for the suggestion and its something that I may look out for in the future. But no, disabling it does not do anything. Currently, im working of main and vercel is pointed to main as well

1 Like

Hey @nirodriguez,

No, sorry, that CORS setting has to be on your frontend (i.e. the route that actually receives the webhook from us).

If you need help specifically with that and your codebase, could you please share your repo (or at least that one file that handles the webhook) with us at support@datocms.com?