SSL and CORS

Ionic Framework Ionic Angular
1

My good lord, I hope someone can help clear up my confused brain!

I have an ionic capacitor project which is hitting heroku end points (delete, post and get). It was working great and then we decided to implement security :frowning: by adding in CORS. The code is pretty simple:

image
image962×22 3.38 KB

The end points are https:// and when I run

ionic serve --ssl

it all works great. However, when I run

ionic cap build android or ionic cap build android --ssl

it always bombs out with

image
image1826×21 6.75 KB

how can I get android to hit the end point with an https://localhost? I have looked endlessly at forums and stackoverflow but all the solutions seem to be way out of date or simply did nothing for me.

cheers
Magnus

2

Might not be of use to anyone, but managed to get the result I wanted by using the capacitor-community/http plugin. Now getting responses from endpoint quite happily :slight_smile:

This tutorial was good: Using Capacitor Native HTTP with Ionic - YouTube

3

I for one think it’s a bad idea to just subvert CORS on the client (which is what using HTTP client plugins that don’t respect it does). The OP has some images in it that are unreadable to me, but https://localhost is impossible. Use a proper hostname.

The entire point of SSL certificates is to ensure that you are talking to the host you think you are talking to. This requires that the hostname being certified be uniquely specified. localhost can never fulfill that condition.

1 Like
4

Thanks for that. I think I still have some confusion however. So my current set up is:

Ionic App → hits → Heroku HTTPS end point

with ionic serve --ssl it works fine. With an android device it fails as the Heroku Log is showing the HTTP_ORIGIN as http://localhost which is not in the allow list (whes running serve with --ssl is obviously https://localhost).

Are you therefore saying that I can set the hostname to something else in the app and apply a certificate in the app as well? Do you have any good tips or tutorials on how to successfully do this? Everything I have looked at that works till now has been seen as a workaround and there are no solid tutorials on how to do this reliably. Would really appreciate the help!

thanks!

5

Your app doesn’t need to run on https since it all local to the device. It just to connect to your backend/API over https which would be to your Heroku server.

Your Heroku server needs to allow the following hosts as allowed origins for your app:

  • capacitor://localhost - iOS
  • http://localhost - Android