チャットワークでは、エンタープライズプランやKDDI ChatWorkプランに加入していればログを管理画面からエクスポートすることができます。
ただ、エクスポートには権限が必要になることや、ログの保存が必要になるときもあるので、今回は管理画面からのエクスポートを使わずに、無料でチャットワークのログを保存する方法を解説していきたいと思います。
目次
今回紹介する方法について
今回は以下の3パターンの方法を紹介していきたいと思います。
- ブラウザ内のツールにコードをコピペする方法
- Chrome拡張機能「Scraper」を使う方法(XPath)
- Chrome拡張機能「Multicopy」を使って力技でコピペ
①ブラウザ内のツールにコードをコピペする方法

ブラウザに搭載されている機能にコピペするので、拡張機能などをインストールしなくても大丈夫です。
PCの操作に慣れた方や、開発者ツールを使ったことがある方やなら簡単にログを保存することができると思います。ファイル形式はテキスト形式
やCSV形式
で保存ができます。
②Googleクローム拡張機能「Scraper」を使う方法

「Scraper」というGoogleクロームの拡張機能を使ってログを保存する方法です。これもコピペで大丈夫です。
クリップボードにコピー
する方法(そのままペーストできる状態になる方法)と、Google Docsのスプレッドシートで保存
する方法の2通りが利用できます。
③拡張機能を使ってコピペする方法

この方法もGoogleクロームの拡張機能を使っていきます。
手軽に利用できるのですが、力技になるので、メッセージの量が多いときは①か②の方法がオススメです。
- エンタープライズプランとKDDIプランはどちらも1ユーザーにつき月額800円になります。
- エンタープライズプランは最低利用人数が5人から、 KDDIプランは1人のユーザーでも加入することができます。こちらは大企業や官公庁向け管理機能を強化したプランになります。
① ブラウザ内のツールにコードをコピペする方法
まずはGoogleクロームなどのブラウザ内の機能を使う方法から見ていきましょう。
開発者ツールでJavaScriptを実行できる人は「ステップ2」から見てね。
ステップ1: Googleクロームで開発者ツールを使う方法
Googleクロームで開発者ツールを使うには 、メニューバーの表示
> 開発/管理
にあるJavaScriptコンソール
を選択します。これでJavaScriptコードが実行できる状態になりました。

コンソールを開くと黄色い背景で文字が出てくる場合もありますが、これはチャットワーク開発者へのメッセージなのでそのまま進めてもらって大丈夫です。
ステップ2: ダウンロードしたいメッセージをすべて表示させる(上にスクロール)
対象となるユーザーやグループでのメッセージが少ない場合には、チャットのページを開いたままでもすべてのメッセージが表示されますが、やり取りが多くなってくると過去のメッセージはすべて表示されません。
上にスクロールすればメッセージが読み込まれるので、 スクロールしてダウンロードしたいメッセージを表示させます。
ステップ3: 開発者ツールからコードを実行する
それではコードを入力していきましょう。

下の方で紹介しているコードをコピペして、開発者ツールの入力欄に貼り付けます。

ペーストしてからEnter(エンター)キーを押せば、ダウンロードが始まります。
「.txt」や「.csv」の拡張子を忘れないようにね。
テキスト形式でダウンロードする場合
メッセージをテキスト形式(.txt
)でダウンロードする場合には、以下のコードをコンソールに貼り付けて実行します。
function timeConvert(timestamp) {var a = new Date(timestamp * 1000);var year = a.getFullYear();var month = a.getMonth() + 1;var date = a.getDate()var hour = a.getHours()var min = a.getMinutes()var time = `${year}年${month}月${date}日 ${hour}:${min}`return time;}var messages = '';$('._message').each((idx, item) => {var field = '---' + 'n'if ($(item).find('._timeStamp').length > 0) {field += timeConvert($(item).find('._timeStamp').data('tm')) + 'n'} else {return;}if ($(item).find('.timelineMessage__orgName').length > 0) {field += $(item).find('.timelineMessage__orgName').text() + 'n'}if ($(item).find('._speakerName').length > 0) {field += $(item).find('._speakerName').text() + 'n'} else {field += $('._message').eq(idx - 1).find('._speakerName').text() + 'n'}field += $(item).find('.timelineMessage__message').text() + 'nn'messages += field})window.open("data:application/plain;charset=utf-8," + messages)

「○○.txt」のように.txtの拡張子で名前をつけて保存すれば完了です。

(ぼかしが多いですけど)ちゃんとテキスト形式で保存されていますね。
CSV形式でダウンロードする場合
メッセージをExcelなどの表計算ソフトでも使えるCSV形式(.csv
)でダウンロードする場合には、次のコードを実行します。
function timeConvert(timestamp) {var a = new Date(timestamp * 1000);var year = a.getFullYear();var month = a.getMonth() + 1;var date = a.getDate()var hour = a.getHours()var min = a.getMinutes()var time = `${year}年${month}月${date}日 ${hour}:${min}`return time;}var arr = [['date', 'orgName', 'name', 'iconSrc', 'message']]$('._message').each((idx, item) => {var field = []if ($(item).find('._timeStamp').length > 0) {field.push(timeConvert($(item).find('._timeStamp').data('tm')))} else {return;}if ($(item).find('.timelineMessage__orgName').length > 0) {field.push($(item).find('.timelineMessage__orgName').text())} else {field.push('')}if ($(item).find('._speakerName').length > 0) {field.push($(item).find('._speakerName').text())field.push($(item).find('._speaker img').attr('src'))} else {field.push($('._message').eq(idx - 1).find('._speakerName').text())field.push($('._message').eq(idx - 1).find('._speaker img').attr('src'))}field.push($(item).find('.timelineMessage__message').text().replace(/,/gm, '、').replace(/(rn|n|r)/gm, ""))arr.push(field)})window.open(encodeURI("data:text/csv;charset=utf-8," + arr.map(e => e.join(",")).join("n")))

「○○.csv」のように、.csvという拡張子をつけてダウンロードします。

これでExcelでも編集できる形式で保存することができました。
補足: コードを実行しても何も起きないときは?
コードを実行しても何も起きない場合には、ダウンロードのためのポップアップがブロックされているかもしれません。

これはFirefoxの画面になりますが、「1個のポップアップがブロックされました」というメッセージが黄色い背景に書かれています。

もしエラーメッセージが出てきたら、「設定」ボタンから「ポップアップを許可」すればダウンロードが始まります。
補足: 拡張子を入れずにダウンロードしたら?
もし「.txt」などの拡張子を入れずにファイルを保存した場合でも、ダウンロード後に拡張子を追加/変更することができます。

拡張子を変更すると警告が出ることがありますが、そのまま変更してもらって大丈夫です。
拡張子を変更するときに警告が表示されるかもしれないけど、今回は気にせず変更しても大丈夫だよ。
補足: Firefoxで開発者ツールを使う方法
上ではGoogleクロームを使ってダウンロードする方法を紹介しましたが、Firefoxで開発者ツールからJavaScriptを入力する方法についても紹介しておきたいと思います。
ウェブコンソールを表示させる

Firefox右側にあるメニューアイコンから「ウェブ開発」を開きます。

ウェブ開発のメニュー内にある「ウェブコンソール」をクリックします。

これでJavaScriptを実行できる画面が表示されます。
ウェブコンソールにコードをペーストできるようにする

ウェブコンソールでコードをペーストするのが今回が初めての場合には、「ペーストできません」という感じのエラーが出るかもしれません。

ペーストできないときは、ウェブコンソールの入力画面に「’allow pasting’」と入力します。
これでFirefoxでもJavaScriptを入力できるようになるはずです!
allow pastingの文字は‘(シングルクオート)で囲まないといけないよ。
②Scraperを使う方法(XPath)
次は「Scraper」というGoogleクローム拡張機能を使ってログを保存する方法について見ていきましょう。

ChromeウェブストアからScraperを拡張機能として追加します。
ステップ1: Scraperを起動

ScraperをGoogleクロームに追加したら、ログを保存したいルームで右クリックしScrape similarを選択します。
ステップ2: 保存したい内容を指定する
次はXpath
というものを使って、保存したい内容を指定します。

Scraperを起動するとポップアップが表示されるので、この中に必要な情報を記入していきます。
「Column」の隣りにある緑色のボタンをクリックして、次の表にあるName
とXPath
をコピペで追加していきます。
「Name」に入力する内容 | 「Xpath」に入力する内容 |
---|---|
date | div[contains(@class, “_timeStamp”)]/. |
orgName | p[contains(@class, “timelineMessage__orgName”)]/. |
name |
div[contains(@class, “timelineMessage__content”)]/div/p[contains(@class, “_speakerName”)]/. |
iconSrc | div[contains(@class, “_speaker”)]/img/@src |
message |
div[contains(@class, “timelineMessage__content”)]/pre[contains(@class, “_message”)]/. |

上の表の内容を記入すると画像のような感じになります。

右側のパネルに取得できた情報が表示されます。
ステップ3: 指定した要素を書き出し
上で取得した内容で問題なければ、ポップアップ右下のCopy to clipboard
またはExport to Google Docs
ボタンをクリックします。
これで保存完了だよ。
ボタンの文字 | 説明 |
---|---|
Copy to clipboard | クリップボードにコピーします。そのままメモ帳などに貼り付けることができます。 |
Copy to clipboard | Google Docsのスプレッドシートに保存できます。 |
Scraperではこれまでの設定を保存できる
ここまでScraperの設定画面にSelectorやXPath、Nameを入力してきましたが、Scraperでは今回入力した内容を保存することができます。

保存したい名前をつけて「Save」ボタンを押せばプリセットとして保存されます。
これで次回からコピペせずにエクスポートできるようになります。

ここではChatWorkという名前をつけてみました。

保存したプリセットを呼び出したいときには、「ChatWork」などのプリセット名をクリックすれば保存したときの設定が自動で入力されます。
Scraperほんと便利だわ。
③Chrome拡張機能「Multicopy」を使って力技でコピペ
最後に紹介する方法は「Multicopy」というChrome拡張機能を利用して複数のテキストをコピペする方法になります。

こちらもChromeウェブストアから無料でダウンロードできます。
Multicopyの使い方
通常はコピーしても過去にコピーしたものを呼び出すことはできませんが、Multicopyを使うと過去にコピーしたものを最大30件まで(設定可能)呼び出すことができるようになります。

コピーしたいテキストを選択した状態で右クリックしてから「Multicopy」 > 「Copy This」を選択します。

メモ帳などで右クリックすると「Multicopy」の中にコピーした項目が表示されるので、それを選択するとペーストできます。
保存したいメッセージを一気にコピーしてから一気に貼り付ければ、一つ一つコピペするよりは作業時間の短縮になるはず!
まとめ
今回はチャットワークのチャット内容を保存する方法について紹介しました。
開発者ツールやScraperを使ってログを保存する方法では、スクロールせずにプログラムを実行すると、一部のメッセージしか表示されずに保存されてしまうので、保存したいメッセージがすべて表示されるようにした状態で実行するように気をつけくださいね。
それでは今回はこのあたりで。閲覧ありがとうございました。