• HOME
  • CODE
  • TaskworldのAPIを使って1クリック楽々タスク作成するページを自作する方法

2020/04/25 0:02

TaskworldのAPIを使って1クリック楽々タスク作成するページを自作する方法

皆様、職場ではTaskworld使ってますか?

毎回同じようなタスクの作成にポチポチポチポチするの…めんどくないですか?

「複製」っていう機能もあるけど、似たような案件タスクならテンプレ化されてたら楽だと思いませんか?

 

そこで今回ご紹介したいAPIを使った自作のフォーム作成方法をご紹介いたします。

 

TaskworldのAPIの使い方

 

TaskworldのAPIがなかなか便利になってまして、ポチっとクリックするだけでテンプレ化させてたタスクがサクサクと作成されます。

 

そのAPIを使ったツールの作り方を説明します。

作り方というか、プログラムの組み方(コードの書き方)です。

もし自分好みのタスク作成ツールが欲しいって時があれば参考にしてみてください。

 

ツール作成フロー

 

まずは必要となる作成の流れです。

 

①Postman(フリーソフト)

 

フリーソフト「Postman」で必要な情報を予め取得

 

②PHPでフォーム作成

 

情報を元にPHPでコーディングする

 

③フォームのファイルをアップロード

 

サーバーにアップして完成

 

簡単3ステップです。

でも思ったより設定がめんどいです。

 

以下、それぞれの詳細の解説です。

 

 

①Postman(フリーソフト)

 

無料のソフトで必要な情報を予め取得します。

まずはAPIを使って行くに当たって、認証からスタートになります。

 

フリーソフト「Postman」というものを使いますがインストールが必要です。

 

Postman : https://www.getpostman.com/

 

 

【必要となる情報を取得】

 

まず「access_token」が必要になります。

続いて「space_id」が必要になります。

さらにプロジェクトを識別する為のそれぞれの「project_id」と

そして参加メンバーのそれぞれのIDとなる「user_id」があるといいです。

 

もっと言えば、タグを付与したりするなら「tag_id」ってのも取得しておくといいです。

 

それらの取得をそれぞれチマチマとやっていきます。 Postmanの使い方は長くなるので下記のブログ参照です。

 

参考 : http://taskworld.blog.jp/how-to-api

 

 

 

②情報を元にPHPでコーディング、フォーム作成

 

Postmanである程度の「ID」関連を取得できたら、次にコーディングしていきます。

これはTaskworldのタスク作成に必要となる項目をフォームで実装するという事です。

 

今回もWordpressを使ったので、PHPファイルで作ってみました。

適当に「index.php」とか名前をつけて、下記のようなフォームを用意しましょう。

 

「index.php」

<form method="post" action="api.php">

 

<p>E-mail</p>

<input type="text" name="email" value="">

 

<p>Password</p>

<input type="password" name="password" value="">

 

<p>Space ID</p>

<input type="text" name="space_id" value="">

 

<p>Project</p>

<select name="project_id">

<option value="5cd7d24d702e050xxxxxxxx">プロジェクト1</option>

<option value="59edafd89a037d9xxxxxxxx">プロジェクト2</option>

<option value="5cd7d29cd141030xxxxxxxx">プロジェクト3</option>

</select>

 

<p>Task Name</p>

<input type="text" name="tasklist_name" value="">

<button id="task_create">タスク作成</button>

 

</form>

 

 

では各項目の説明となります。

 

・E-mail・Password

 

まず、メアドとパスを入力する項目があります。

これはTaskworldにログインする時のメアドとパスを入力する為のものです。

 

・Space ID

 

続いて「Space ID」ですが、Postmanで取得したやつを入力する為の項目です。

 

・Project

 

そしてプロジェクトですが、ここはセレクトボックスにしてます。

複数のプロジェクトを作って使ってる事が多いと思うのでそういう仕様にしました。

ここで、どのプロジェクト内にタスクを作るのかを選択できるようにしてます。

 

・Task Name

 

これはタスク自体のタイトルになる部分です。

入力したテキストがそのままタスクのタイトルとなります。

 

では次に上記フォームのaction先となる「api.php」のファイルを作ります。

フォームのボタン実行後のファイルとなります。

 

「api.php」

 

<?php

// フォームからの情報を起こす

$base_url = 'https://asia-api.taskworld.com/v1/';

$email = $_POST['email'];

$password = $_POST['password'];

 

$space_id = $_POST['space_id'];

$project_id = $_POST['project_id'];

$title_list = $_POST['tasklist_name'];

 

// 処理START ---------------------------------------------------------------------

 

// 処理1. タスクリストを登録(新規作成)

$query = [

'email' => $email,

'password' => $password

];

$res = send_json_post($base_url . 'auth', $query);

 

// アクセストークン -------------------------------------------------------------------

 

// アクセストークンを取得

$access_token = $res['access_token']; // 先行処理で登録したタスクリストのIDを指定

 

// user_id一覧を定義

$yamada = '59fac4a1e020232xxxxxxx'; //ヤマダさん

$satou = '59fc36014df064bxxxxxxx'; //サトウさん

$suzuki = '59fc0107b2fa10xxxxxxx'; //スズキさん

 

//プロジェクトによってユーザーIDを指定。is_assigneeはtrueかfalseで担当者とフォロワーを区別

if($project_id == "5cd7d24d702e05000xxxxxxx") { //プロジェクト1なら

$members_main = [$yamada]; //ヤマダさんが担当

$members_sub = [$satou, $suzuki]; //その他の2人はフォロワー

} elseif($project_id == "59edafd89a037d99xxxxxxx") { //プロジェクト2なら

$members_main = [$satou]; //サトウさんが担当

$members_sub = [$yamada, $suzuki]; //その他2人はフォロワー

} elseif($project_id == "5cd7d29cd14103000xxxxxxx") { //プロジェクト3なら

$members_main = [$suzuki];

$members_sub = [$yamada, $satou];

}

 

foreach ($members_main as $members_main_id) {

$members[] = [

'_id' => $members_main_id,

'is_assignee' => true

];

}

foreach ($members_sub as $members_sub_id) {

$members[] = [

'_id' => $members_sub_id,

'is_assignee' => false

];

}

 

$tags = [ //付与したいタグがあれば指定

'59eab079e57e7a7d1xxxxxxx', //タグ1

'59f1c52e9a037d991xxxxxxx' //タグ2

];

 

// 処理START ----------------------------------------------------------------------

 

// 処理1. タスクリストを登録(新規作成)

$query = [

'access_token' => $access_token,

'space_id' => $space_id,

'project_id' => $project_id,

'title' => $title_list

];

$res = send_json_post($base_url . 'tasklist.create', $query);

 

// タスクリストのIDを定義

$list_id = $res['tasklist']['list_id']; // 先行処理で登録したタスクリストのIDを指定

 

// 処理2. タスクを登録

$query = [

'access_token' => $access_token,

'space_id' => $space_id,

'project_id' => $project_id,

'list_id' => $list_id,

'title' => $title_list

];

$res = send_json_post($base_url . 'task.create', $query);

 

$task_id = $res['task']['task_id']; // 先行処理で登録したタスクのIDを指定

 

// 処理3. タスクにタグを追加

$query = [

'access_token' => $access_token,

'task_id' => $task_id,

'space_id' => $space_id,

'tags' => $tags

];

$res = send_json_post($base_url . 'task.add-tag', $query);

 

// 処理4. タスクの詳細を設定

$query = [

'access_token' => $access_token,

'task_id' => $task_id,

'space_id' => $space_id,

'members' => $members,

'start_date' => date("Y-m-d\TH:i:s.v\z"), //期日は例えば作成日から1週間に設定

'due_date' => date("Y-m-d\TH:i:s.v\z", strtotime("+1 week"))

];

$res = send_json_post($base_url . 'task.update', $query);

 

// 処理5. タスクにコメントを追加

$query = [

'access_token' => $access_token,

'space_id' => $space_id,

'parent_id' => $task_id,

'parent_type' => 'task',

'body' => 'コメントも追加できます!'

];

$res = send_json_post($base_url . 'message.create', $query);

 

// 処理6. タスクチェックリストを追加

$query = [

'access_token' => $access_token,

'task_id' => $task_id,

'title' => 'チェックリスト1',

'is_done' => false,

];

$res = send_json_post($base_url . 'checklist.add-item', $query);

 

/////////////////////////////////////////////

// リクエスト実行関数

function send_json_post($url, $query) {

 

// POSTリクエストの準備

$header = array(

"Content-Type: application/json"

);

$context = stream_context_create(array(

'http' => array(

'method' => 'POST',

'header' => implode(PHP_EOL, $header),

'content' => json_encode($query),

'ignore_errors' => true

)

));

 

// POSTリクエストを実行

$response = file_get_contents($url, false, $context);

 

// 実行結果を表示

echo "## ${url}<br>";

var_export($http_response_header[0]);

echo "<br>";

$response_json = json_decode($response, true);

// エラーの場合はレスポンス内容を表示

if (!$response_json['ok']) {

var_export($response_json);

echo "<br>";

}

return $response_json;

}

?>

 

変数に入れたり、配列になってたりややこしいです。

だいたいはコメントで書きこんでるので何となく分かるかなと思います。

 

メンバーの識別IDとなる「user_id」とか「tag_id」はこちらのファイル内で設定してます。

 

ちなみに処理2以降を複製すれば同じタスクリスト内でタスクが複製作れます。

後はスタイルとかは適当に好みで付けておけばいいかと。

 

 

③フォームのファイルをアップロード

 

別にPHPが動く環境であればもちろんローカルで実行しても多分OKです。

社内で共有するなら余ってるようなサーバーに設置して使ったりって感じですかね。

もちろんセキュリティ面は考慮しなければいけませんが。

 

下記スクショはできあがったファイルに適当にスタイルを当てて成形したものとなります。

一例としてこういうものが作れますよっていうやつですが、例えばクライアントの店舗等が複数あるとして、それをプロジェクトに当てる感じです。

店舗毎にセレクトボックスで選択してタスクが作れる、みたいな形を想定した場合です。

 

 

で、フォームに必要な内容を入力して、ポチっとすると…

Taskworldの方で勝手にプロジェクト内にパパパっとタスクが作られるという訳です。

 














 

 

画像では2個のタスクが1つのタスクリストの中に入ってる状態です。

※上記のコードでは1個分しか作られません

で、それぞれに担当者がついてたり、タグがついてたり、チェックリストがついてたり、期日が設定されてたりします。

 

まとめ

 

やる事は3ステップですが、1つ1つが長いので心折れそうになりますよね。

 

・PostmanでTaskworldの情報を取得

・フォームを自作

・自作したファイルをアップロード

 

参考にしたサイトはTaskworldの公式のAPI紹介してるサイトだったのですが、これがまた分かりやすくて助かりました。

もちろんこれ以上の事はまだまだできますので、これを元にカスタムして、思い通りのタスク作成ツールを作ってみるのもいいと思います。

 

では現場から以上です!

 

 

【参考】

 

公式ブログ : http://taskworld.blog.jp/how-to-api

 

公式リファレンス : https://api-docs.taskworld.com/#introduction

1958

PICK UP