System Information
- Strapi Version: 4.1.0
- Operating System: WIndows
- Node Version: v16.14.0
- NPM Version: >=6.0.0
so I’m working on this open source personal project and I decided to choose strapi as a CMS but I have been facing issues
Specifically
" Application error: a client-side exception has occurred (see the browser console for more information)."
Access to fetch at 'https://sitename.s3.us-west-1.amazonaws.com/poly_c2c2238ef5.glb' from origin 'https://www.sitename.xyz' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.
sitename.s3.us-west-1.amazonaws.com/poly_c2c2238ef5.glb:1 Failed to load resource: net::ERR_FAILED
2865-dc21874319225d29.js:1 Could not load https://sitename.s3.us-west-1.amazonaws.com/poly_c2c2238ef5.glb: Failed to fetch
Ca @ 865-dc21874319225d29.js:1
framework-91d7f78b5b4003c8.js:1 Could not load https://sitename.s3.us-west-1.amazonaws.com/poly_c2c2238ef5.glb: Failed to fetch
uu @ framework-91d7f78b5b4003c8.js:1
main-3a77b9662cf4f5c9.js:1 Could not load https://sitename.s3.us-west-1.amazonaws.com/poly_c2c2238ef5.glb: Failed to fetch
ve @ main-3a77b9662cf4f5c9.js:1
main-3a77b9662cf4f5c9.js:1 A client-side exception has occurred, see here for more info: https://nextjs.org/docs/messages/client-side-exception-occurred
So i did some research and I found out you have to add origins to the middlewares so I did
module.exports = [
"strapi::errors",
"strapi::security",
"strapi::cors",
"strapi::poweredBy",
"strapi::logger",
"strapi::query",
"strapi::body",
"strapi::session",
"strapi::favicon",
"strapi::public",
{
name: "strapi::security",
config: {
contentSecurityPolicy: {
useDefaults: true,
directives: {
"connect-src": ["'self'", "https:"],
"img-src": [
"'self'",
"data:",
"blob:",
"sitename.s3.us-west-1.amazonaws.com",
],
"media-src": [
"'self'",
"data:",
"blob:",
"sitename.s3.us-west-1.amazonaws.com",
],
upgradeInsecureRequests: null,
},
},
},
settings: {
cors: {
enabled: true,
headers: "*",
origin: [
"http://localhost",
"https://sitename.s3.us-west-1.amazonaws.com",
"https://www.mainsite.xyz/",
],
},
},
},
];
But either I get a build error where it says, “Invalid middleware configuration. Expected Array<string|{name?: string, resolve?: string, config: any}.”
Or the backend doesn’t work I’m wondering if anyone is kind enough to help me with this I want to get this project out by this sunday or monday.