JavaScript
GoogleAppsScript
gas
初心者
Slack

【GAS修行⑥】文章翻訳Slack Botを作成して、世界横断技術者を目指す。

・GAS熟練者への道。
・先人達のコードの「写経&コピー」の駆使の成果物のまとめ。
・第六弾
第一弾第二弾第三弾第四弾第五弾はこちら。

経緯

・「六回目か。もうそろそろ個人的に必要な実用アプリも揃ってきたな。」
・「いや、まだあれが残っていた。」
・「あれさえあれば、今後の世界展開計画も、思うがまま。」
→そういうわけで、今回もサンプルアプリと仏様サイトを発見。
https://qiita.com/shohei-y/items/6784ae87ca180c7c5157
→「また参考(※マルコピ)に作るか。」
→取り組み開始。

概要

  • 文章を言語を指定して投稿すると、翻訳して返してくれる。
  • 多言語はもちろん、複数行翻訳もしてくれる。

結果

・実際の画面はこちらです。
image.png
image.png

作成環境

  1. Google App Script
  2. Slack API
  3. 発信Webフック
    ※Slackがない場合は、一人用のSlackを開設しましょう。(何かと役に立つ。)

手順

※Google Apps Scriptの設定は、第二弾第三弾と一緒

Google Apps Scriptの設定

  • Googleドライブからスクリプトエディタを起動。
    ※Googleアカウントを持っていない人は、作成する。
    • Googleドライブを起動
    • 「新規」→ 「その他」→「アプリを追加」の順にクリック。
    • アプリ検索欄に「script」と入力して検索。
    • 検索結果に「Google Apps Script」が表示されるので、そこの「接続」ボタンをクリック
    • 改めて「新規」→ 「その他」の順にクリックしていくと、「Google Apps Script」が表示されているので、クリック。
  • 起動したプロジェクトに名前をつける
    ※プロジェクト名が反映されるわけではないが、自分がわかる名前をつける。
    →保存。(最初の3行のままで良い。)
  • 保存後、タブメニューの「公開」から「ウェブアプリケーションとして導入」をクリック。下記の項目を設定。
    • プロジェクトバージョン:New(変更内容は任意)
    • 次のユーザーとしてアプリケーションを実行:自分(アドレス)
    • アプリケーションにアクセスできるユーザー:全員(匿名ユーザーを含む)
  • 設定後、「導入」ボタンをクリック。作成さるウェブアプリケーションURLをメモしておく。「OK」ボタンをクリック。
  • 一旦置いておく。

Slack APIの設定

  • Slack APIのトークンを発行。 (※基本的にはこちらを参考)
    • Slack APIにアクセス。
    • ページ内の「Create New App」をクリックして、下記の情報を入力。
      • 「App Name」: アプリの名前(作成内容がわかりやすい名前)
      • 「Development Slack Workspace」: アプリを追加するチャンネル
    • 入力後、「Create App」をクリックして、作成。
    • 作成後に表示されるページの左サイドメニューの「Basic Information」から「Install your app to your workspace」から「Pemission Scope」をクリック。 image.png
    • 「Permisson Scopes」ページの「Select Permission Scopes」欄で、「Send messages as アプリ名」を選択して、「Sava Change」で保存する。
    • 設定後、左サイドメニューの「OAuth & Permissions」ページに、「Install App To Team」ボタン(緑色)で表示されるので、それをクリックして、「Authorize」で追加する。
    • 追加後、「OAuth Access Token」が発行されるので、それを控えておく。

発信Webフックの設定

  • Slack APIのトークンを発行。
    • Slack内のアプリを追加したいチャンネルに行き、アプリ名をクリックして、「アプリを追加する」をクリック。 image.png
    • 「Appディレクトリ」ページの検索欄にwebと入力して、出てくる「発信Webフック」をクリック。 image.png
    • 発信Webフックページの「設定を追加」をクリックして、下記の項目を入力。
      • 「引き金となる言葉」: textsh
      • 「URL」: Google Apps ScriptのURL(※先程メモしたもの。) screen.png
    • 入力後、「設定を保存」で保存して、発信Webフックの「トークン」をメモしておく。

ライブラリ設定

  • スクリプトエディタに戻り、上部メニューの「リソース」から「ライブラリ」をクリック。
  • 「ライブラリを追加」欄にM3W5Ut3Q39AaIwLquryEPMwV62A3znfOOと入力。
  • 「タイトル」に「Slack App」と表示されるので、「バージョン」を最新にして、「デベロッパーモード」をONにして、保存する。
    ※Slack Appとは、Slack処理を簡単にしてくれるライブラリ。使い方は、こちら image.png

コード

  • スクリプトエディタに、下記のコードをコピーして、保存。
slack-translate.gs
function doPost(e) {
  var token = "Slack APIのトークンを書く。";

  // 応答時のBOT名
  var bot_name = "ほんやくにえもん";

  // アイコン絵文字
  var bot_icon = ':grin:';
  // 発信webフックのTokenを設定
  var verify_token = "発信Webフックのトークンを書く。"

  // トークンのセキュリティチェック
  if (verify_token != e.parameter.token) {
    throw new Error("invalid token.");
  };

  // SlackAPPの作成
  var slackApp = SlackApp.create(token);

  var body = e.parameter.text.substr(7); // textsh 以降の抽出
  var tmpSplit = body.split(" ",2);
  var original_lan = tmpSplit[0]         // 原文の言語
  var convert_lan = tmpSplit[1]          // 翻訳先の言語
  var response;

  if (original_lan == "help") {

    // 結果の編集
    response = "【基本文】\ntextsh *翻訳元言語* *翻訳先言語* *翻訳文章*\n "
             + "【例文】\ntextsh *ja* *en* *こんにちは*\n\n"
             + "言語は下記から選択。(※他言語は、調べよう)\n" 
             + "```\n" 
             + "日本語・・・「ja」英語・・・「en」\n"
             + "中国語(簡体)・・・「zh-CN」  中国語(繁体)・・・「zh-TW」\n"
             + "韓国語・・・「ko」  ドイツ語・・・「de」\n"
             + "イタリア語・・・「it」  自動検出・・・「auto」\n"
             + "```\n" 

  } else {

    var message = body.substr(original_lan.length + convert_lan.length + 2 );          // 翻訳対象の原文
    // Google翻訳の実行
    message = LanguageApp.translate(message, original_lan, convert_lan);

    // 結果の編集
    response = "ほんやく完了(*'ω'*)。\n「" + original_lan + "」 を 「" + convert_lan + "」に変えたよ。誤訳文句は受け付けていません。\n ``` \n" + message + "\n ``` ";

  }

  return slackApp.postMessage(e.parameter.channel_id, response, {
    username: bot_name,
    icon_emoji: bot_icon
  });

}

※以下の項目を自分のものに変えるのを忘れない。
   ・Slack APIのトークン(先程メモしたもの。)
   ・発信Webフックのトークン(先程メモしたもの。)

  • 自分のコードに書き換えて保存。
  • 保存後、先程の要領で、「ウェブアプリケーションとして導入」をクリック。
  • プロジェクトバージョンを最新のものにして、更新をクリック。
    ※更新をしないと、反映されない。
  • 実際にSlackへ行き、動作確認。(例:「textsh ja en こんばんは」)
  • 正常に動けば、完了。

まとめ

  • 今回はSlack Botということで、更に幅が広がった。
  • 国際的技術者への道がどんどん開拓さているのでは、十八番のうぬぼれに浸る。
  • これを見てくださるエンジニアの皆様、「自分はこれで世界交流をしてるぞ」とか「そんなんじゃ、まだまだ道は遠いな」等の意見を何卒お待ちしております。

参考