Setting up NGROK to work with Litium apps

To be able to place orders locally using a payment app it needs to be able to communicate with the outside world. Lets have a look how to get that working with ngrok.

1. Download and register ngrok

Download ngrok and sign up free account. We will need that to use https. After you have signed up you will get an authtoken. Fire up you ngrok-terminal and type:

ngrok authtoken <my-token>

use ngrok.exe if you are using windows.

ngrok.exe authtoken <my-token>

2. Exposing a server

Open up your docker-compose.yaml-file and scroll down to the ports section of the desired app. Shown below is the direct-payment example, in which we are interested in knowing that it uses port 10011.

The direct-payment app doesn’t need ngrok to work. But since it is present in the default installation of Litium we will use it as an example. You are probably doing this for a payment app such as Svea or Klarna.

  direct-payment:
    ports:
    - "10010:80"
    - "10011:443"

Now go back to your terminal and run:

ngrok http https://localhost:10011

Or this in Windows:

ngrok.exe http https://localhost:10011

You will now see something looking like this:

ngrok by @inconshreveable                                                                                                                   (Ctrl+C to quit)                                                                                                                                                            Session Status                online                                                                                                                        Account                       My name (Plan: Free)                                                                                                Version                       2.3.666                                                                                                                        Region                        United States (us)                                                                                                            Web Interface                 http://127.0.0.1:4040                                                                                                         Forwarding                    http://61c5-1515-4-97kh-88.ngrok.io -> https://localhost:14001                                                                  Forwarding                    https://61c5-1515-4-97kh-88.ngrok.io -> https://localhost:14001                                                                                                                                                                                                                             Connections                   ttl     opn     rt1     rt5     p50     p90                                                                                                                 0       0       0.00    0.00    0.00    0.00

Copy the ngrok-url using https and lets continue.

3. Using the ngrok url

Go back to your docker-compose.yaml-file and set the AppMetadata__AppUrl to your ngrok url.

  direct-payment:
    ports:
    - "10010:80"
    - "10011:443"
    environment:
    - AppMetadata__AppUrl=https://61c5-1515-4-97kh-88.ngrok.io

4. Docker time

Now stop your applications in docker and then run:

docker-compose up

And that is it. Thanks to Nils at Litium support!