Strapi 4 Content Security Policy / Reverse Proxy Issue when Accessed over the Internet

Questions and Answers
1
System Information
  • Strapi Version: 4.5.4
  • Operating System: Microsoft Windows Server 2019 Datacenter
  • Database: N/A
  • Node Version: 16.16.0
  • NPM Version: 8.11.0
  • Yarn Version: N/A

I’m super green to Strapi, but managed to get it all self-hosted on an AWS EC2 instance alongside some of my other apps and websites. I plan to use Strapi as a back-end for a blog website to help raise awareness for my brand and support my app’s community via helpful tips, tricks and news.

Here’s what I set up:

  1. Hosting Strapi v4 following the Get Started guide, on AWS EC2 on port 1337, exposed via reverse proxy in IIS to cms[dot]mydomain[dot]com.
  2. An SSL certificate has also been set up to ensure secure traffic to/from the above subdomain since I require this CMS to be publicly, securely accessible via the Internet.
  3. When visiting cms[dot]mydomain[dot]com from a browser outside the server, the Strapi “Welcome to your Strapi” page loads fine, but when I click the “Open the administration” button, I’m hit with this nasty Content Security Policy error:

image
image963×53 9.27 KB

I’m sure I’m missing a step. I have not configured anything specifically after following the official Hands-on tutorial. I feel like it’s something to do with the security middleware, specifically security header with relation to Content Security Policy, but it’s difficult to know exactly what to do with the config/middleware.js file for this specific instance and I’ve tried a few variations of known CSP policies.

I also have the sneaking suspicion this is directly related to the reverse proxy setup since if I replace localhost in the error http://localhost:1337/admin/project-type with https://cms.mysite.com/admin/project-type I get a valid response: {"data":{"isEE":false,"features":[]}}

Running localhost:1337 directly on the server works 100%. Do I need to make Strapi aware somehow of this little reverse proxy magic and how? Or is it really a CSP issue and a middleware.js configuration for ‘strapi::security’ is required?

2

Hey I’m currently looking for a reliable proxies service. Any advice would be appreciated!

3

Hey there, I came across your post, and I feel your pain when it comes to configuring Strapi’s Content Security Policy and reverse proxy setup. It can definitely be a bit tricky. I’ve had similar issues in the past, but I found that making Strapi aware of the reverse proxy helped. Have you tried that? Also, I recommend checking the official Strapi documentation. On a side note, I’m also currently looking for reliable proxies, and I found that proxies for market research work great for me. They’re fast and reliable. Keep us updated on your progress, and good luck!