CORS error- Custom web apps

Support - Assistance technique
1

Hi Team,
Need your assistance on this.
We have three custom apps in our instance which is working fine. But in local we are getting CORS error. The localhost port 3000 has been added properly in DHIS. We are able to build the apps but not able to run it in local.

After analysing we figured out the login endpoint is failing.
The login endpoint being hit is
https://instanceURL/dhis-web-commons-security/login.action
But seems like the correct endpoint should be
https://instanceURL/dhis-web-commons/security/login.action#/

Any idea if this or anything else could lead to CORS error?

Thanks

2

Hi @Sweety_Sharma : thank you for the report and sorry for the issues you are facing.

Could you tell us what version of DHIS2 you are running? Could you also please provide a screenshot or copy/paste the error?

Possible suggestions depending on your answers above could be:

  • updating @dhis2/cli-app-scripts dependency (assuming you are building app with DHIS2 app-platform)
  • proxying your local instance and connecting your apps to the proxy (Proxy | DHIS2 Developer Portal)
3

Hi @tzemp
Currently we are in DHIS2 version2.37.9
I will try updating cli-app-scripts dependency.

Regarding:

proxying your local instance and connecting your apps to the proxy

this did not work

Attaching the screenshots below.

ss1
ss11956×746 114 KB

ss2
ss21924×776 118 KB

ss3
ss33024×562 91.4 KB

ss4
ss41482×522 26 KB

4

Hi @Sweety_Sharma

If your DHIS2 instance uses HTTPS, you can either use proxy or connect your localhost app to HTTPS DHIS2 instance via Firefox browser.

Thanks

5

Hi @Sweety_Sharma : Thanks for the update and sorry that it is still not working. I’m a little confused when you say the proxy did not work. Are you still getting the CORS error after proxing the server? Or is the proxy server not starting?

The procedure to use the proxy server would be:

  1. run your app with yarn start --proxy https://YOUR_INSTANCE_HERE --proxyPort 8082 (you can use some other proxy port)
  2. check that the proxy is running (in this example at port 8082). You should try to login in there. You should be able to log in to the instance (if you get a 404 error about the resource not being found after log in, you can ignore this)
  3. Connect your app to the proxy server:
    image
    image1552×966 41.3 KB

If you are still getting a CORS error at this point, can you check that the whitelisted server is being persisted on the backend (api/configuration/corsWhitelist)? The result should be an array. (I see from your screenshot that you had the whitelisted app is it in your settings app, but it could be that it is typed in the field but not properly persisted in the database).