Tag Archive for gadgets.views.getParams

mixiアプリ作成入門(16) – アクティビティにつけたパラメータを解説してみた - mixiアプリ作成入門(16) – アクティビティにつけたパラメータを解説してみた -のはてなブックマーク被リンク数

お久しぶりです!(うん、ほんとうにね。。)
マイキーです。

前回はアクティビティにパラメータを付与し、アクティビティのリンクから遷移されたときにパラメータの読み込みを行いましたので、今回はその内容を説明してみたいと思います。
まずは前回のサンプルをご覧ください。

<?xml version=”1.0″ encoding=”UTF-8″?>

<Module>
<ModulePrefs title=”test” description=”サンプル”>
<Require feature=”opensocial-0.8″ />
<Require feature=”dynamic-height” />
<Require feature=”views” />
</ModulePrefs>
<Content type=”html”><![CDATA[

<script type="text/javascript">

function postActivity(activity_msg) {
var params = {};
params[opensocial.Activity.Field.TITLE] = activity_msg;

var media = opensocial.newMediaItem(“image/gif”, “http://mixiap.info/image.gif”);
params[opensocial.Activity.Field.MEDIA_ITEMS] = [media];

// 起動時に渡したいパラメータを準備する
var values = {
test: “true”,
action: “1″
};
var escaped = gadgets.io.encodeValues({
appParams: gadgets.json.stringify(values)
});

// パラメータを付与する
params[opensocial.Activity.Field.URL] = “http://mixi.jp/run_appli.pl?id=アプリID” + “&” + escaped;
var activity = opensocial.newActivity(params);
opensocial.requestCreateActivity(
activity, opensocial.CreateActivityPriority.HIGH, activityResultCallback
);
}

function activityResultCallback(status) {
if (status.hadError()) {
alert(“Error Creating activity.”);
}else{
var body = document.getElementById(“activity_area”);
body.innerHTML = ‘お知らせしました。’;
}
}

// 起動時にパラメータチェック
window.onload = function(){
var params = gadgets.views.getParams();
var action = params["action"];
if(action == “1″){
alert(“アクティビティからのリンクです。”);
}
}
</script>

<div id=”activity_area”>
みんなにお知らせする?<br />
<div>
<input type=”button” name=”button” id=”send_activity” value=”知らせる” onclick=”postActivity(‘アクティビティテスト!’)” />
</div>
</div>

]]></Content>
</Module>

アクティビティのリンクには、ひとつといわず複数のパラメータを付与することができます。
サンプルでは、「起動時に渡したいパラメータを準備する」の部分で values オブジェクトにすべてのパラメータを記述しています。
パラメータは「パラメータ名: 値」の形式で、複数設定したい場合はカンマ区切りで記述します。

values オブジェクトに記述したパラメータたちは gadgets.json.stringify() で文字列に変換し、appParams という名前のパラメータとしてひとまとめにします。

appParams: gadgets.json.stringify(values) 

この部分ですね。

そしてそれをさらに、 gadgets.io.encodeValues を使ってURLのパラメータとして適切なフォーマットに変換します。

変換されたパラメータはいよいよ「パラメータを付与する」の段階に入ることができます。
必須のアプリIDのパラメータとは、アンパサンド (&) で連結してあげましょう。

このようにして送信されたアクティビティのリンクは、下記のようになります。

http://mixi.jp/run_appli.pl?id=xxxxx&appParams=%7B%22test%22%3A%22true%22%2C%22action%22%3A%221%22%7D&owner_id=xxxxx

ユーザーがこのリンクを通じてアプリにアクセスしてきたかどうかは、「起動時にパラメータチェック」のような例でチェックすることができます。
window.onload ではページの読み込みが完了した時に発生するイベントを指定できますが、サンプルではここでパラメータを受け取ってチェックしています。

パラメータを受け取るには、gadgets.views.getParams() という便利な関数があるのでこれを使います。
これを使ってサンプルのように params にパラメータを受け取った場合、action という名前のパラメータであれば

params["action"]

とすることで取り出すことができます。
サンプルでは、action というパラメータに「1」が入っていた場合にのみ特別なアクションを起こすように記述しています。

いかがでしたでしょうか?
アクティビティのリンクのURLに関してはすべてPC版で進めてしまいましたが、長々と続いたアクティビティシリーズも今回で一旦おしまいです。

mixiアプリ入門シリーズは今後も不定期に更新予定なので、次回テーマもお楽しみに! :)

Post Footer automatically generated by Add Post Footer Plugin for wordpress.

このエントリをはてなブックマークに追加このエントリをdel.icio.usに追加このエントリをLivedoor Clipに追加このエントリをYahoo!ブックマークに追加このエントリをFC2ブックマークに追加このエントリをNifty Clipに追加このエントリをPOOKMARK. Airlinesに追加このエントリをBuzzurl(バザール)に追加このエントリをChoixに追加このエントリをnewsingに追加

mixiアプリ作成入門(15) – アクティビティにパラメータをつけてみる - mixiアプリ作成入門(15) – アクティビティにパラメータをつけてみる -のはてなブックマーク被リンク数

こんにちは。
またもや久しぶりになってりまいました・・・マイキーです。失礼します ><

前回はアクティビティのリンク先を、通常「run_appli.pl」となっているところを「view_appli.pl」に変えてみました。

今回はリンク先にパラメータを付与して、アプリ実行時にパラメータを読み取ってみましょう!

<?xml version=”1.0″ encoding=”UTF-8″?>

<Module>
<ModulePrefs title=”test” description=”サンプル”>
<Require feature=”opensocial-0.8″ />
<Require feature=”dynamic-height” />
<Require feature=”views” />
</ModulePrefs>
<Content type=”html”><![CDATA[

<script type="text/javascript">

function postActivity(activity_msg) {
var params = {};
params[opensocial.Activity.Field.TITLE] = activity_msg;

var media = opensocial.newMediaItem(“image/gif”, “http://mixiap.info/image.gif”);
params[opensocial.Activity.Field.MEDIA_ITEMS] = [media];

// 起動時に渡したいパラメータを準備する
var values = {
test: “true”,
action: “1″
};
var escaped = gadgets.io.encodeValues({
appParams: gadgets.json.stringify(values)
});

// パラメータを付与する
params[opensocial.Activity.Field.URL] = “http://mixi.jp/run_appli.pl?id=アプリID” + “&” + escaped;
var activity = opensocial.newActivity(params);
opensocial.requestCreateActivity(
activity, opensocial.CreateActivityPriority.HIGH, activityResultCallback
);
}

function activityResultCallback(status) {
if (status.hadError()) {
alert(“Error Creating activity.”);
}else{
var body = document.getElementById(“activity_area”);
body.innerHTML = ‘お知らせしました。’;
}
}

// 起動時にパラメータチェック
window.onload = function(){
var params = gadgets.views.getParams();
var action = params["action"];
if(action == “1″){
alert(“アクティビティからのリンクです。”);
}
}
</script>

<div id=”activity_area”>
みんなにお知らせする?<br />
<div>
<input type=”button” name=”button” id=”send_activity” value=”知らせる” onclick=”postActivity(‘アクティビティテスト!’)” />
</div>
</div>

]]></Content>
</Module>

アプリ実行画面でパラメータを受け取りたいので、リンク先は「run_appli.pl」です。

実行画面で受け取りたいパラメータたちは、appParams の中に JSON 形式でエスケープしてまとめて入れるという特殊な方法を用いないといけないので注意してください。

また、Require feature に「views」を加えるのをお忘れなく!

いろいろ説明したいことはあるのですが、今回がだいぶ長くなってしまいそうなよかんなので、次回でもう少し詳しい説明をしてみたいと思います。

それではまた! :)

Post Footer automatically generated by Add Post Footer Plugin for wordpress.

このエントリをはてなブックマークに追加このエントリをdel.icio.usに追加このエントリをLivedoor Clipに追加このエントリをYahoo!ブックマークに追加このエントリをFC2ブックマークに追加このエントリをNifty Clipに追加このエントリをPOOKMARK. Airlinesに追加このエントリをBuzzurl(バザール)に追加このエントリをChoixに追加このエントリをnewsingに追加