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

mixiアプリ

mixiアプリ » 技術仕様(Graph API方式) » モバイル » はじめてのmixiアプリモバイル

はじめてのmixiアプリモバイル

2014年11月27日に旧方式(RESTful API方式)の対応が再開されました。現在は旧方式・新方式(Graph API方式)のどちらもご選択いただけます。
旧方式APIの受付再開について(2014/11/27)

mixiアプリモバイルは、mixiのソーシャルグラフを使って楽しいアプリケーションを作成することができます。友人とゲームを楽しんだり、友人といろいろな情報を共有したり、アイデア次第で多数のユーザに使ってもらうことができます。また、mixiアプリモバイルの仕組みは、既存の携帯サイトをmixiアプリに対応させることが比較的簡単にできるようになっています。携帯サイトの開発経験があれば、覚えなければならない事はごくわずかです。

それでは、基本的なmixiアプリモバイルの作り方を順を追って説明していきましょう。

HTMLファイルの準備

まずは、テキストを表示するだけのシンプルなアプリケーションを作成していきましょう。
次のようなHTMLファイルを準備します。見ていただければ分かると思いますが、一般的なiモード用のXHTMLファイルです。実際には、携帯電話のキャリアごとにHTMLタグの記述を変更したり、適切な絵文字を出し分けたりする必要がありますが、ここではその解説は行いません。

<?xml version="1.0" encoding="Shift_JIS"?>
<!DOCTYPE html PUBLIC "-//i-mode group (ja)//DTD XHTML i-XHTML(Locale/Ver.=ja/1.0) 1.0//EN" "i-xhtml_4ja_10.dtd">
<html xml:lang="ja" xmlns="http://www.w3.org/1999/xhtml">
<head>
  <meta http-equiv="Content-Type" content="application/xhtml+xml; charset=Shift_JIS" />
  <title>はじめてのmixiアプリモバイル</title>
</head>
<body>
はじめてのmixiアプリモバイル
</body>
</html>

これをサーバにアップロードしてください。インターネットからアクセスできるサーバでなくてはなりません。ここでは、次のURLでアクセス可能な場所にアップロードしたものとして話を進めていきます。実際に試す際は、ご自分のサーバのURLに置き換えてください。

http://example.com/hello.html

アプリ登録

実際にmixi内で動作させるためには、アプリ登録を行う必要があります。
まず、「Partner Dashboard」からアプリ作成画面へアクセスしてください。(パートナーアカウントでログインを行ってください。)

認定パートナー登録を行っていない場合は、この画面は表示されません。

mixiアプリの情報を入力する

mixiアプリの作成画面では、登録したいmixiアプリの説明文などを入力することになります。これらの入力情報は、ユーザにmixiアプリの面白さを伝えるための非常に重要な内容となります。

ページ中ほどの「アプリ対応範囲」を選択することで、次の5種類のアプリケーションを作成することができます。モバイルに対応したアプリケーション の項目は、パートナーアカウントでログインしている場合にのみ表示されます。パートナーテストアカウントでは表示されませんのでご注意ください。

  • モバイルに対応したアプリケーション
  • PCに対応したアプリケーション
  • スマートフォンに対応したアプリケーション
    • web版、Android版、iOS版の3種類があります

edit_appli_mobile.png

各入力項目と入力すべき内容について、以下に示します。

項目名 入力すべき内容
アプリ名 登録するmixiアプリの名前です。
カテゴリ 登録するmixiアプリが所属するべきカテゴリです。アプリケーションの内容に沿ったカテゴリを選択してください。
ロゴ 登録するmixiアプリのロゴ画像です。推奨サイズは、100×100になります。
アイコン 登録するmixiアプリのアイコン画像です。推奨サイズは、16×16ピクセルになります。
問い合わせ用メールアドレス ユーザからの問い合わせを受け付けるメールアドレスです。
スタートURL ユーザがアプリケーションを最初に実行した際に呼び出される、アプリケーションのスタートURLです。
紹介文 一覧ページなどで使われる短めの紹介文です。
アプリ対応範囲 PC、モバイルへの対応範囲を設定します。
アプリの説明 登録するmixiアプリの説明文です。これを読んでユーザはどのようなアプリケーションなのかを知ることができる必要があります。
キャプチャ画像 登録するmixiアプリのキャプチャ画像です。推奨サイズは、200×200ピクセルになります。ユーザがアプリケーションを利用する際に、参考になるようなものにしてください。
利用規約の確認 内容を読んで同意するかどうかを選択します。

これらの項目を入力後、「入力内容を確認する」ボタンをクリックすると、入力内容の確認画面が表示されます。内容を確認後、「作成する」ボタンをクリックすることで、mixiアプリとして登録が完了し、アプリトップ画面が表示されます。

実機による動作確認

それでは、いよいよ携帯電話実機で動かしてみましょう。

「マイアプリ一覧」というメニューがあるので、ここから先ほど登録したアプリを探します。

アプリケーションの説明が表示される画面で、「アプリを実行」をクリックします。
「はじめてのmixiアプリモバイル」と表示されれば成功です。

ここで、お気付きになったかもしれませんが、”はじめてのmixiアプリモバイル”の文字以外にアプリケーション名や各種ページへのリンクが表示されています。これらのヘッダ、フッタは、mixiサーバから携帯電話にコンテンツを返す際に自動的に付加されます。

これで、最も基本的なアプリケーションを動かすことができたわけですが、実際にはもっと複雑な処理を行う必要があります。次項ではページ遷移を行ったり、ユーザが入力したフォームデータを受信する方法を説明します。

このページの上部へ