Facebookアプリの作成(C#+Windows Azure) その3
Facebookアプリの作成(C#+Windows Azure) その1及びその2では、Facebookアプリをローカルでデバッグするところまで作成しましたが、今回は、これをクラウド上に公開するまでの手順を紹介します。
1 Windows Azureの利用(1) Webサイトの作成
Windows Azure のポータルサイトにログインし、一覧から「WEBサイト」を選択した状態で、左下の「+新規」を押すと「WEBサイト」の作成が始まります。

ポップアップしたウインドウの中で「WEBサイト」「簡易作成」を選択します。
続いて「URL」に重複しない名前(ここでは、「sample-fb-pg」としました)「地域」で「東アジア」を選択し、右下の「サイトの作成」を押します。
指定した「URL」から、最終的にアクセスするURLは、「sample-fb-pg.azurewebsites.net」となりますが、このURLは、後でFacebookの基本設定に入力する内容のため、記録しておいてください。
※「東アジア」は香港の事で、日本で使用する場合、現時点(2013.08)では一番お勧めのようです。

ほんの数秒で、サイトが新たに作成されていることが確認できます。

(2) 発行プロファイルのダウンロード
新規に作成したWEBサイトを選択し、表示された「ダッシュボード」で「発行プロファイルのダウンロード」を選択して下さい。

ダウンロードした「発行プロファイル」は、後で利用しやすい場所に保存しておいて下さい。

(3) 発行プロファイルのインポートとデプロイ
ソリューションエクスプローラでプロジェクト「WebRole1」を右クリックして「発行」を選択してください。

「Webを発行」ダイアログで「インポート(I)..」ボタンを押し、表示されて「発行プロファイルのインポート」ダイアログで「参照」ボタンを押して、先ほどダウンロードした「発行プロファイル」を選択します。

この時点で「発行」を押すと、コンパイル、デプロイが完了します。

「デプロイ」後、継続してAzure上のプログラムがリクエストされますが、この時点では、まだ設定が完了していないため、ページを表示することはできません。

この時点で、ブラウザのリクエストは下記のようなものになっています。
http://localhost:81/facebookredirect.axd?code=xxxxxxxxxxxxxxxx
これは、FacebookSDKの認証動作の中で、設定した「http://localhost:81」にリダイレクトした段階で、処理が継続できなくなっているためです。後は、設定を変更して、このエラーを排除することになります。2 設定変更(1)Facebookの基本設置変更
ローカルでデバッグしていたものを、今後はクラウド上で動作させるためFacebookの「基本設定」で「キャンパスのURL」を「http://localhost:81/」から、「http://sample-fb-pg.azurewebsites.net/」に変更します。

(2)Web.configの文字列変更
Web.configの「canvasUrl」も同様に修正します
[csharp highlight="6"]
</entityFramework>
<facebookSettings
appId = "12345678"
appSecret = "xxxxxxxxxxxxxxxxxxxxx"
canvasPage = "http://apps.facebook.com/sample_fb_pg"
canvasUrl = "http://sample-fb-pg.azurewebsites.net/" />
</configuration>
|
(1)Facebookの基本設置変更
ローカルでデバッグしていたものを、今後はクラウド上で動作させるためFacebookの「基本設定」で「キャンパスのURL」を「http://localhost:81/」から、「http://sample-fb-pg.azurewebsites.net/」に変更します。
(2)Web.configの文字列変更
Web.configの「canvasUrl」も同様に修正します[csharp highlight="6"]
</entityFramework>
<facebookSettings
appId = "12345678"
appSecret = "xxxxxxxxxxxxxxxxxxxxx"
canvasPage = "http://apps.facebook.com/sample_fb_pg"
canvasUrl = "http://sample-fb-pg.azurewebsites.net/" />
</configuration>
|