Skip to main content
All CollectionsAdministrator GuideMicro-Apps
Micro-App Link Format
Micro-App Link Format

How to structure your micro-app link to open as desired.

Updated over 3 weeks ago

Micro-apps typically open within the web view of Blink in an iFrame on all devices, allowing users to open links but stay within Blink. This is different than a shortcut in the Hub which always opens in a separate browser window.

We're aware that a number of applications do not support opening in an iFrame on desktop or the web app. Therefore, we developed a prefix URL that will allow the link to open within the app on mobile as well as open in a new browser window on the desktop and web versions.

How to format micro-app URLs in the Hub

For the sake of this example, let's assume that your URL is https://my-wonderful-third-party-app.com?client=mycustomer&weather=beautiful.

This is how the microapp URL will be structured:

  1. Prefix: https://microapps.joinblink.com/utils/x-frame-options-handler?openDesktopInWindow=true&redirect=

  2. The encoded URL for your URL:

    1. To encode a URL use this tool

      1. Paste https://my-wonderful-third-party-app.com?client=mycustomer&weather=beautiful into the top box and click ENCODE

      2. You will end up with the encoded URL: https%3A%2F%2Fmy-wonderful-third-party-app.com%3Fclient%3Dmycustomer%26weather%3Dbeautiful

  3. Join the 2 together to generate your final link: https://microapps.joinblink.com/utils/x-frame-options-handler?openDesktopInWindow=true&redirect=https%3A%2F%2Fmy-wonderful-third-party-app.com%3Fclient%3Dmycustomer%26weather%3Dbeautiful

  4. Add the above as the url for the microapps and you are done 🎉

How to re-format micro-app URLs in the Hub to auto populate user details

Example URL provided by client:

https://secure.tracerit.com/abellioldn/pages/driver_vir_login.aspx?ff_aa_dr_employee_number=[employee_number]&ff_aa_dr_surname=[employee_surname]&ff_aa_category_id=NR

  1. Remove everything prior to the .com/ so you are left with this:
    ​abellioldn/pages/driver_vir_login.aspx?ff_aa_dr_employee_number=[employee_number]&ff_aa_dr_surname=[employee_surname]&ff_aa_category_id=NR

  2. Then you need to url encode it so we can pass it as a query param using the following tool https://www.urlencoder.org/

    1. Paste in abellioldn/pages/driver_vir_login.aspx?ff_aa_dr_employee_number=[employee_number]&ff_aa_dr_surname=[employee_surname]&ff_aa_category_id=NR into the top box and click ENCODE

    2. You will end up with the encoded URL: abellioldn%2Fpages%2Fdriver_vir_login.aspx%3Fff_aa_dr_employee_number%3D%5Bemployee_number%5D%26ff_aa_dr_surname%3D%5Bemployee_surname%5D%26ff_aa_category_id%3DNR

  3. Join the 2 together to generate your final link:

    https://microapps.joinblink.com/tracerit/parse?url=abellioldn%2Fpages%2Fdriver_vir_login.aspx%3Fff_aa_dr_employee_number%3D%5Bemployee_number%5D%26ff_aa_dr_surname%3D%5Bemployee_surname%5D%26ff_aa_category_id%3DNR

  4. Add the above as the url for the micro-apps and you are done 🎉.

Did this answer your question?