Skip to content
Mark Metcalfe edited this page Nov 25, 2024 · 14 revisions

Ngrok (pronounced en-grok) is a useful tool for making your local Totara site accessible publicly on the web. This is especially handy when testing intergrations with Totara, such as the mobile app, or external services such as Microsoft Teams, LinkedIn Learning, or even if you simply want to make your site available for someone else to look at.

You will first need to sign up for an account, and then install and authenticate ngrok on your machine. You will also need to make sure that the ngrok command can be run normally - this may require adding your ngrok installation directory to your $PATH variable.

The easiest way to set up ngrok for use with Totara is to simply use the example config.php that is provided with this repo in your sites.

You will then need to make sure your /etc/hosts file is up to date with your site definitions. You can update your /etc/hosts file automatically by running the tool/set_hosts.sh script.

Once ngrok is set up, you can use the tngrok command to use it with Totara.

Example command:

tngrok yoursite.totara83

You would see something like:

ngrok                                                                                                                                                                                (Ctrl+C to quit)

🔀 Route traffic by anything: https://ngrok.com/r/iep

Session Status                online
Account                       markmetcalfetotara (Plan: Free)
Version                       3.18.4
Region                        Australia (au)
Web Interface                 http://127.0.0.1:4040
Forwarding                    https://2536-219-89-13-234.ngrok-free.app -> https://integration.totara83:8443

Connections                   ttl     opn     rt1     rt5     p50     p90
                              0       0       0.00    0.00    0.00    0.00

Now you can access the site using the url shown in "Forwarding", in this example https://2536-219-89-13-234.ngrok-free.app. The url is accessible publicly so make sure you shutdown ngrok if you don't use it anymore (Ctrl-C).

Permanent URL

If your ngrok account is on a pro subscription, you can also specify what you want the URL to be, instead of getting a random one every time. This is especially helpful when setting up complex integrations (such as with Microsoft Teams) that you don't want to have to set up again every time you restart ngrok.

Example command:

tngrok yoursite.totara83 my-public-totara-site

Which will give you a publicly accessible URL at https://my-public-totara-site.ngrok.app.

XDebug & Ngrok

XDebug and Ngrok work together out of the box! This means that you can debug any external connections coming into your Totara site from an external source, such as an OAuth2 authentication request coming from an external integration for example.

As long as you have XDebug integrated with PHPStorm/your IDE of choice, you can simply specify a .debug URL for your host like this:

tngrok yoursite.totara83.debug

And just make sure you are listening for connections in your IDE. Simple really!

Clone this wiki locally