TimeTree APIを使ってみる
「TimeTree Developer Platform」の記載内容を参考に進めます。
はじめに
- TimeTreeのアカウントを作成済みであることを前提とします。
- 検証の際に使用したOSはWindows 10です。
- Nodeはインストール済みです。
パーソナルアクセストークンの発行
「パーソナルアクセストークンの発行ページ」にて、パーソナルアクセストークンを発行します。
- ページを開き、「トークンの作成」ボタンをクリックします。
- 「トークン名」に適切なトークン名を入力し、「TimeTree開発者ガイドラインに同意します。」にチェックを入れて「作成」ボタンをクリックします。
- アクセストークンが発行されるので、内容をコピーし保存しておきます。
アクセストークンを用いたCurlでの確認
取得したパーソナルアクセストークンを使用して、Curlにて動作確認を行います。
以下の内容のbatファイルを作成し、ダブルクリックして実行します。({accessToken}は取得したアクセストークンで置き換えてください。)
@echo off
set accessToken="{accessToken}"
set responseFileName="GetUer-Response.json"
rem 日本語化
chcp 65001
curl -X GET^
"https://timetreeapis.com/user"^
-H "Accept: application/vnd.timetree.v1+json"^
-H "Authorization: Bearer %accessToken%"^
-o "%responseFileName%"
pause
成功すると以下の内容のGetUser-Response.jsonが作成されます。(***の箇所には適切なデータが入ってきます。)
{
"data": {
"id": "***",
"type": "user",
"attributes": {
"name": "***",
"description": "***",
"image_url": null
}
}
}
アクセストークンが使用可能であることが確認できたので、以降、Node.jsによる実装を進めます。
Node.jsによる実装
適当なフォルダを作成し、コマンドプロンプトで作成したフォルダに移動します。
以下のコマンドを実行し、初期化します。
npm init
いろいろと聞かれますが、Enterキーを連打します。
次に、同一フォルダにてExpress、ejs、config、requestをインストールします。
npm install express
npm install ejs
npm install config
npm install request
以下のようなpackage.jsonが作成されます。(scriptsの内容を手動で修正しています。)
{
"name": "{name}",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"start": "node app.js"
},
"author": "",
"license": "ISC",
"dependencies": {
"config": "^3.3.1",
"ejs": "^3.1.2",
"express": "^4.17.1",
"request": "^2.88.2"
}
}
以下の構成になるように、app.jsファイル、timetreeModule.jsファイル、viewsフォルダ、index.ejsファイル、configフォルダ、default.jsonファイルをそれぞれ作成します。
{作成したフォルダ}
┣ node_modules
┃ ┗ …
┣ config
┃ ┗ default.json
┣ views
┃ ┗ index.ejs
┣ app.js
┣ package-lock.json
┣ package.json
┗ timetreeModule.js
それぞれ以下のような内容とします。
var express = require('express');
var app = express();
var timeTreeModule = require('./timetreeModule');
app.set("view engine", "ejs");
app.get('/', (req, res) => {
timeTreeModule.getUser(function(result) {
res.render("index",{
data: JSON.parse(result).data
});
});
});
var port = process.env.PORT || 3000;
app.listen(port, () => {
console.log('Start server port:3000');
})
var conf = require('config');
var request= require('request');
// ユーザの取得
exports.getUser = function(callback) {
var headers = {
'Accept': 'application/vnd.timetree.v1+json',
'Authorization':'Bearer ' + conf.accessToken
}
var options = {
url: 'https://timetreeapis.com/user',
method: 'GET',
headers: headers
}
request(options, function(error, response, body) {
callback(body);
})
}
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Page Title</title>
</head>
<body>
<h1>確認ページ</h1>
<!-- コードから渡されたデータを表示-->
<table>
<tr>
<th>名前</th><td><%=data.attributes.name %></td>
</tr>
<tr>
<th>説明</th><td><%=data.attributes.description %></td>
</tr>
</table>
</body>
</html>
{
"accessToken": "{取得したアクセストークン}"
}
作成後、コマンドプロンプトにて以下のコマンドを実行し、起動します。
npm start
ブラウザでhttp://localhost:3000にアクセスします。ユーザ名と説明が表示されることを確認します。
最後に
説明不足箇所が多々あるため、時間があれば追記します。
また、今回はユーザ情報を取得するAPIを使用するにとどまったため、他のAPIを使用する例についても時間があれば追記します。