mixi Developer Center (ミクシィ デベロッパーセンター)

mixiアプリ

mixiアプリ » 技術仕様(独自ドメイン方式) » アプリスタート画面の作成

アプリスタート画面の作成

アプリスタート画面は独自ドメイン方式のmixiアプリ開始時にユーザが最初に訪れるページです。
アプリ作成時に指定したスタートURLがアプリスタート画面として表示されます。

この画面にはアプリ開始ボタンと指定したヘッダを設置する必要があります。
以下でこれらの設置方法について説明をします。

アプリ開始ボタンの埋め込み

https://mixi.jp/connect_authorize.pl にパラメータを追加し、認可画面へのリンクを作成します。
追加するパラメータは下記URLの説明ページに従ってください。
また、アプリの対象デバイスをdisplayパラメータに必ず指定してください。
指定しない場合、意図と異なったデバイスのアプリ画面に遷移してしまう可能性があります。

http://developer.mixi.co.jp/connect/mixi_graph_api/api_auth/#toc-authorization-code

アプリ開始ボタンの作成例:

<a href="https://mixi.jp/connect_authorize.pl?client_id=XXXXX&response_type=code&scope=mixi_apps2%20r_profile&display=pc&state=5c1b3eea390b53f54ad0975e9a4bbba2" >アプリを始める</a>

ヘッダの埋め込み

iframe で専用のヘッダ(https://mixi.jp/external_game_header.pl)を呼び出してください。
この際、以下のクエリパラメータを付与してください。デバイスに応じて、設定が異なるパラメータがあるためご注意下さい。

  • id(アプリID)
  • display("pc" または "touch")

また、iframe の高さに関して、PC 版は50px、Touch 版は45px を指定してください。

埋め込み方の例(PC):

<iframe name="mixi アプリ" src="https://mixi.jp/external_game_header.pl?id=XXXXX&display=pc" frameborder="0" height="50px" width="100%" scrolling="no">header</iframe>

埋め込み方の例(Touch):

<iframe name="mixi アプリ" src="https://mixi.jp/external_game_header.pl?id=XXXXX&display=touch" frameborder="0" height="45px" width="100%" scrolling="no">header</iframe>

このページの上部へ