とりあえず雑記帳(跡地)
OpenSocial
最終更新:
fujiyan
-
view
WebコミックLibraryhttp://web-comi.appspot.com/ GAE/JとSlim3で作成してみた、各出版社から配信されているWebコミックをまとめて閲覧できるサイトです。只今、実験運用中… |
参考サイト
環境構築
- OSDEをEclipseにインストールする
- Installation Guideを参照
- 基本的にインストール後、デフォルトの状態で良いはず
サンプルデータベースの作成
- OpenSocialアプリケーション実行にはPeopleが必要なので、とりあえずサンプルデータベースを作ることで、自分で作る手間を省く。
- Create people to Shindig database as sample dataを参照
- 作る前にShindigを起動しておくこと。
OpenSocialでGWT
準備
- 下記のPluginをEclipseにインストール
- Google Plugin for Eclipse
- Google App Engine Java SDK(要らないかも)
- Google Web Toolkit SDK
プロジェクト作成
- プロジェクトは[Google]-[Web Application Project]で作成する
- GWTコンパイルをEclipseで実行させたいから
- プロジェクト作成の際、[Use Google AppEngine]のチェックは外しても良い。
targetフォルダの作成
- プロジェクトルート直下にtargetフォルダを作成する。
- OSDEでOpenSocialアプリケーションを実行させるためにはtargetフォルダが必要。
gadget.xmlの配置
- gadget.xmlをプロジェクトルート直下に配置する。
- 内容は、OpenSocialプロジェクト作成時に生成されるgadget.xmlをとりあえずコピーしておく。
GWTクラスの作成
- 通常のGWTアプリケーションと要領は同じ
- もちろんServiceは使えません。クライアント側のみで動作するアプリを記述します。
public class GWTExample implements EntryPoint { public void onModuleLoad() { final Button showButton = new Button("show"); final TextBox textBox = new TextBox(); class MyHandler implements ClickHandler { public void onClick(ClickEvent event) { Window.alert(textBox.getText()); } } MyHandler handler = new MyHandler(); showButton.addClickHandler(handler); HorizontalPanel panel = new HorizontalPanel(); panel.add(showButton); panel.add(textBox); RootPanel root = RootPanel.get(); root.add(panel); } }
Moduleのgwt.xmlファイル
- <add-linker name="xs"/>を指定する。
- これによって、GWTコンパイル後のコードが全てJavaScriptファイルとなる。
- 通常のリンカ(std)では、GWTコンパイル後に複数のHTMLファイルになり、gadgetのHTMLと分かれてしまうため、GWT側からOpenSocialのJavaScript関数にアクセスできない。
GWTコンパイル
- これも通常のコンパイル手順と同じ
- コンパイル後に、warフォルダ以下にModule名のフォルダが作成されるので、そのModule名フォルダをtargetフォルダにコピーする
gadget.xmlの修正とコピー(この変がイマイチ…)
- Moduleのjsファイルを読み込むようにする。
- Moduleのjsファイルのパスはhttp://[ホスト名]:[ポート番号]/[プロジェクト名]/[Module名(小文字)]/[Module名(小文字)].nocache.js
- http://localhost:8123/GWTExample/gwtexample/gwtexample.nocache.jsとか
- Moduleのjsファイルのパスはhttp://[ホスト名]:[ポート番号]/[プロジェクト名]/[Module名(小文字)]/[Module名(小文字)].nocache.js
- あと、<base>で基底を指定しておかないと、その他のjsファイルを読んでくれないっぽい。
- <base>で指定するのはhttp://[ホスト名]:[ポート番号]/[プロジェクト名]/[Module名(小文字)]/
- http://localhost:8123/GWTExample/gwtexample/とか
- <base>で指定するのはhttp://[ホスト名]:[ポート番号]/[プロジェクト名]/[Module名(小文字)]/
<?xml version="1.0" encoding="UTF-8"?> <Module> <ModulePrefs title="GWT Example" author_email="xxx@xxxxx"> <Require feature="opensocial-0.8" /> </ModulePrefs> <Content type="html" view="canvas"><![CDATA[ <script type="text/javascript"> var contextUrl = "http://localhost:8123/GWTExample/"; function loadJs() { var module = "gwtexample"; var baseUrl = contextUrl + module; var base = document.createElement("base"); base.href = baseUrl + "/"; document.getElementsByTagName("head")[0].appendChild(base); var script = document.createElement("script"); script.src = baseUrl + "/" + module + ".nocache.js"; script.type = "text/javascript"; document.getElementsByTagName("head")[0].appendChild(script); }; loadJs(); </script> ]]></Content> </Module>
- 修正したgadget.xmlファイルをtargetフォルダにコピーする。
実行
- Shindigを起動する。
- プロジェクトルート直下のgadget.xmlを選択し、[Run application locally]で実行する。
- ところがEclipseのブラウザでは動かないので(原因不明)、URLをコピーしてWebブラウザで表示させる。
- 案外動くもんです…
gadgets.io.makeRequest()のコールバックメソッドにJava(GWT)側のメソッドを指定した場合
- コールバックメソッドから、そのメソッドが属するクラスの他のメンバにアクセスできない。
- 原因の詳細と対処方法はGWTの「JavaScriptから呼び出されるコールバックメソッド内から他のメンバにアクセスできない」にて
OpenSocial 0.9がちっとも動かない…
- JavaScirptのエラーでクラスやメソッドが未定義と言われたり…
var req = opensocial.newDataRequest();
としても'opensocial.Container.get() is null'と怒られる。
- 0.9からはOSAPIというのが新たに追加
- 0.8までのAPIを整理し簡便化したもの?
- <Require feature="osapi">で利用可能。既存のAPIと定義が被らない様にしている。
- だから、既存のAPIは<Require feature="opensocial-0.9">を使って、引き続き利用可能っぽいのに…。0.9はおとなしくOSAPIを使うべき?
- でもまぁ、mixiではまだ非対応っぽいので、しばらく放置しておこう…