ionic serve: how to connect over https to use reserved html5 methods such as geolocation

ionic serve: how to connect over https to use reserved html5 methods such as geolocation

 

We all know that at this point https is a must to have.
Many  html5 methods, such as geolocation, are blocked from browsers in order to avoid security issues.
Often, we bump in these “block” even before we deploy our app.
Actually when we deal with these html5 methods, we need to test them during the development phase!
Those using Ionic know it provides an amazing tool that helps during the development :”ionic serve”.
By launching “ionic serve” as shell command, we get a web server (node based) that automatically reloads our app every time we save a change in our code.
This server by default operates over http so, it is not possible to use those html5 methods for example on a smartphone connected to the same local network.

I found the easiest solution: using a proxy with a self signed ssl certificate!

Make a new directory and generate the certificate. ( https://gist.github.com/scrivy/0909468fde8f117a3d66507c8bb3fe12)

Save the following code in proxy.js (https://gist.github.com/justindmyers/266d169e97de20068f78)

Install the required modules and run the proxy

Make sure you’ve launched “ionic serve” it will run on :8100 while the proxy binds :8101

At this point you can type on the browser (The smartphone I mentioned before) https://proxy-ip:8101

PS
There is a thread on the official ionic’s github page, who knows, maybe they will integrate a solution.
Stay tuned! https://github.com/ionic-team/ionic/issues/1686

Leave a Reply

Your email address will not be published. Required fields are marked *