google apiを使ってgmailでメール送信したい

kintone カスタマイズ
1

はじめまして。

 

KINTONE上でレコード操作したとき

条件を満たせば未登録のアドレスへもメール送信したいと考えており

google apiを使ってgmailでそれを実現したいと考えていますが

headタグまたはbodyタグにscriptとしてapi(API Client Library)が読み込まれるようにタグ挿入しても

アプリ実行時に読み込まれません。

※API Client Libraryが読み込まれたら、自作のコールバック関数がコールされる仕組み

 

ページのHtmlへのタグ挿入はできているようなのですが

どのように記述すれば

読み込まれるようになるのでしょうか？

 

ご参考>>

東北ギーク 様

Gmail APIを使ってJavascriptでメールを送ってみる

http://tech.respect-pal.jp/gmailapi-send-mail/ 

2

吉田可也さん

第1回 kintone javascript APIのイジりかたの「 作成したファイルをkintoneに取り込む 」にJSの適用方法が記載されていますので参考にしてみてください。

3

かき氷さま

 

回答ありがとうございます。

回答内容はすでに実施済みです。

ソースの冒頭に記述しても、各イベントハンドラ内で記述してもダメでした。

JSファイルを個別にロードしてもダメでしたし、プラグイン化してもダメでした。

 

ActiveXを使ってメールオブジェクトを作成しGmailを送信することはできたのですが

動作しないブラウザがほとんどなので

Google Apiを使って送信したいと思いまして。

4

吉田可也さん

失礼しました。問題はコールバックが呼び出されないということでしたか。

URLでコールバックを指定している部分を詳細画面表示時にonLoadCallbackFunction()を呼び出すなど、実装を変更する必要があります。

5

カキ氷さん

 

何度もすいません。

 

現行では コールバック関数など定義をしたあと

イベントハンドラ内で

document.body.insertAdjacentHTML += “<script src="https://apis.google.com/js/client.js?onload=onLoadCallbackFunction"></script>”;

や

function loadScript(src, callback) {
  var head = document.getElementsByTagName(‘body’)[0];
  var script = document.createElement(‘script’);
  script.src = src;
  head.appendChild(script);

  callback();
}
window.onload = function () {
  loadScript(“https://apis.google.com/js/client.js?onload=onLoadCallbackFunction”, function() {
  console.log(‘script loaded’);
});

としてみたのですが、コールバックされませんでした。

 

実装がまちがっているのでしょうか？

6

吉田可也さん

 

一度HTMLに埋め込んでロードするのはおいておきましょう。kintoneの場合はアプリの設定から対象のファイルを読み込ませます。

 

以下の手順でアラート画面を表示できれば、onLoadCallbackFunction() の処理を記載していくことで実装ができると思いますがいかがでしょうか。

 

① JSライブラリは第1回 kintone javascript APIのイジりかたの「 作成したファイルをkintoneに取り込む 」と同様に設定します。(google api client の設定)

② カスタマイズJSのファイルとしてapp.jsを作成して、①と同様に設定します。

③ app.js に以下のコードを記載します。

(function() {
 "use strict";

 function onLoadCallbackFunction() {
  /* 処理を記載 */
 }

 function showDetail(event) {
  alert('詳細画面を開きました');
  onLoadCallbackFunction();
 }

 // レコード詳細画面表示のイベント
 kintone.events.on(['app.record.detail.show'], showDetail);
}());

 

 

7

カキ氷さん

何度もフォローして頂き、ありがとうございます。

 

イベント発生時に
<script src="https://apis.google.com/js/client.js?onload=onLoadCallbackFunction"></script>
を実行したいのですが、動作しないので
カキ氷さんのご指導のように
必要なファイルをこちらから全てアップロードしようと思い
google apiを使用するのに必要なソース(https://apis.google.com/js/client.js?onload)をローカルに取り込み%E3%82%92%E3%83%AD%E3%83%BC%E3%82%AB%E3%83%AB%E3%81%AB%E5%8F%96%E3%82%8A%E8%BE%BC%E3%81%BF)
自分の作成したものと一緒にデプロイしましたが
google側ではじかれてしまいました。

googleとの連携はZapierなどを使わないとできないのでしょうか？

8

吉田可也さん

>google側ではじかれてしまいました。
呼び出しまではできたということですね。よかったです。この時のエラー内容はCross-Origin Resource Sharingでしょうか。
外部APIを呼び出すのはちょっとコツがいります。

kintone.proxyを使うことでブラウザから直接ではなく、サーバを介してAPIを呼び出すことができます。CORSであればこれで回避できますのでお試しください。

9

カキ氷さん

 

kintone.proxyで下記のように実装してみたのですが
1行目の onload=onLoadCallbackFunctionのところでコールバック関数が呼ばれなかったので
リクエスト完了時にコールされるようにもしてみましたが
2行目しか実行されません。

引数が間違っているのでしょうか？

1  kintone.proxy(‘https://apis.google.com/js/client.js?onload=onLoadCallbackFunction’, ‘GET’, {}, {}).then(function(args) {
2    console.log(“成功”);
3    onLoadCallbackFunction();
4  }, function(error) {
5  //error
6    console.log(error); //proxy APIのレスポンスボディ(文字列)を表示
7  });

 

10

吉田可也さん

 

kintone側でJS読み込みの設定をしているのであればhttps://apis.google.com/js/client.jsはすでにロードされているはずなので不要となります。

あと、onLoadCallbackFunction自体は外部APIではありません。あくまでこちらは自身で実装するものになります。

前回画面表示の際に関数を呼び出す方法としてのコードを記載していますので今一度目を通していただければと思います。

http://tech.respect-pal.jp/gmailapi-send-mail/のサイトを参考にされると思いますが、コピペでは動かないのでそれなりにJS＋αの知識が必要となります。

難しそうな場合Zapierを使ってしまったほうが手っ取り早いかと思います。

11

カキ氷さん

 

ついに動きました。

最大の原因はブラウザのポップアップブロックだったようです。

認証要求時、許可のボタンを
自動的に押下する または 自分で押下する
というオプションが選択できますが
認証許可はポップアップで尋ねられるため
どちらに設定していても ポップアップブロックが設定されていると
要求自体をブラウザが取り消してしまうようです。

JSファイルから外部ライブラリソースをロードするのではなく
カキ氷さんのアドバイスにあった
「kintone側でJS読み込みの設定をしているのであれば・・・」をし
参考ページと合わせて実装すればできました。

ありがとうございました。

12

吉田可也さん

なるほど！ポップアップでしたか。

解決したようで良かったです！