開発ガイド
ミニアプリの開発が簡単になりました。開発者向けの情報はこちらです。
外部URLの利用とミニアプリへの復帰

ミニアプリから外部ウェブページを開かせたい場合は、外部URLに直接リンクすることで実現可能です。ミニアプリのSDKが外部ページへのリンクを検出すると、ミニアプリビューの上に重ねて表示される新規ウィンドウでURLが開きます。以下はその例です。

  • HTMLリンク: <a href="http://www.example.com">Open external page</a>
  • JavaScript: window.location = "http://www.example.com"
  • 注記:JavaScriptでの window.open 
    の使用は現在サポート対象外ですので使用しないでください。JavaScriptからURLを開く必要がある場合はwindow.location を使用してください。

ミニアプリへの復帰とパラメータのパス

外部ページからミニアプリに復帰させたい場合は、外部ページからミニアプリのURLにリンクすることで行えます。

  • ミニアプリ復帰用URL​​​​​​​mscheme.MY_MINI_APP_ID://miniapp/index.html
    • ミニアプリIDはRASポータルで取得できます

注記:ホストアプリは「外部ページからミニアプリへの復帰」の機能をサポートしている必要があります。サポートされているかホストアプリ上で確認してください。

また、外部ページにパラメータを渡したり、外部ページからパラメータを受け取ったりすることも可能です。

1. ミニアプリのJavaScriptで:外部ページを開く

            
        
                                    

// Open the external page and pass parameters

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

2. 外部ページのJavaScriptで:ミニアプリに復帰する

            
        
                                    

// 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. ミニアプリのJavaScriptで:外部ページからパラメータを受け取る

            
        
                                    

// Receive the parameters

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

 

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

任意:パラメータとしてミニアプリURLを渡す

ミニアプリURLを外部ページにハードコーディングしたくない場合は、代わりにミニアプリURLをパラメータとして渡すこともできます。例えば、複数のミニアプリIDのある外部ページを使用したい場合などが考えられます。

ミニアプリ側:

            
        
                                    

// 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);

外部ページの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