Yahoo!ボックスAPI Hackathon向け資料
>100 Views
February 28, 14
スライド概要
2023年10月からSpeaker Deckに移行しました。最新情報はこちらをご覧ください。 https://speakerdeck.com/lycorptech_jp
関連スライド
各ページのテキスト
Yahoo!ボックスAPI Hackday資料 Yahoo! JAPAN ヤフー株式会社 スマートデバイス戦略室 スマートデバイス開発本部 開発2部 瀬川 秀樹
本日の内容 １．Yahoo!ボックス紹介 - サービス紹介 - デベロッパー様へご案内 ２．付録：１．アプリケーションの開発はじめの一歩 - アプリケーションIdの取得から アクセストークン取得のフロー ３．付録：２．ボックスAPIを使ってみよう - サンプルコードによるボックスAPIの使い方解説 2
Yahoo!ボックスサービス概要 Yahoo!ボックスとは 写真や文書など、あらゆるファイルをサーバ上に置 いて管理できるサービスです。置いてあるファイルは ネット全体に公開して共有することもできます。 3
1000万人突破！ ユーザ数 4
堅牢性の高い設計で 何重にもデータをバックアップ 5
国内サーバ＋バックボーンの回線が同業他社に比べて 圧倒的 6
そんなYahoo!ボックスがAPIを 公開 7
APIを使えばオンライン上のファイルの アップロード、ダウンロード、 コピー、移動、削除、公開 などができます 8
本日デベロッパーの皆さまに お伝えしたい事 9
ボックスAPIを使って サービスを 作ってみませんか！？ 10
Yahoo! JAPAN ID所有者全てに リーチ出来るアプリを開発できる! 11
デカイIDを持つプラットフォームが あるんだからそれに 乗っかっちゃってください 乗らない手はありません 12
今回のテーマは 未来のテレビの楽しみ方 皆さんは何を作りますか？ 13
テレビの楽しみ方 必ずしも テレビ単体で楽しまれている訳ではない 実況 検索 テレビを中心としながら それに付随する情報で 盛り上がる 投稿&参照 ながらながら・・・ 14
翌日学校や会社で話題になる時代から リアルタイムでLINEやTwitterでシェア される時代へ 例えばオリンピックの個人実況など・・・ スピードが上がっている 15
Yahoo!ボックスAPIを 使っていただければ 16
Twitterのつぶやきなどの テキストデータ 17
写真や動画
ドキュメント 19
ファイルの公開・共有 20
あらゆるデータを自由に保存・ 引き出すことができます 21
端末のストレージ領域に縛られることなく オンライン上にあるファイルを使った 自由な発想 22
！ なサービス 23
デベロッパーの皆さまにも ！ なサービスを作ってほしい 24
それでは楽しい開発を！ ご静聴ありがとうございました 25
ここからはサンプルコードを 含めたデベロッパー向け解説ページです 26
アプリケーションの開発 はじめの⼀一歩 27
アプリケーションIDの取得 アプリを開発するためにはアプリケーションIDが必要です。 Yahoo!デベロッパーネットワークで取得してください。 はじめて開発する方はこちら すでにアプリケーションIDを 持っている方はこちら 28
認証を通して使用するAPIの決定 アプリケーションIDにスコープ（アプリが使用する機能） を設定します。 利用するスコープに 「ボックス参照・更新機能」を入れてください。 29
アプリケーションIDの確認 アプリで使うので控えておきます 30
アクセストークンの取得⽅方法 31
YConnect YConnect OAuth2.0の仕様に準拠した認可機能 http://developer.yahoo.co.jp/yconnect/ アプリがWebAPIへアクセスするための 「アクセストークン」を取得するための認可フロー 32
YConnectユーザ認可の取得（ユーザからの見え方） 認証コード このアプリがユーザーに対して Yahoo!の各リソースへアクセスする 許可を求める画面です。 33
トークン、リフレッシュトークンの取り方（authorization)
// 1.認証コードを取得画⾯面を表⽰示
$appid = 'dj0zaiZpPTZqSVJ5TW80NHh-‐‑‒-‐‑‒-‐‑‒-‐‑‒-‐‑‒-‐‑‒-‐‑‒-‐‑‒-‐‑‒-‐‑‒-‐‑‒-‐‑‒-‐‑‒-‐‑‒-‐‑‒';
$url = ʻ‘https://auth.login.yahoo.co.jp/yconnect/v1/authorizationʼ’;
$params = '?response_̲type=code+id_̲token&client_̲id='.$appid.'&redirect_̲uri=oob&scope=openid&nonce=aaddeeff';
$url .= $params;
header(ʻ‘Location: ʼ’.$url); // アプリケーションでYahoo!の認証画⾯面にリダイレクト
// 2.トークン取得エンドポイントにリクエストしてトークン、リフレッシュトークンを取得する
$appid = ʻ‘YJDNで取得するアプリケーションIDʼ’;
$secret = ʻ‘YJDNで取得するシークレットʼ’;
$code = ʻ‘1.で取得してユーザに⼊入⼒力力させた認証コードʼ’;
$url = ʻ‘https://auth.login.yahoo.co.jp/yconnect/v1/tokenʼ’; // トークン取得エンドポイント
$params = 'grant_̲type=authorization_̲code&';
$params .= 'code=ʻ‘.$code;
$params .='&redirect_̲uri=oob';
$headers = array(
'Content-‐‑‒Type: application/x-‐‑‒www-‐‑‒form-‐‑‒urlencoded;charset=UTF-‐‑‒8',
'Authorization: Basic '.base64_̲encode($appid.':'.$secret),
);
$curl = curl_̲init();
curl_̲setopt($curl, CURLOPT_̲URL, $url_̲token);
curl_̲setopt($curl, CURLOPT_̲POST, true);
curl_̲setopt($curl, CURLOPT_̲RETURNTRANSFER, true);
curl_̲setopt($curl, CURLOPT_̲POSTFIELDS, $params);
curl_̲setopt($curl, CURLOPT_̲HTTPHEADER, $headers);
curl_̲setopt($curl, CURLOPT_̲VERBOSE, true);
$result = curl_̲exec($curl);
curl_̲close($curl);
34
トークン取得エンドポイントのレスポンスの例
string(1249)
"{"access_̲token":"6GMsysoGhJvbEry5lYWU2ea3XsE7T4_̲xDq0tfAA1_̲AY5KiciO4QCCZEvrHUYUxySI43Vg4
rbdaQsdHrB0SmRDvjM.v4vBmWA8rmeX4qZzkqbt9BO9vZdoyfCYfDveBKN2ob8aatXQVECksRTH3WOQDFj
CcmRwnlgWCq0vyn.
1qs2Lm4OABpvyJ60bNclYp4bYnLnfg_̲2CWlSasQMzZFNddtRjd5HawBfe9nKUUfUOrybyqdefOKqR8B8lyHXT
92X1OL8w9vmEbsEA2wmYHek3yzM93RuhpstpEANARSI_̲JYX.vZLDrYuugFoP8S.Nr6rilL.
8SNyAI5XnSJ8vnjKl5q8Y_̲ly9kLKxWW1q8ftj60v1uK.hHVn21iV8hVy.LXuX8LcHYhKr2OBB4PHfJBRGCvbPay
rY3mmOL63C92Duo_̲Tnwqwymf6SQxWQu6O4KA8S0OgVJWFIsVaSxOtEcQwTJIc.RL1bvr6pQuysvEce5ZM
PWZi.U_̲6XqTFNLval1.OnqKWYSe0RQHK8Cj05GmoWRe7X7pCzwG2_̲pr0RLwjhlDkem.QXBDVpTahiLPEYK
C1O3s4rcuDVk4bPK4VaSX05EHnXHUn0oy5mjTZMaYULicpVw68K1nR5rpZ28VSR1BRiIPKcfCDdkTFx831p
B8CAALH67sKFJqGnvSonj6xoSwHDUoltpdBusP.Tw6okLb9HcpHEPLLFIweQwHyrg_̲A7SC8E7_̲VVBsG_̲H7h
DLjpq0Yo5gltrkE","token_̲type":"bearer","expires_̲in":"3600","refresh_̲token":"AJ5F3lI20AJ.
0kMFVZbABthjxGgNawjRERcbid5JFvhDdDsDovfP","id_̲token":"eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.ey
Jpc3MiOiJodHRwczpcL1wvYXV0aC5sb2dpbi55YWhvby5jby5qcCIsInVzZXJfaWQiOiJTVlE2WlI3V1lMUFlUTj
NPVEtURVROMkdEUSIsImF1ZCI6ImRqMHphaVpwUFRacVNWSjVUVzgwTkhoTlZTWnpQV052Ym5OMWJX
VnljMlZqY21WMEpuZzlOVFEtIiwiaWF0IjoxMzkwOTA0NTE3LCJleHAiOjEzOTMzMjM2ODQsIm5vbmNlIjoiYW
FkZGVlZmYifQ.H0qnX_̲1PuxbmD4F_̲YLa1IA-‐‑‒GCNqw5byLiciSM9VXxwQ"}“
acess_̲tokenとrefresh_̲tokenは保存しておく。
access_̲tokenの有効時間は3600s
その後はaccess_̲tokenが無効になるので、保存しておいたrefresh_̲tokenでaccess_̲tokenを更更新する。
refresh_̲tokenの期限切切れの場合はやり直して両⽅方を新規取得する。
35
トークンを使用してユーザのGuidを取得する ・Guidとは Yahoo! JAPAN IDをサービスで使わない（表⽰示しない）ために Yahoo! JAPAN IDに「⼀一対」になった代替ID （変わることはない） ・どうやって取るか YConnectで⽤用意されているUserInfoAPIへリクエストして取得する http://developer.yahoo.co.jp/yconnect/userinfo.html 36
取得したトークンでUserInfoAPIへリクエスト
・リクエスト（GET）
<?php
$access_̲token = ʻ‘取得したアクセストークンʼ’;
$httpHeader = array(
ʻ‘GET /yconnect/v1/attribute?schema=openid HTTP/1.1ʼ’,
ʻ‘Host: userinfo.yahooapis.jpʼ’,
ʻ‘Authorization: Bearer ʻ‘ . $access_̲token,
);
$curlSetOptArray = array(
CURLOPT_̲URL => 'https://userinfo.yahooapis.jp/yconnect/v1/attribute?
schema=openid',
CURLOPT_̲HTTPHEADER => $httpHeader,
CURLOPT_̲VERBOSE => true,
CURLOPT_̲SSL_̲VERYFYPEER => true,
CURLOPT_̲HEADER => true,
);
$ch = curl_̲init();
curl_̲setopt_̲array($ch, $curlSetOptArray($ch, $curlSetOptArray);
$result = curl_̲exec($ch);
curl_̲close($ch);
37
UserInfoAPI：レスポンス ・レスポンス {“user_̲id”:“SVQ6ZR7WYLPYTN3OTKTETN2GDQ” Guid(user_̲id)が返ってきます。（後ほど使います） 38
ボックスAPIを使ってみよう 39
ボックスの仕様 Sid（StorageID) ユーザに紐づくストレージ上の領域ID UniqId 各ファイル・フォルダに振られる ユニークID Sid＋UniqIdの組み合わせでストレージ上の オブジェクトを指定する 40
ボックスの仕様：公開について 公開URL 見せたいファイルを 公開状態にする 41 公開URLから いつでも参照できる
ボックスの仕様：公開のポイント ・継承公開 上位フォルダに公開設定をするとその配下全ての ファイル・フォルダも「継承公開」として公開状態になる仕様。 継承公開されているかどうかは 「PublicInherited」フラグで判断することができる。 ・コピー コピーすると、コピー先での予期せぬ公開を防ぐためコピー先 ファイル・フォルダの全ての公開情報がリセットされる。 ・移動 移動は公開状態が維持されたまま移動される。 Sid UniqIdは変わらない。 42
ボックスの仕様：継承公開について 公開 継承公開 継承公開 継承公開 継承公開 公開 継承公開 継承公開 43
ボックスAPIの使い方 サンプルコードを通してAPIの基本的な使い方を解説します。 フォルダ作成やアップロードなどの結果は実際にボックスを 確認しながら行ってみてください。 ユーザ情報取得 作成したフォルダ にアップロード フォルダ作成 44 アップロードした ファイルを公開する
ボックスユーザ情報取得：リクエスト <?php $access_̲token = ʻ‘取得したアクセストークンʼ’; $guid = ʻ‘取得したGuidʼ’; $url = ʻ‘https://ybox.yahooapis.jp/v1/user/fullinfo/ʼ’ . $guid; $httpHeader = array( ʻ‘Host:ybox.yahooapis.jpʼ’, ʻ‘Authorization: Bearer ʻ‘ . $access_̲token, ); $curlSetoptArray = array( CURLOPT_̲URL => $url, CURLOPT_̲HTTPHEADER => $httpHeader, CURLOPT_̲RETURNTRANSFER => true, CURLOPT_̲VERBOSE => true, CURLOPT_̲HEADER => true, ); $ch = curl_̲init(); curl_̲setopt_̲array($ch, $curlSetoptArray); $result = curl_̲exec($ch); curl_̲close($ch); 45
ボックスユーザ情報取得：レスポンス <?xml version="1.0" encoding="UTF-‐‑‒8"?> <User> <Guid>NG33XHXZ5GMCQBYUHODK5IFENQ</Guid> <isService>true</ServiceStatus> <isSuspend>false</ServicesSuspend> <QuotaOver>false</QuotaOver> <Sid>box-‐‑‒l-‐‑‒e7q4pp5kzdohdpe7vvheelgpce</Sid> （ユーザのSid） <RootUniqId>d9b6ed3f-‐‑‒3826-‐‑‒4f3b-‐‑‒a47f-‐‑‒5e09a73cbe69</RootIUniqId>（ユーザのルートデ ィレクトリ「/」（マイボックス）のUniqId） <Quota> <Max>53687091200</Max> 使⽤用できる容量量(Byte) <TotalUsed>2242518</TotalUsed> 現在使⽤用している容量量(Byte) </Quota> </User> 次：ルートディレクトリ「/」（マイボックス）のUniqIdが取得出来たので、ルートディレクトリにフォルダを作成する 46
フォルダ作成：リクエスト
$sid = ʻ‘ユーザのSidʼ’;
$uid = ʻ‘ルートディレクトリ「/」のUniqIdʼ’;
$access_̲token = ʻ‘取得したアクセストークンʼ’;
$url = 'https://ybox.yahooapis.jp/v1/file/' . $sid . '/'.$uid;
// フォルダ作成のボディ
$body = ʻ‘<?xml version=“1.0” encoding=“UTF-‐‑‒8”?><Object><Name>作成したいフォルダの名前</Name></Object>ʼ’;
$httpHeader = array(
'Host:ybox.yahooapis.jp',
'Authorization: Bearer ' . $access_̲token,
);
$curlSetoptArray = array(
CURLOPT_̲URL => $url,
CURLOPT_̲HTTPHEADER => $httpHeader,
CURLOPT_̲RETURNTRANSFER => true,
CURLOPT_̲VERBOSE => true,
CURLOPT_̲HEADER => true,
CURLOPT_̲POST => true,
CURLOPT_̲POSTFIELDS => $body,
);
$ch = curl_̲init();
curl_̲setopt_̲array($ch, $curlSetoptArray);
$result = curl_̲exec($ch);
curl_̲close($ch);
47
フォルダ作成：レスポンス
<?xml version="1.0" encoding="utf-‐‑‒8" ?>
<Object>
<Sid>box-‐‑‒l-‐‑‒svq6zr7wylpytn3otktetn2gdq-‐‑‒1004</Sid>
<UniqId>17c80ee0-‐‑‒612e-‐‑‒481b-‐‑‒b73b-‐‑‒3afaf59f1aa6</UniqId> 作成されたフォルダのUniqId
<Path><![CDATA[/作成したいフォルダの名前]]></Path>
<ModifiedTime>2014-‐‑‒02-‐‑‒06T19:56:32+09:00</ModifiedTime>
</Object>
次：フォルダにファイルをアップロードする
48
フォルダ作成されたか確認する ボックスWebを開いてフォルダが作成されたかどうか確認 49
アップロード：リクエスト
<?php
$token = ʻ‘アクセストークンʼ’;
$sid = ʻ‘ユーザのSidʼ’;
$uid = ʻ‘アップロードするフォルダのUniqIdʼ’;
$file = ʻ‘/tmp/test.jpgʼ’;
$file_̲name = ʻ‘test.jpgʼ’;
$body = file_̲get_̲contents($file);
$headers = array(
ʻ‘Authorization: Bearer ʼ’ . $token,
ʻ‘Content-‐‑‒Type: multipart/form-‐‑‒dataʼ’,
ʻ‘Content-‐‑‒length: ʻ‘ . filesize($file),
ʻ‘box-‐‑‒obj-‐‑‒sid: ʻ‘ . $sid,
ʻ‘box-‐‑‒obj-‐‑‒parentuniqid: ʻ‘ . $uid,
ʻ‘box-‐‑‒obj-‐‑‒filename: ʻ‘. $file_̲name,
ʻ‘box-‐‑‒obj-‐‑‒md5: ʻ‘ . Md5($body),
);
$url = 'https://upload.ybox.yahooapis.jp/v1/upload';
$curl = curl_̲init($url);
curl_̲setopt($curl,CURLOPT_̲HEADER, true);
curl_̲setopt($curl,CURLOPT_̲HTTPHEADER, $headers);
curl_̲setopt($curl,CURLOPT_̲POST,true);
curl_̲setopt($curl,CURLOPT_̲RETURNTRANSFER, true);
curl_̲setopt($curl,CURLOPT_̲POSTFIELDS,$body);
curl_̲setopt($curl,CURLOPT_̲VERBOSE,true);
$result = curl_̲exec($curl);
if(!curl_̲errno($curl)){
$response_̲header = curl_̲getinfo($curl);
}
curl_̲close($curl);
var_̲dump($result);
50
アップロード：レスポンス
<?xml version="1.0" encoding="utf-‐‑‒8" ?>
<Object>
<Name>test.jpg</Name>
<Sid>box-‐‑‒l-‐‑‒svq6zr7wylpytn3otktetn2gdq-‐‑‒1004</Sid>
<UniqId>0c703d7c-‐‑‒3e10-‐‑‒4af2-‐‑‒bccc-‐‑‒4539492a5c18</UniqId>アップロードされて発⾏行行された
UniqId
<Etag>"5ddf0bde1391418521237985"</Etag>
<ModifiedTime>2014-‐‑‒02-‐‑‒03T18:08:41+09:00</ModifiedTime>
<Path>/作成したいフォルダの名前/test.jpg</Path>
<Url>https://yoctfs.jp/res/box-‐‑‒l-‐‑‒svq6zr7wylpytn3otktetn2gdq-‐‑‒1004?
account=storage&expires=1391418642&uid=0c703d7c-‐‑‒3e10-‐‑‒4af2-‐‑‒
bccc-‐‑‒4539492a5c18&signature=NzY2ODkyM2MyNzc5YmQ1YWRmMmY1N2YxZWQ3NTh
kMWEyZDJmYjYyMg-‐‑‒-‐‑‒</Url>
</Object>
次：アップロードしたファイルを公開設定する
51
アップロードされたか確認する ボックスWebを開いてファイルがアップロードされたか確認 52
ファイル公開：リクエスト ・リクエスト：公開したいファイルのUniqIdを指定してリクエスト(PUT) $sid = ʻ‘ユーザのSidʼ’; $uid = ʻ‘公開したいファイルのUniqIdʼ’; $url = 'https://ybox.yahooapis.jp/v1/file/public/'.$sid.'/'.$fuid; $httpHeader = array( 'Host:ybox.yahooapis.jp', 'Authorization: Bearer ' . $access_̲token, ); $curlSetoptArray = array( CURLOPT_̲URL => $url, CURLOPT_̲HTTPHEADER => $httpHeader, CURLOPT_̲RETURNTRANSFER => true, CURLOPT_̲VERBOSE => true, CURLOPT_̲HEADER => true, CURLOPT_̲PUT => true, ); $ch = curl_̲init(); curl_̲setopt_̲array($ch, $curlSetoptArray); curl_̲exec($ch); $response_̲header = curl_̲getinfo($ch); curl_̲close($ch); 53
公開されたか確認してみる ボックスWebを開いてファイルが公開状態になっているか確認 54
参考資料 •Yahoo!デベロッパーネットワーク（ＹＪＤＮ） http://developer.yahoo.co.jp/ •ボックスAPI http://developer.yahoo.co.jp/webapi/box/ •YConnect http://developer.yahoo.co.jp/yconnect/ •Yahoo!ボックス http://info.box.yahoo.co.jp/index.html 写真素材：©株式会社データクラフト 55