Metabase api not able to access from angular app, Getting "Response to preflight request doesn't pass access control check, has been blocked by CORS policy"

I’m trying to access Metabase API from my angular app but every time the preflight request from the browser ( Request Method: OPTIONS) giving status 404 and post request to “api/session” is failing.
But the same call when I’m trying from POSTMAN or tried with set up an API gateway with lambda proxy integration and a Lambda function which will do Http call to Metabase api is working.

Sample code from my angular service file.
fetchSessionToken() {
“username”: “username”,
“password”: “password”
headers: { “Content-Type”: “application/json” }
tap( (response) => {
return response;
}, (err) => {
return throwError(err);

I tried a couple of things as listed below.
FIRST: Enabled https connection on elastic bean stack environment.
SECOND: Updated the application version on Elastic bean stack by adding some code on “”(.ebextensions > metabase_config > to support CORS on Nginx.

both the experiments didn’t work out for me.
Any help would be greatly appreciated!

Hi @bhav_26
Have you read this topic? Metabase API to GET a questions data as json getting "CORS Policy - No 'Access-Control-Allow-Origin' "

HI @flamber
yes, i follow the discussion completely…but i don’t find this helpful to me as i’m trying to aceess the api from my angular app codebase like how we are access other public or private apis.
If you see the network tab preflight request to the API is giving status 404.

@bhav_26 It sounds like you’re not setting the correct headers (or haven’t reloaded Nginx).
Just for reference, since pictures cannot be searched:
Access to XMLHttpRequest at '' from origin 'http://localhost:4200' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource