プロジェクト管理やタスク管理を行えるツール「Backlog」のAPIを使用する機会があったのでメモ。
APIキーの発行
Backlog APIの認証方法は、APIキーとOAuth 2.0が提供されているようです。
今回はAPIキーを使用する方法で試してみます。
Backlogにログインして、右上のユーザーメニューから個人設定を選択します。
左メニューのAPIを選択して、APIの登録をクリックします。
下部にAPIキーが表示されるので、コピーしておきます。
これでAPIキーの発行が完了しました。
使い方
実際にBacklog APIのうちいくつか試してみます。
詳しくは公式のリファレンスをご確認ください。
スペース情報の取得
まずはBacklogのスペース情報の取得を試してみます。
const API_KEY = 'BacklogのAPIキー'; const BACKLOG_URL = 'BacklogのURL'; const ENDPOINT = '/api/v2/space'; const queryParams = new URLSearchParams(); if (API_KEY) queryParams.append('apiKey', API_KEY); const url = `${BACKLOG_URL}${ENDPOINT}?${queryParams.toString()}`; async function fetchBacklogApi() { try { const response = await fetch(url, { method: 'GET' }); if (!response.ok) { throw new Error(`API error: ${response.status} ${response.statusText}`); } const data = await response.json(); console.log(JSON.stringify(data, null, 2)); } catch (error) { console.error(error.message); } } fetchBacklogApi();
以下のような形式の内容が返ってきました。
{ "spaceKey": "xxxxx", "name": "XXXXX", "ownerId": xxxxxxx, "lang": "ja", "timezone": "Asia/Tokyo", "reportSendTime": "HH:MM:DD", "textFormattingRule": "markdown", "created": "YYYY-MM-DDTHH:MM:DDZ", "updated": "YYYY-MM-DDTHH:MM:DDZ" }
プロジェクト一覧の取得
プロジェクト一覧の取得を試してみます。
const API_KEY = 'BacklogのAPIキー'; const BACKLOG_URL = 'BacklogのURL'; const ENDPOINT = `/api/v2/projects`; const queryParams = new URLSearchParams(); if (API_KEY) queryParams.append('apiKey', API_KEY); const url = `${BACKLOG_URL}${ENDPOINT}?${queryParams.toString()}`; async function fetchBacklogApi() { try { const response = await fetch(url, { method: 'GET' }); if (!response.ok) { throw new Error(`API error: ${response.status} ${response.statusText}`); } const data = await response.json(); console.log(JSON.stringify(data, null, 2)); } catch (error) { console.error(error.message); } } fetchBacklogApi();
以下のような形式の内容が返ってきました。
[ { "id": XXXXXX, "projectKey": "XXXXXX", "name": "XXXXXX", "chartEnabled": false, "useResolvedForChart": false, "subtaskingEnabled": false, "projectLeaderCanEditProjectLeader": false, "useWiki": true, "useDocument": true, "useFileSharing": true, "useWikiTreeView": true, "useSubversion": false, "useGit": true, "useOriginalImageSizeAtWiki": false, "textFormattingRule": "markdown", "archived": false, "displayOrder": 20000, "useDevAttributes": true }, ~略~ ]
プロジェクトの最近の活動の取得
プロジェクトの最近の活動の取得を試してみます。
const API_KEY = 'BacklogのAPIキー'; const BACKLOG_URL = 'BacklogのURL'; const PROJECT_KEY = 'プロジェクトキー'; const ENDPOINT = `/api/v2/projects/${PROJECT_KEY}/activities`; const queryParams = new URLSearchParams(); if (API_KEY) queryParams.append('apiKey', API_KEY); const url = `${BACKLOG_URL}${ENDPOINT}?${queryParams.toString()}`; async function fetchBacklogApi() { try { const response = await fetch(url, { method: 'GET' }); if (!response.ok) { throw new Error(`API error: ${response.status} ${response.statusText}`); } const data = await response.json(); console.log(JSON.stringify(data, null, 2)); } catch (error) { console.error(error.message); } } fetchBacklogApi();
以下のような形式の内容が返ってきました。
[ { "id": XXXXXXXXX, "project": { "id": XXXXXX, "projectKey": "XXXXXXX", "name": "XXXXXXX", ~略~ }, "type": 2, "content": { "id": XXXXXXXXX, "key_id": 1, "summary": "XXXXXX", "description": "XXXXXX", "comment": { "id": XXXXXXXXX, "content": "XXXXXX" }, "changes": [ { "field": "status", "field_text": "状態", "new_value": "2", "old_value": "1", "type": "standard" } ], "attachments": [], "shared_files": [], "external_file_links": [] }, "notifications": [], "createdUser": { "id": XXXXXXX, "userId": "XXXXXXXXXX", "name": "XXXXXX", "roleType": 1, "lang": "ja", "mailAddress": "XXXXXXXXXX", "nulabAccount": { "nulabId": "XXXXXXXXXX", "name": "Y", "uniqueId": "XXXXXXXXXX", "iconUrl": "XXXXXXXXXX" }, "keyword": "XXXXXXXXXX", "lastLoginTime": "YYYY-MM-DDTHH:MM:DDZ" }, "created": "YYYY-MM-DDTHH:MM:DDZ" }, ~略~ ]
課題一覧の取得
課題一覧の取得を試してみます。
const API_KEY = 'BacklogのAPIキー'; const BACKLOG_URL = 'BacklogのURL'; const ENDPOINT = `/api/v2/issues`; const queryParams = new URLSearchParams(); if (API_KEY) queryParams.append('apiKey', API_KEY); const url = `${BACKLOG_URL}${ENDPOINT}?${queryParams.toString()}`; async function fetchBacklogApi() { try { const response = await fetch(url, { method: 'GET' }); if (!response.ok) { throw new Error(`API error: ${response.status} ${response.statusText}`); } const data = await response.json(); console.log(JSON.stringify(data, null, 2)); } catch (error) { console.error(error.message); } } fetchBacklogApi();
以下のような形式の内容が返ってきました。
[ { "id": XXXXXXXXX, "projectId": XXXXXX, "issueKey": "XXXXXXXXXX", "keyId": 1, "issueType": { "id": XXXXXXX, "projectId": XXXXXX, "name": "要望", "color": "#ff9200", "displayOrder": 2 }, "summary": "XXXXXXXXXX", "description": "XXXXXXXXXX", "resolution": null, "priority": { "id": 3, "name": "中" }, "status": { "id": 2, "projectId": XXXXXX, "name": "処理中", "color": "#4488c5", "displayOrder": 2000 }, "assignee": { "id": XXXXXXX, "userId": "XXXXXXXXXX", "name": "XXXXXXXXXX", "roleType": 1, "lang": "ja", "mailAddress": "XXXXXXXXXX", "nulabAccount": { "nulabId": "XXXXXXXXXX", "name": "XXXXXXXXXX", "uniqueId": "XXXXXXXXXX", "iconUrl": "XXXXXXXXXX" }, "keyword": "XXXXXXXXXX", "lastLoginTime": "YYYY-MM-DDTHH:MM:DDZ" }, "category": [], "versions": [], "milestone": [], "startDate": null, "dueDate": null, "estimatedHours": null, "actualHours": null, "parentIssueId": null, "createdUser": { "id": XXXXXXX, "userId": "XXXXXXXXXX", "name": "Y", "roleType": 1, "lang": "ja", "mailAddress": "XXXXXXXXXX", "nulabAccount": { "nulabId": "XXXXXXXXXX", "name": "XXXXXXXXXX", "uniqueId": "XXXXXXXXXX", "iconUrl": "XXXXXXXXXX" }, "keyword": "XXXXXXXXXX", "lastLoginTime": "YYYY-MM-DDTHH:MM:DDZ" }, "created": "YYYY-MM-DDTHH:MM:DDZ", "updatedUser": { "id": XXXXXXX, "userId": "XXXXXXXXXX", "name": "XXXXXXXXXX", "roleType": 1, "lang": "ja", "mailAddress": "XXXXXXXXXX", "nulabAccount": { "nulabId": "XXXXXXXXXX", "name": "XXXXXXXXXX", "uniqueId": "XXXXXXXXXX", "iconUrl": "XXXXXXXXXX" }, "keyword": "XXXXXXXXXX", "lastLoginTime": "YYYY-MM-DDTHH:MM:DDZ" }, "updated": "YYYY-MM-DDTHH:MM:DDZ", "customFields": [], "attachments": [], "sharedFiles": [], "externalFileLinks": [], "stars": [] } ~略~ ]
課題コメントの取得
課題コメントの取得を試してみます。
const API_KEY = 'BacklogのAPIキー'; const BACKLOG_URL = 'BacklogのURL'; const ISSUE_KEY = '課題のキー'; const ENDPOINT = `/api/v2/issues/${ISSUE_KEY}/comments`; const queryParams = new URLSearchParams(); if (API_KEY) queryParams.append('apiKey', API_KEY); const url = `${BACKLOG_URL}${ENDPOINT}?${queryParams.toString()}`; async function fetchBacklogApi() { try { const response = await fetch(url, { method: 'GET' }); if (!response.ok) { throw new Error(`API error: ${response.status} ${response.statusText}`); } const data = await response.json(); console.log(JSON.stringify(data, null, 2)); } catch (error) { console.error(error.message); } } fetchBacklogApi();
以下のような形式の内容が返ってきました。
[ { "id": XXXXXXXXX, "projectId": XXXXXX, "issueId": XXXXXXXXX, "content": "XXXXXXXXXX", "changeLog": [ { "field": "status", "newValue": "処理中", "originalValue": "未対応", "attachmentInfo": null, "attributeInfo": null, "notificationInfo": null } ], "createdUser": { "id": XXXXXXX, "userId": "XXXXXXXXXX", "name": "XXXXXXXXXX", "roleType": 1, "lang": "ja", "mailAddress": "XXXXXXXXXX", "nulabAccount": { "nulabId": "XXXXXXXXXX", "name": "XXXXXXXXXX", "uniqueId": "XXXXXXXXXX", "iconUrl": "XXXXXXXXXX" }, "keyword": "XXXXXXXXXX", "lastLoginTime": "YYYY-MM-DDTHH:MM:DDZ" }, "created": "YYYY-MM-DDTHH:MM:DDZ", "updated": "YYYY-MM-DDTHH:MM:DDZ", "stars": [], "notifications": [] } ~略~ ]
今回試した以外にもいろいろな種類があるので、詳しくは公式のリファレンスを確認してみてください。
コメントが承認されるまで時間がかかります。