Development Guides
Development of MiniApps is not rocket science! Here are some guides to help you.
Opening an External URL & Returning to Miniapp

If you wish to open an external web page from your MiniApp, you can do so by just linking directly to the external URL. The MiniApp SDK will detect that you are linking to an external page, and this URL will then be opened in a new window on top of your MiniApp view. For example:

  • HTML link: <a href="http://www.example.com">Open external page</a>
  • JavaScript: window.location = "http://www.example.com"
  • Note: usage of JavaScript's window.open is currently unsupported, so it should not be used. Please use window.location instead if you need to open a URL from JavaScript.

Returning to MiniApp and passing params

If you wish to return to your MiniApp from your external page, you can do so by linking to your MiniApp's URL from your external page:

  • Mini App Return URL: mscheme.MY_MINI_APP_ID://miniapp/index.html
    • You can get your MiniApp ID from the RAS Portal.

Note: Your Host App must support this "Return to MiniApp from an external page" feature, so please check with your Host App whether it's supported.

Additionally, you can pass parameters both to the external page and receive parameters back from the external page.

1. In your MiniApp JavaScript: Open an external page

            
        
                                    

// Open the external page and pass parameters

window.location = "https://www.example.com?myParameter=testValue"

2. In your external page JavaScript: Return back to your MiniApp

            
        
                                    

// Receive the parameters from mini app

const params = window.location.search.substr(1).split("&");

 

// ... do something with your parameters ...

 

// Set the HREF for an <a> tag in your HTML

// When this <a> tag link is tapped, your external page will be closed and the user returned to your MiniApp

document.getElementById("MyAnchorTag").href = "mscheme.MY_MINI_APP_ID://miniapp/index.html?myReturnParameter=myValue";

3. In your MiniApp JavaScript: Receive params from external page

            
        
                                    

// Receive the parameters

const params = window.location.search.substr(1).split("&");

 

// ... do something with your parameters ...

Optional: Passing the MiniApp URL as a parameter

If you don't wish to hard-code your MiniApp URL into your external page, you can instead pass the MiniApp URL as a parameter. For example, you may wish to use your external page with multiple MiniApp IDs.

In your MiniApp:

            
        
                                    

// Form your callback URL

const callbackUrl = window.location.protocol + "//" + window.location.host + "/index.html";

 

 

// Open your external page

window.location = "https://www.example.com?callbackurl=" + encodeURIComponent(callbackUrl);

In your external page JavaScript:

            
        
                                    

// Receive the "callbackUrl" parameter

const params = window.location.search.substr(1).split("&");

const callbackUrl = params.map(param => param.split("="))

  .find(pair => pair[0] == "callbackUrl")[1];

 

// Set the HREF on your <a> tag with the decoded callback URL

document.getElementById("MyAnchorTag").href = decodeURIComponent(callbackUrl);

move to top