見出し画像

noteのRSSをChatworkに自動配信するためのGASを作ったよ

こんにちは。梅本です。

タイトルどおりなのですが、note の RSS が更新されると、Chatwork に通知されるという Google Apps Script(GAS)を作りました。

社内でChatworkをメインに使っているというデザイナーさんやユーザーさんがおられれば、ぜひ GAS を使ってみてください。

余談ですが、note にソースを貼り付ける機能β版が出ましたね。
なので、ちょっとソースも貼っていこうと思います。

背景

先日 note に RSS 機能が実装されましたね。
noteの注目デザイン・マーケ記事を、slackに自動配信するには?|深津 貴之 (fladdict)|note

ただ、社内で利用しているチャットツールが Chatwork なのです……
なので、先日 zapier で連携したのですが、無料プランだとタスク量がすぐ上限になりました。

有料プランを促されたのですが、この連携のために有料にするのもなんだかな〜ということで、Google Apps Script(GAS)を作ってみました。

最初は私がGASを書いたのですが、細かいところは社内エンジニア@matsunagaが丁寧に仕上げてくれました。ありがとう。

どんなプログラムか?

noteのRSSをXMLに変換し、スプレットシートへ書き込み後、Chatworkへ通知します。

プログラムの目的

社内のデザイナーやマーケターの人たちが、デザインやマーケティング情報に日常的に触れる環境をつくること。(みたいな感じでしょうか)

事前に必要なもの

・Google Apps Scriptの環境
・Chatwork APIのトークン
・Chatwork ライブラリ

連携イメージ

1. RSSを取得
2. 取得したRSSをXMLへ変換
3. タイトル、URL、ディスクリプションを取得
4. スプレットシートにタイトル、URL、ディスクリプションを最新データが一番上の行になるように記載
5. チャットワークへタイトル、URLを通知

仕様

・1分毎にGASを実行。
・ RSSとスプレットシートデータに差分がある場合、チャットワークへ通知。

手順

1.Google Apps Scriptのプロジェクト作成

Google Drive から新規でGoogleスプレッドシートを開いてください。

スプレッドシートが開きますので、[ツール] -> [スクリプトエディタ]を選択。

2.ChatWrokClientライブラリの追加

ここの作業はいつでもいいのですが、ChatworkClientのプロジェクトキーを検索して、追加しておきましょう。
Chatworkに投稿するためのライブラリです。

[リソース] -> [ライブラリ]を選択したあとに、「ライブラリを追加」という入力エリアがあります。ここに Chatwork のプロジェクトキーを検索して「追加」してください。

プロジェクトキー(ここでライブラリを追加に入力する値)はgithubのcw-shibuyaさんのところにあります。

3.コードを記述(初期設定)

コードの中にもコメントをしているのでわかるかと思いますが、記事にも書いておきます。

/*
* noteのRSSをXMLに変換し、スプレットシートへ書き込み後、Chatworkへ通知します。
* note : https://note.mu/
*
* 「関数を選択」には「rss」を選択してください。
*/

/*
* 初期設定
*
* FEED_URL = 取得するnoteのRSSのURLを指定してください
* SS_ID = スプレットシートのIDを指定してください
* SS_NAME = 書き込みするスプレットシートのシート名を指定してください
* CHATWORK_API = チャットワークAPIのIDを指定してください
* CHATWORK_ROOM_ID = 通知するチャットワークのルームIDを指定してください
*/
function config(key) {
 return {
   //FEED_URL : 'https://note.mu/xxx/xxx/rss',
   //SS_ID : 'spreadsheets_id',
   //SS_NAME : 'spreadsheets_name',
   //CHATWORK_API : 'chatwork_api',
   //CHATWORK_ROOM_ID : 1234567890
   
    FEED_URL : 'https://note.mu/notemag/m/m57787022cedc/rss',
    SS_ID : 'xxxxxxxxxxxxxxx',
    SS_NAME : 'xxxxxxxxxxxxxxx',
    CHATWORK_API : 'xxxxxxxxxxxxxxx',
    CHATWORK_ROOM_ID : xxxxxxxxxxxxxxx
 }[key]
}

最初に初期設定の記述をしておくとあとで楽かと思います。

・ FEED URL には取得したいRSSのURLを貼り付けてください。
・SS_IDはスプレッドシートのURLを見れば書かれております。以下の赤枠の部分ですね。

・ SS_NAMEはスプレッドシートで選択しているシートの名前を書いてください。
・CHATWORK_APIはChatworkから取得したAPIのトークンを入力。
・CHATWORK_ROOM_IDには通知をしたいRoomのidを入力してください。rid以下赤枠の部分です。


4.コードを記述(メインの投稿機能)

/*
* ================================================
* functions
* ================================================
*/

function rss(){
 FEED_URL = config('FEED_URL');
 SS_ID = config('SS_ID');
 SS_NAME = config('SS_NAME');
 CHATWORK_API = config('CHATWORK_API');
 CHATWORK_ROOM_ID = config('CHATWORK_ROOM_ID');

 var ss = SpreadsheetApp.openById(SS_ID);
 var sh = ss.getSheetByName(SS_NAME);
 var entries = getEntries(FEED_URL); // RSSデータ取得

 // 最新の記事を一番上にして書き込む(古い記事から書き込む)ため、取得した配列を逆に並び替え
 entries = entries.reverse();

 entries.forEach(function(data, index, array) {
   var title = data.getChildText('title');  // RSS記事タイトルを取得
   var url = data.getChildText('link'); // RSS記事URL取得
   var description = data.getChildText('description'); // RSS記事description取得
   
   // 記事タイトルが既に存在しているか検索
   var isSearch = searchTitle(sh, title, 1);
   
   // 存在していなかったら行を追加して書き込み
   if (!isSearch) {
     // 2行目に行を追加
     sh.insertRowAfter(1);
     
     // 最新の記事を2行目に書き込み
     writeSs(sh, title, url, description);
     
     // Chatworkに送信
     sendChatwork(CHATWORK_API, CHATWORK_ROOM_ID, title, url);
   }
 });
}

ここは特に編集しなくて大丈夫です。コピペするだけでOKです。
何をしているかざっと説明しておくと、

・ 先ほど入力したRSSのURLやトークンなどを読み取ります。
・Sreadsheet にRSSのデータを取り込みます。
・ Spreadsheetsのデータが最新かどうかを判断します
・ 新しいデータ(=新しい記事)があったら、Chatwork に送信する

ということを書いております。
これがメイン機能ですので、「関数を選択」は rss を選択してもらえればOKかと思います。

上記を実行するための各機能は以下をご参照ください。

5.コードを記述(各機能~RSSをスプレッドシートに記述して確認する)

/*
* RSSから記事データを取得
*/
function getEntries(FEED_URL) {
 var response = UrlFetchApp.fetch(FEED_URL); // HTTPリクエスト
 var xml = XmlService.parse(response.getContentText()); // HTTPリクエストで取得したデータをXML形式へ変換
 var data = xml.getRootElement().getChildren('channel')[0].getChildren('item'); // XMLのitem配下のデータを取得

 return data;
}

/*
* 記事タイトルが既に存在しているか検索
*/
function searchTitle(sh,title,col){
 var shData = sh.getDataRange().getValues(); // シートデータを二次元配列に変換

 for(var i = 1; i < shData.length; i++) {
   if(shData[i][col-1] === title) {
     return true; // あり
   }
 }

 return false; // なし
}

ここでは、以下のようなことをしております。

- RSS をXML形式へ変換(RSSのままだと、取得できないデータがあります)
- Spreadsheets のファイル、シートを指定して RSS のデータを入力する
- 書き込みが最新か否かを判断=新着記事がないか?を判断
- 新着記事がない場合はそこで終了


6.コードを記述(スプレッドシートへ書き込み〜チャットワークへ投稿)

/*
* スプレットシートへ書き込み
*/
function writeSs(sh, title, url, description) {
 // 最新の記事を2行目に書き込み
 sh.getRange((2), 1).setValue(title); // 記事タイトル
 sh.getRange((2), 2).setValue(url); // 記事URL
 sh.getRange((2), 3).setValue(description); // 記事description
}

/*
* Chatworkへ通知
*/
function sendChatwork(CHATWORK_API, CHATWORK_ROOM_ID, title, url) {
 var client = ChatWorkClient.factory({token: CHATWORK_API}); // チャットワークAPI

 // 通知本文
 var body = '';
 body += '[info][title]';
 body += title;
 body += '[/title]';
 body += url;
 body += '[/info]';

 client.sendMessage({
   room_id: CHATWORK_ROOM_ID, // ルームID
   body: (body)
 });
}

ここでは以下の機能です。

・新着記事はスプレッドシートへ記事タイトルやURL、description タグの部分を入力
・ Chatworkの指定したRoomに Chatwork記法で調整した記事を投稿
・以下のような感じで記事が送られてきます。

7. トリガーを設定

あとはこの機能をいつ実行させるかという設定ですね。
GASには、トリガーを自動化するための機能がデフォルトでついております。
[編集] → [現在のプロジェクトのトリガー]をクリックすると、実行タイミング等が設定できます。
このScriptは以下のように設定。

8.おまけ

上記で記述したソースは gist にもアップしております。

おわりに

GASってほんと便利ですね。私はプログラマーじゃないですが、社内の環境を整えるために結構活用してます。

プロジェクト毎にKPIやKGIを設定したら、その値を SQL なり GA で取得して、Spreadsheet へ自動で記述。自動で Chatwork や Slack に流して数値から示唆を得られる状態を作ってます。

データから示唆を得て、施策を考えたり、アクションに集中できる環境をつくることがクリエイターには大事だと思います。

また、ソースにバグがあったり、質問等があればコメントしてください。
即レスは無理だけど、可能な範囲で返信します。

デザインの話じゃなかったけど、Tips 的な記事もたまには書いておこうかと思います。

最後まで読んでいただき ありがとうございます!! 「スキ」も押していただけると励みになります。 Twitterで「最新の記事のシェア」をしているのでフォローしていただけたら嬉しいです。 https://twitter.com/dubhunter