SlideShare ist ein Scribd-Unternehmen logo
1 von 16
Mixi アプリで体験する  OpenSocial
OpenSocial とは? ,[object Object],[object Object],[object Object],[object Object],大げさに言うとインタフェースをファイル1個に統一して、 いろんな SNS でサービスできるんだぜ的な仕組み
[object Object],[object Object]
Gadget XML ファイル を作る ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],まずは XML ファイルを作成して、 Web サーバにアップします。 SNS 側ではこのファイルを読み込んで、アプリケーションを表示します。
SNS にアプリを登録する ,[object Object],ここに作成した Gadget XML の URL を入力
[object Object],[object Object],[object Object],[object Object]
動かしてみる ,[object Object]
ちょっとだけ GadgetXML を解説 ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
ちょっとだけ GadgetXML を解説 <Content type=&quot;html&quot;><![CDATA[ <div>Hello, <span id=&quot;target&quot;></span>!</div> <script type=&quot;text/javascript&quot;>    function init() {      var req = opensocial.newDataRequest();      req.add(req.newFetchPersonRequest(opensocial.IdSpec.PersonId.VIEWER), &quot;viewer&quot;);      req.send(function(data) {        var viewer = data.get(&quot;viewer&quot;).getData();                  var name = viewer.getDisplayName();                  document.getElementById(&quot;target&quot;).innerHTML = name;                });    }        gadgets.util.registerOnLoadHandler(init);      </script> ]]></Content> 実際に表示する HTML を記載したり、 Javascript を書いたり。 ユーザ情報の取得は、 JavaScript で記載します。 ※ JavaScript じゃなくても、ユーザ情報を取得できますが、ここでは割愛。 FLASH の読み込み・外部通信なども JavaScript です。 というかほぼ JavaScript です。
試し実装してて混乱したこと ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
試し実装してて混乱したこと ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
じゃあ何ができるの? ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
[object Object],[object Object],[object Object]
[object Object],orkut 動きました。 よく見ると、 SNS によっては取れる情報が違うようです。 同じサービスを展開しようとなると、このへんの情報も知っておく必要ありで すかね。
Money な話 ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
まとめ ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Weitere ähnliche Inhalte

Andere mochten auch

Solo lesson1
Solo lesson1Solo lesson1
Solo lesson1mrboulter
 
Going SOLO Learning Matters
Going SOLO Learning MattersGoing SOLO Learning Matters
Going SOLO Learning MattersJen Leach
 
Blank solo question generator
Blank solo question generatorBlank solo question generator
Blank solo question generatormatthewbebbington
 
素敵なjavascript ~google chrome編~
素敵なjavascript ~google chrome編~素敵なjavascript ~google chrome編~
素敵なjavascript ~google chrome編~ngi group.
 
素敵なjavascript ~Firefox編 ~
素敵なjavascript ~Firefox編 ~素敵なjavascript ~Firefox編 ~
素敵なjavascript ~Firefox編 ~ngi group.
 
フラクタリスト技術知識共有会発表資料 090903
フラクタリスト技術知識共有会発表資料 090903フラクタリスト技術知識共有会発表資料 090903
フラクタリスト技術知識共有会発表資料 090903ngi group.
 
Git紹介~入門編~
Git紹介~入門編~Git紹介~入門編~
Git紹介~入門編~ngi group.
 
muninで簡単&自在サーバーモニタリング
muninで簡単&自在サーバーモニタリングmuninで簡単&自在サーバーモニタリング
muninで簡単&自在サーバーモニタリングngi group.
 
20091119_sinatraを使ってみた
20091119_sinatraを使ってみた20091119_sinatraを使ってみた
20091119_sinatraを使ってみたngi group.
 
Html5 入門編 その2
Html5 入門編 その2Html5 入門編 その2
Html5 入門編 その2ngi group.
 
Q4 Mでメッセージキュー
Q4 MでメッセージキューQ4 Mでメッセージキュー
Q4 Mでメッセージキューngi group.
 
軽量高機能webサーバーnginx
軽量高機能webサーバーnginx軽量高機能webサーバーnginx
軽量高機能webサーバーnginxngi group.
 
SvnからGitへの移行について
SvnからGitへの移行についてSvnからGitへの移行について
SvnからGitへの移行についてngi group.
 
正規表現のススメ_20091217
正規表現のススメ_20091217正規表現のススメ_20091217
正規表現のススメ_20091217ngi group.
 
RubyとPost Gis
RubyとPost GisRubyとPost Gis
RubyとPost Gisngi group.
 

Andere mochten auch (20)

Solo lesson1
Solo lesson1Solo lesson1
Solo lesson1
 
Going SOLO Learning Matters
Going SOLO Learning MattersGoing SOLO Learning Matters
Going SOLO Learning Matters
 
Solo station instructions
Solo station instructionsSolo station instructions
Solo station instructions
 
Blank solo question generator
Blank solo question generatorBlank solo question generator
Blank solo question generator
 
Solo review
Solo reviewSolo review
Solo review
 
SOLO Thinking Squares
SOLO Thinking SquaresSOLO Thinking Squares
SOLO Thinking Squares
 
素敵なjavascript ~google chrome編~
素敵なjavascript ~google chrome編~素敵なjavascript ~google chrome編~
素敵なjavascript ~google chrome編~
 
素敵なjavascript ~Firefox編 ~
素敵なjavascript ~Firefox編 ~素敵なjavascript ~Firefox編 ~
素敵なjavascript ~Firefox編 ~
 
フラクタリスト技術知識共有会発表資料 090903
フラクタリスト技術知識共有会発表資料 090903フラクタリスト技術知識共有会発表資料 090903
フラクタリスト技術知識共有会発表資料 090903
 
Git紹介~入門編~
Git紹介~入門編~Git紹介~入門編~
Git紹介~入門編~
 
muninで簡単&自在サーバーモニタリング
muninで簡単&自在サーバーモニタリングmuninで簡単&自在サーバーモニタリング
muninで簡単&自在サーバーモニタリング
 
20091119_sinatraを使ってみた
20091119_sinatraを使ってみた20091119_sinatraを使ってみた
20091119_sinatraを使ってみた
 
Html5 入門編 その2
Html5 入門編 その2Html5 入門編 その2
Html5 入門編 その2
 
Yii紹介
Yii紹介Yii紹介
Yii紹介
 
Q4 Mでメッセージキュー
Q4 MでメッセージキューQ4 Mでメッセージキュー
Q4 Mでメッセージキュー
 
軽量高機能webサーバーnginx
軽量高機能webサーバーnginx軽量高機能webサーバーnginx
軽量高機能webサーバーnginx
 
The Royal Lagoon Bhubaneswar
The Royal Lagoon Bhubaneswar The Royal Lagoon Bhubaneswar
The Royal Lagoon Bhubaneswar
 
SvnからGitへの移行について
SvnからGitへの移行についてSvnからGitへの移行について
SvnからGitへの移行について
 
正規表現のススメ_20091217
正規表現のススメ_20091217正規表現のススメ_20091217
正規表現のススメ_20091217
 
RubyとPost Gis
RubyとPost GisRubyとPost Gis
RubyとPost Gis
 

Ähnlich wie Mixiアプリで体験する Open Social

Mashup Caravan in オープンソースカンファレンス2011 Hiroshima: infoScoop OpenSource
Mashup Caravan in オープンソースカンファレンス2011 Hiroshima: infoScoop OpenSourceMashup Caravan in オープンソースカンファレンス2011 Hiroshima: infoScoop OpenSource
Mashup Caravan in オープンソースカンファレンス2011 Hiroshima: infoScoop OpenSourcecmutoh
 
Tokyo GTUG Bootcamp2010
Tokyo GTUG Bootcamp2010Tokyo GTUG Bootcamp2010
Tokyo GTUG Bootcamp2010Takashi EGAWA
 
jQuery MobileとPhoneGapでスマートフォンアプリ楽々クッキング
 jQuery MobileとPhoneGapでスマートフォンアプリ楽々クッキング jQuery MobileとPhoneGapでスマートフォンアプリ楽々クッキング
jQuery MobileとPhoneGapでスマートフォンアプリ楽々クッキングTakashi Okamoto
 
Android Lecture #01 @PRO&BSC Inc.
Android Lecture #01 @PRO&BSC Inc.Android Lecture #01 @PRO&BSC Inc.
Android Lecture #01 @PRO&BSC Inc.Yuki Higuchi
 
Web API 標準の OpenSocial の現状と今後
Web API 標準の OpenSocial の現状と今後Web API 標準の OpenSocial の現状と今後
Web API 標準の OpenSocial の現状と今後FatWireKK
 
Ruby向け帳票ソリューション「ThinReports」の開発で知るOSSの威力
Ruby向け帳票ソリューション「ThinReports」の開発で知るOSSの威力Ruby向け帳票ソリューション「ThinReports」の開発で知るOSSの威力
Ruby向け帳票ソリューション「ThinReports」の開発で知るOSSの威力ThinReports
 
Google Dev Fest 2010 Japan LT: OpenSocial JavaScript API is good, Lightweight...
Google Dev Fest 2010 Japan LT: OpenSocial JavaScript API is good, Lightweight...Google Dev Fest 2010 Japan LT: OpenSocial JavaScript API is good, Lightweight...
Google Dev Fest 2010 Japan LT: OpenSocial JavaScript API is good, Lightweight...Nobuhiro Nakajima
 
ぶっとびケータイ+Firefox OS Apps
ぶっとびケータイ+Firefox OS Appsぶっとびケータイ+Firefox OS Apps
ぶっとびケータイ+Firefox OS AppsEnsekiTT
 
お父さんのための実用JavaScriptプログラミング~入門篇~
お父さんのための実用JavaScriptプログラミング~入門篇~お父さんのための実用JavaScriptプログラミング~入門篇~
お父さんのための実用JavaScriptプログラミング~入門篇~Che Renkov
 
ExtJSで作るAIRアプリケーション
ExtJSで作るAIRアプリケーションExtJSで作るAIRアプリケーション
ExtJSで作るAIRアプリケーションDaisaku Yamamoto
 
2013.01.18 G*Workshop GGX 2012 Report
2013.01.18 G*Workshop GGX 2012 Report2013.01.18 G*Workshop GGX 2012 Report
2013.01.18 G*Workshop GGX 2012 ReportYu Sudo
 
Titanium Mobile
Titanium MobileTitanium Mobile
Titanium MobileNaoya Ito
 
スマートフォンアプリケーション開発の最新動向
スマートフォンアプリケーション開発の最新動向スマートフォンアプリケーション開発の最新動向
スマートフォンアプリケーション開発の最新動向Tsutomu Ogasawara
 
Concentrated HTML5 & Attractive HTML5
Concentrated HTML5 & Attractive HTML5Concentrated HTML5 & Attractive HTML5
Concentrated HTML5 & Attractive HTML5Sho Ito
 
AITCオープンラボ 第4回 IoT勉強会 〜 Pepper x IoT x Web 〜
AITCオープンラボ 第4回 IoT勉強会 〜 Pepper x IoT x Web 〜AITCオープンラボ 第4回 IoT勉強会 〜 Pepper x IoT x Web 〜
AITCオープンラボ 第4回 IoT勉強会 〜 Pepper x IoT x Web 〜Hirokazu Egashira
 
jQuery/Html5/ASP.NET MVC 対応コンポーネントを用いたデバイス対応業務アプリケーション開発
jQuery/Html5/ASP.NET MVC 対応コンポーネントを用いたデバイス対応業務アプリケーション開発jQuery/Html5/ASP.NET MVC 対応コンポーネントを用いたデバイス対応業務アプリケーション開発
jQuery/Html5/ASP.NET MVC 対応コンポーネントを用いたデバイス対応業務アプリケーション開発Daizen Ikehara
 
Webフロントエンド開発の最新トレンド - HTML5, モバイル, オフライン
Webフロントエンド開発の最新トレンド - HTML5, モバイル, オフラインWebフロントエンド開発の最新トレンド - HTML5, モバイル, オフライン
Webフロントエンド開発の最新トレンド - HTML5, モバイル, オフラインShumpei Shiraishi
 
Windows storeアプリ brekky
Windows storeアプリ brekkyWindows storeアプリ brekky
Windows storeアプリ brekkySatoshi Sekine
 

Ähnlich wie Mixiアプリで体験する Open Social (20)

Mashup Caravan in オープンソースカンファレンス2011 Hiroshima: infoScoop OpenSource
Mashup Caravan in オープンソースカンファレンス2011 Hiroshima: infoScoop OpenSourceMashup Caravan in オープンソースカンファレンス2011 Hiroshima: infoScoop OpenSource
Mashup Caravan in オープンソースカンファレンス2011 Hiroshima: infoScoop OpenSource
 
Tokyo GTUG Bootcamp2010
Tokyo GTUG Bootcamp2010Tokyo GTUG Bootcamp2010
Tokyo GTUG Bootcamp2010
 
Jqm20120804 publish
Jqm20120804 publishJqm20120804 publish
Jqm20120804 publish
 
jQuery MobileとPhoneGapでスマートフォンアプリ楽々クッキング
 jQuery MobileとPhoneGapでスマートフォンアプリ楽々クッキング jQuery MobileとPhoneGapでスマートフォンアプリ楽々クッキング
jQuery MobileとPhoneGapでスマートフォンアプリ楽々クッキング
 
Android Lecture #01 @PRO&BSC Inc.
Android Lecture #01 @PRO&BSC Inc.Android Lecture #01 @PRO&BSC Inc.
Android Lecture #01 @PRO&BSC Inc.
 
Web API 標準の OpenSocial の現状と今後
Web API 標準の OpenSocial の現状と今後Web API 標準の OpenSocial の現状と今後
Web API 標準の OpenSocial の現状と今後
 
Ruby向け帳票ソリューション「ThinReports」の開発で知るOSSの威力
Ruby向け帳票ソリューション「ThinReports」の開発で知るOSSの威力Ruby向け帳票ソリューション「ThinReports」の開発で知るOSSの威力
Ruby向け帳票ソリューション「ThinReports」の開発で知るOSSの威力
 
Google Dev Fest 2010 Japan LT: OpenSocial JavaScript API is good, Lightweight...
Google Dev Fest 2010 Japan LT: OpenSocial JavaScript API is good, Lightweight...Google Dev Fest 2010 Japan LT: OpenSocial JavaScript API is good, Lightweight...
Google Dev Fest 2010 Japan LT: OpenSocial JavaScript API is good, Lightweight...
 
ぶっとびケータイ+Firefox OS Apps
ぶっとびケータイ+Firefox OS Appsぶっとびケータイ+Firefox OS Apps
ぶっとびケータイ+Firefox OS Apps
 
お父さんのための実用JavaScriptプログラミング~入門篇~
お父さんのための実用JavaScriptプログラミング~入門篇~お父さんのための実用JavaScriptプログラミング~入門篇~
お父さんのための実用JavaScriptプログラミング~入門篇~
 
ExtJSで作るAIRアプリケーション
ExtJSで作るAIRアプリケーションExtJSで作るAIRアプリケーション
ExtJSで作るAIRアプリケーション
 
2013.01.18 G*Workshop GGX 2012 Report
2013.01.18 G*Workshop GGX 2012 Report2013.01.18 G*Workshop GGX 2012 Report
2013.01.18 G*Workshop GGX 2012 Report
 
Titanium Mobile
Titanium MobileTitanium Mobile
Titanium Mobile
 
スマートフォンアプリケーション開発の最新動向
スマートフォンアプリケーション開発の最新動向スマートフォンアプリケーション開発の最新動向
スマートフォンアプリケーション開発の最新動向
 
Ext.direct
Ext.directExt.direct
Ext.direct
 
Concentrated HTML5 & Attractive HTML5
Concentrated HTML5 & Attractive HTML5Concentrated HTML5 & Attractive HTML5
Concentrated HTML5 & Attractive HTML5
 
AITCオープンラボ 第4回 IoT勉強会 〜 Pepper x IoT x Web 〜
AITCオープンラボ 第4回 IoT勉強会 〜 Pepper x IoT x Web 〜AITCオープンラボ 第4回 IoT勉強会 〜 Pepper x IoT x Web 〜
AITCオープンラボ 第4回 IoT勉強会 〜 Pepper x IoT x Web 〜
 
jQuery/Html5/ASP.NET MVC 対応コンポーネントを用いたデバイス対応業務アプリケーション開発
jQuery/Html5/ASP.NET MVC 対応コンポーネントを用いたデバイス対応業務アプリケーション開発jQuery/Html5/ASP.NET MVC 対応コンポーネントを用いたデバイス対応業務アプリケーション開発
jQuery/Html5/ASP.NET MVC 対応コンポーネントを用いたデバイス対応業務アプリケーション開発
 
Webフロントエンド開発の最新トレンド - HTML5, モバイル, オフライン
Webフロントエンド開発の最新トレンド - HTML5, モバイル, オフラインWebフロントエンド開発の最新トレンド - HTML5, モバイル, オフライン
Webフロントエンド開発の最新トレンド - HTML5, モバイル, オフライン
 
Windows storeアプリ brekky
Windows storeアプリ brekkyWindows storeアプリ brekky
Windows storeアプリ brekky
 

Mixiアプリで体験する Open Social

  • 2.
  • 3.
  • 4.
  • 5.
  • 6.
  • 7.
  • 8.
  • 9. ちょっとだけ GadgetXML を解説 <Content type=&quot;html&quot;><![CDATA[ <div>Hello, <span id=&quot;target&quot;></span>!</div> <script type=&quot;text/javascript&quot;>    function init() {      var req = opensocial.newDataRequest();      req.add(req.newFetchPersonRequest(opensocial.IdSpec.PersonId.VIEWER), &quot;viewer&quot;);      req.send(function(data) {        var viewer = data.get(&quot;viewer&quot;).getData();                  var name = viewer.getDisplayName();                  document.getElementById(&quot;target&quot;).innerHTML = name;                });    }        gadgets.util.registerOnLoadHandler(init);      </script> ]]></Content> 実際に表示する HTML を記載したり、 Javascript を書いたり。 ユーザ情報の取得は、 JavaScript で記載します。 ※ JavaScript じゃなくても、ユーザ情報を取得できますが、ここでは割愛。 FLASH の読み込み・外部通信なども JavaScript です。 というかほぼ JavaScript です。
  • 10.
  • 11.
  • 12.
  • 13.
  • 14.
  • 15.
  • 16.