One of the most frequent questions we get is “How do I test my local environment?” We love this question, because it means that the user is venturing into Extreme Accessibility. Unfortunately, Tenon doesn’t have a way to connect to someone’s local environment. But you can do this with a service like ngrok. Lets’ walk through how do connect your local environment to ngrok and test with Tenon.
First, a word about security
It goes without saying that since ngrok is not our product we do not warranty its security. That being said, their documentation discusses a number of important security concerns:
- Each time you connect, the remote address is randomly assigned. When you disconnect, the remote address is destroyed, which means you (and a bad guy) can’t open the same connection again. You have your own custom address on a paid account, but we think the temporary address thing is pretty cool, from a security perspective
- You can turn off inspection so that nothing is logged
- You can connect over TLS
- You can whitelist specific IP addresses (such as Tenon’s IP) so that only those whitelisted IPs can access your server
- You can use ngrok through an HTTP or SOCKS proxy
From our perspective, the use of ngrok should be strongly considered for anyone wanting to be able to test their local environment. Doing so will save you a ton of money in an on-premises install.
Getting started with ngrok
Naturally the first step is to Sign up for ngrok. After that, you’ll need to download the binary file.
Creating the ngrok connection is ridiculously easy.
Using Tenon with ngrok (video).
The video above shows me testing a URL on my local environment with Tenon
- I load a local environment that I’ve connected to using grunt-contrib-connect. You can use any local web server for this, such as WAMP/ MAMP, etc.
- I open Terminal and type in
/Applications/ngrok http 9001, where “/Applications/ngrok/” is the binary file. The rest says, basically, that I want to open an HTTP connection to port 9000. Read their docs for the full list of arguments you can pass. - ngrok creates the connection and spits back some important information – most important of which is
Forwarding https://143e5772.ngrok.io -> localhost:9001 - I copy the URL
https://143e5772.ngrok.ioand paste it into the browser. It loads the identical page as if I had enteredhttp://localhost:9001 - I use the Tenon-Check browser extension to sent the ngrok URL to Tenon
- Tenon accesses that URL, tests it, and displays the results.
That’s it! So long as you retain that connection, you can test any page on your local host using Tenon.
In our next blog post, we’ll walk through adding this to Grunt tasks.