I'm developing a small "webpart" add-in to be placed on one of our company sharepoint pages. I've seemingly gotten stuck in CORS hell and can't seem to figure out how to get my requests to work. Here is the breakdown:
I have a VPS that hosts a website (NGINX that reverse proxys an ExpressJS server). This server also runs a few endpoints that interact with a 3rd-party API. The website hosted on the VPS is able to interact with this API without issue.
I was requested to migrate a small part of this website to our sharepoint page. Despite all my efforts, I continue to be struck by the Cross-Origin Resource Sharing error: PreflightMissingAllowOriginHeader. In both locations (NGINX and ExpressJS), I have added the necessary headers, but my sharepoint request is showing this with the previously mentioned CORS error:
NGINX config:
add_header 'Access-Control-Allow-Origin' '*' always;
add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS' always;
add_header 'Access-Control-Allow-Credentials' 'true';
add_header 'Access-Control-Allow-Headers' 'Content-Type';
proxy_pass http://localhost:5007;
ExpressJS uses the NPM CORS package:
const app = express()
app.use(cors())
If I navigate directly to the hosted website, I can see the headers are set:
Does anyone have any ideas as to why I cannot seem to get any requests from our sharepoint site to this hosted API?