新規投稿
フォローする

GASを使って自動翻訳アプリ作成!

GAS(Google Apps Script)LanguageApp クラスを使うと、文字列の翻訳ができます。 今回は、kintoneアプリに実装する例を紹介します。

サンプル

日本語フィールドに文字列を入力して翻訳ボタンを押すと、英語フィールドと中国語フィールドに翻訳結果を出力します。

GAS設定

1. https://script.google.comにアクセスして、「+新規スクリプト」をクリックします。
(Googleにログインしていない場合は、ログインが必要です。)

2. 下記をコード記述し、「translate.gs」として保存します。

・translate.gs

function doPost(e) {
  var parameter = JSON.parse(e.postData.getDataAsString());
  return ContentService.createTextOutput(JSON.stringify(parameter.targetLanguages.map(function (targetLanguage) {
    return LanguageApp.translate(parameter.text, parameter.sourceLanguage, targetLanguage);
  })));
}

3. 「公開」 > 「ウェブアプリケーションとして導入」からプロジェクトを公開します。
公開の際、「アプリケーションにアクセスできるユーザー」は「全員(匿名ユーザーも含む)」を選択します。

4. 公開完了後に表示される「現在のウェブアプリケーションのURL」をメモしておきます。

kintone設定

フォーム設定

コード

下記「sample.js」を読み込みます。
「gasUrl」には、「GAS設定-4」でメモしたURLを設定します。

・sample.js

(function () {
  "use strict";
  kintone.events.on([
    'app.record.create.show',
    'app.record.edit.show',
  ], function (event) {

    var gasUrl = 'https://script.google.com/macros/s/****/exec';
    var sourceLanguage = 'ja';
    var targetLanguages = ['en', 'zh'];
    var sourceLanguageField = '日本語';
    var targetLanguageFields = ['英語', '中国語'];

    var translateButton = document.createElement('a');
    translateButton.innerText = '翻訳';
    translateButton.addEventListener('click', function () {
      var record = kintone.app.record.get();
      kintone.proxy(
        gasUrl,
        'POST',
        { 'Content-Type': 'application/json' },
        {
          text: record.record[sourceLanguageField].value,
          sourceLanguage: sourceLanguage,
          targetLanguages: targetLanguages
        }
      ).then(function (response) {
        return kintone.proxy(response[2].Location, 'GET', {}, {});
      }).then(function (response) {
        JSON.parse(response[0]).forEach(function (text, index) {
          record.record[targetLanguageFields[index]].value = text;
        });
        kintone.app.record.set(record);
      });
    });
    kintone.app.record.getSpaceElement('space').appendChild(translateButton);
  });
})();

3

1件のコメント

Avatar
菅原直樹

GASでPOST操作するとどうしても302が返ってきてどうしたらよいかわからなかったので、このサンプルがあってとても助かりました。

0
サインインしてコメントを残してください。