chromeウェブストア - html5とか勉強会42
DESCRIPTION
TRANSCRIPT
Chrome ウェブストア
• Hosted アプリ– Web サーバから必要なファイルが提供される
• Packaged アプリ– 必要なファイル群が Chrome にインストール
される
• 拡張機能– Chrome に便利な機能を追加する
The Chrome Web Store lets you publish apps and games – either free or paid – where Google Chrome users can easily find them.
開発者
ユーザー
登録
The Chrome Web Store lets you publish apps and games – either free or paid – where Google Chrome users can easily find them.
開発者
ユーザー発見
開発者
ユーザー発見
利用
The Chrome Web Store lets you publish apps and games – either free or paid – where Google Chrome users can easily find them.
開発者 ユーザー
開発者 ユーザー
決済機能の開発が必要
開発者
ユーザー
開発者
ユーザー
種別 アプリでの利用 拡張機能での利用
アプリ自体の販売（ 1 回、定期購入） ○ ×アプリ内課金（デジタルグッズなどの販売）
○ ○広告の掲載 ○ ○
アプリ自体の販売
・・・ Chrome ウェブストア決済
• 1 回払い• 月間登録料• 年間登録料
• 無料試用版
無料試用版
• Hosted アプリ– Licensing API
• Packaged アプリ– 機能制限版とフル機能版の 2 つをリリース
Licensing API
• OpenID 認証を行う• ライセンスサーバにリクエストを送る• 購入状況によって機能を制限する
https://www.googleapis.com/chromewebstore/v1/licenses/[AppId]/[UserID]
https://www.googleapis.com/chromewebstore/v1/licenses/[AppId]/[UserID]
+ 署名
# Licensing API のエンドポイントENDPOINT = 'https://www.googleapis.com/chromewebstore/v1/licenses'# アプリ IDAPP_ID = '...'# OAuth トークンOAUTH_TOKEN = '...'# OAuth トークンシークレットOAUTH_TOKEN_SECRET = '...'
# ユーザーの OpenID URL 文字列user_id = ...# OAuth クライアントの生成client = Signet::OAuth1::Client.new( :client_credential_key => 'anonymous', :client_credential_secret => 'anonymous', :token_credential_key => OAUTH_TOKEN, :token_credential_secret => OAUTH_TOKEN_SECRET)# リクエストの送信response = client.fetch_protected_resource( :uri => "ENDPOINT/#{app_id}/#{CGI::escape(user_id)}")# 結果の取得result = JSON.parse(response.body)
{ "kind": "chromewebstore#license", "id": "appId/userId", "appId": "appId", "userId": "userId", "result": "YES", "accessLevel": "FULL", "maxAgeSecs": "3600",}
result値 accessLevel値 状況YES FULL ユーザーはアプリに課金している。YES FREE_TRIAL ユーザーはアプリに課金してなく、
無料試用版を使うべき。NO NONE ユーザーはアプリに課金してなく、
アプリにアクセスしていない。
アプリ内課金
・・・ Google In-App Payments API for Web
開発者のサーバ
星を手に入れる
購入
①
②API コール
③
Google のサーバ 開発者のサーバ
通知
④
通知
⑤
星を手に入れた !
⑥
JWT の生成
{ "iss": " 購入者 ID", "aud": "Google", "typ": "google/payments/inapp/item/v1", "exp": "1358678162", "iat": "1358674585", "request": { "name": "Red potion", "description": "It increases the hit point.", "price": "2.50", "currencyCode": "USD", "sellerData": "user_id:123,transaction_id:98765" }}
SELLER_IDENTIFIER = ' 販売者 ID'SELLER_SECRET = ' 販売者の秘密鍵 '
token = JWT.encode({ 'iss' => SELLER_IDENTIFIER, 'aud' => 'Google', 'typ' => 'google/payments/inapp/item/v1', 'exp' => (Time.now + 3600).to_i, 'iat' => Time.now.to_i, 'request' => { 'name' => 'Red potion', 'description' => 'It increases the hit point.', 'price' => '2.50', 'currencyCode' => 'USD', 'sellerData' => 'user_id =>123,transaction_id =>98765' }}, SELLER_SECRET)
eyJ0eXAiOiJKV1QiLA0KICJhbGciOiJIUzI1NiJ9.eyJpc3MiOiJqb2UiLA0KICJleHAiOjEzMDA4MTk-zODAsDQogImh0dHA6Ly9leGFtcGxlLmNvb-S9pc19yb290Ijp0cnVlfQ.dBjftJeZ4CVP-mB92K27uhbUJU1p1r_wW1gFWFOEjXk
開発者のサーバ
星を手に入れる
購入
①
②API コール
③
Google のサーバ 開発者のサーバ
通知
④
通知
⑤
星を手に入れた !
⑥
buy() 関数の呼び出し 購入画面
<script type="text/javascript" src="http://www.google.com/jsapi"></script><script type="text/javascript"> google.load('payments', '1.0', { 'packages': ['sandbox_config'] });</script>
var generatedJwt = ...;
document.getElementById("buy").onclick = function(evt) { purchase();};
function purchase() { ... goog.payments.inapp.buy({ jwt: generatedJwt, success: function(result) { ... }, failure: function(result) { ... } });}
開発者のサーバ
星を手に入れる
購入
①
②API コール
③
Google のサーバ 開発者のサーバ
通知
④
通知
⑤
星を手に入れた !
⑥
ポストバックURL の呼び出
し
{ "iss": "Google", "aud": " 購入者 ID", "typ": "google/payments/inapp/item/v1/postback/buy", "exp": "1358678162", "iat": "1358674585", "request": { "name": "Red potion", "description": "It increase ｓ the hit point.", "price": "2.50", "currencyCode": "USD", "sellerData": "user_id:12345,transaction_id:98765" }, "response": { "orderId": "3485709183457474939449" }}
SELLER_SECRET = ' 販売者の秘密鍵 '
encoded_jwt = params['jwt']item_token = JWT.decode(encoded_jwt, SELLER_SECRET)order_id = item_token['response']['orderId']
# デコードされた内容に基づいて、注文内容を確認し、# 必要があればデータベースに注文完了を書き込む
render text: order_id
開発者のサーバ
星を手に入れる
購入
①
②API コール
③
Google のサーバ 開発者のサーバ
通知
④
通知
⑤
星を手に入れた !
⑥
コールバック関数の呼び出
し
var generatedJwt = ...;
document.getElementById("buy").onclick = function(evt) { purchase();};
function purchase() { ... goog.payments.inapp.buy({ jwt: generatedJwt, success: function(result) { ... }, failure: function(result) { ... } });}
• Hosted アプリ– Available.
• Packaged アプリ– Can use on the dev channel.
Tax
付加価値税
• 購入するユーザーと開発者の直接契約– 納税する責任は開発者にある
国ごとに法律が異なる
• 税率の違い• 購入者が国外にいた時の扱い• 納税免除の下限額の違い
・・・知らなかった、では済まされない
• 田中 洋一郎– Google Developers Expert (Chrome)– LINE 株式会社 開発 1 センター所属
End