2015年1月7日水曜日

Google Apps Scriptで自動的に連絡先のグループを作りたい! その2

新年、明けましておめでとうございます。

引き続きA-AUTO 50を担当する井下です。

昨年の終わりごろ、初期型のPS3がYLOD(いわゆるソニータイマー)でお亡くなりになったので、
期待と不安を胸にPS4を買ってみましたが、意外とコンパクトなのですね。

ハードウェアとソフトウェアの進化の賜物なのでしょうけど、
限界まで進化したらどんなサイズになるんでしょうか。箱ティッシュくらいかな。


今回はタイトルに「その2」とあるように、前回の続きになります。
Google Apps Scriptで自動的に連絡先のグループを作るWebアプリの仕様が書いてあるので、興味がある方はご覧ください。

作ってみたWebアプリはこんな感じになりました。(一部モザイクが入っています)
「最近の送信先グループ」には自分のGmailの送信履歴から、最新5スレッド分の送信先を自動で抽出しています。

以下の操作をするだけで、Google Contacts(連絡先)に新たな連絡先グループが作成されるようになっています。
  1. 任意の連絡先グループ名を書く
  2. まとめたい送信先グループをラジオボタンで選択する
  3. 連絡先グループ作成ボタンをクリックする

それでは、実際に上の画面の状態で「連絡先グループ作成」ボタンを押してみます。
成功すれば、Gmailの送信先で「A-AUTO50開発」がオートコンプリートで出てくるはずです。



成功のレスポンスが返ってきました。
早速Gmailを開いて確認してみると…。


ちゃんと出てきました! そのまま「A-AUTO50開発」を選択すると、実際に送信するメールアドレス群に変換されます。


念のため、Google Contactsも確認してみます。


しっかり「A-AUTO50開発」が登録されていますね。この情報を元に、Gmailではメールアドレスに変換してくれています。


これでやりたいと思っていたことは8割ほどできました。
残り2割(※1に記述)については、時間があるときにおいおい作って行こうと思います。

※1
姓・名の情報がない送信先には、個別に姓・名を入力することができることと
グループ作成をするのに不要な送信先を外したり、任意の送信先を追加できること

また、ソースコードもそこまで複雑でないものにできました。
今回作成したのは、画面表示用のhtmlファイルと、内部処理を行うgsファイルの2つです。

gsファイルの中身はこんな感じです。
function doGet() {
  var output = HtmlService.createTemplateFromFile('index');
  return output.evaluate();
}

function registerContact(form){
  if(form.groupName == null || form.groupName.length == 0) return '連絡先グループ名を入力してください'
  if(form.toLists == null || form.toLists.length == 0) return '選択した送信先グループが不正です'

  var contact
  var toList = convertToList(form.toLists)
  var contactGroup = ContactsApp.createContactGroup(form.groupName)
  
  for(var index in toList){
    if(contact = ContactsApp.getContact(getMailAdress(toList[index]))){
      contactGroup.addContact(contact)
    }
    else {
      contactGroup.addContact(ContactsApp.createContact(' ', ' ', toList[index]))
    }
  }
  return '連絡先グループを作成しました'
}

function getToLists() {
  var therads = GmailApp.search('in:sent', 0, 5);
  var toList = [];
  var index = 0;
  
  for(var thdIndex in therads){
    var thead = therads[thdIndex]
    var messages = thead.getMessages();
    for(var mesIndex in messages){
      toList[index] = messages[mesIndex].getTo().replace(/</g, "/").replace(/>/g, "")
      index++
    }
  }
  
  toList = toList.filter(function (x, i, self) {
    return self.indexOf(x) === i;
  });
  
  return toList
}

function convertToList(toList){
  return toList.split(",");
}

function getName(to){
  return to.split("/")[0];
}

function getMailAdress(to){
  return to.split("/")[1];
}

核となるContactsの動作や、gsファイルで作成したコードと画面との連携方法については前回前々回をご参照ください。
お作法通りかつ単純な使い方なので、あまり手間をかけずに簡単に書けました。

それぞれのメソッドがやってくれていることは以下の通りです。

・getToLists
 画面で表示する送信先グループを取得します。重複した送信先グループはfilterを使って省くようにしています。

・registerContact
 画面からのform送信を元に連絡先グループを作成し、連絡先に未登録のメールアドレスがある場合は、その送信先を新規登録します。
 なお、既に連絡先に登録されているメールアドレスについては、重複登録しないように事前に連絡先の存在チェックをかけています。

他のメソッドは文字の切りだしや、Webアプリケーションを作成するときのお作法ですね。


次にhtmlファイルです。
<style>
  .main {  
  width: 100%;  
  } 
  
  .centering {  
  width: 50%;
  margin: 0 auto;
  }
  
  .list {
  width: 100%;
  border-collapse: collapse; 
  }
  
  .list th {
  padding: 6px;
  text-align: left;
  vertical-align: top;
  color: #333;
  background-color: #EAFFEC;
  border: 3px double #C0C0C0;
  }

  .list td {
  padding: 6px;
  background-color: #FFF;
  border: 3px double #C0C0C0;
  }
  
</style>

<div class="main">
<div class="centering">
<form>
  <h4>連絡先グループ名</h4>
  <p><input type="text" name="groupName"></p>
  
  <h4>最近の送信先グループ</h4>
  <?
    var toLists = getToLists();
    
    output.append('<table class="list"><tr><th> </th><th>送信先グループ</th></tr>');
    for (var lsIndex in toLists){
      var toList = convertToList(toLists[lsIndex])
      output.append('<tr><td><input type="radio" name="toLists" value=\'' + toLists[lsIndex] +'\'></td><td>');
      
      for (var index in toList){
        if(index > 0 && index % 2 == 0){
          output.append('<br>');
        }
        
        output.append(toList[index]);
      }
      
      output.append('</td></tr>');
    }
    output.append('</table>');
  ?>
  
  <input type="submit" value="連絡先グループ作成" onclick='google.script.run.withSuccessHandler(onSuccess).registerContact(this.parentNode)'>
</form>
</div>
</div>

<script>
  function onSuccess(message){
    alert(message);
  }
</script>

前々回で作成したhtmlファイルとやっていることに大差はありません。
今までなかった箇所としては、"output.append"というメソッドを利用しています。

"output.append"を利用することで、スクリプト記述内からhtmlへの出力を行えます。
上のhtmlファイルでは、for文で回しながら、htmlタグや送信先メールアドレスをhtmlに出力する使い方をしています。

作ってみると、そこまで膨大なコードを書かずに済みました。
やはりGoogleのサービスと連携する場合は、Google Apps Scriptの利用は手軽でいいですね。

ただ、今回も動かしていて感じたのですが、どうしても「動作が遅い」点がネックです。
Google Apps Scriptの便利さや手軽さの認知は広まりつつあると思うので、そのうちに「動作が早い」有償バージョンの類が出るのかなと考えていたりします。

0 件のコメント:

コメントを投稿