GMail API with JS AJAX calls

GMail API with JS AJAX calls

本文关键字:AJAX calls JS with API GMail      更新时间:2023-09-26

我们使用通用的学生信息系统来管理我们的学校。它很容易在客户端进行自定义,当发生一些操作(表单提交、页面加载等)时,我们希望在几个地方触发电子邮件。不可能使用PHP、ASP或Java等服务器端编程语言。

我们想做的是使用AJAX调用来发送电子邮件。我完全用JavaScript完成了这项工作,但我必须使用我想要发送的GMail帐户表单登录。我们需要对此进行一次身份验证(或者只要承载令牌有效),然后在用户操作发生后发送电子邮件。

由于客户端语言似乎能够在不让发送帐户在浏览器会话中"登录"的情况下访问这些端点并发送电子邮件,所以我认为这是可能的。是吗?

我还意识到,创建一个使用GMail作为SMTP中继的服务器端脚本是一种选择,但许多使用谷歌教育应用程序的学校根本没有一个网站服务器可以托管这样的脚本。客户端插件才是我们真正想要构建的。

您可以尝试,只需替换CLIENT_ID值:

其作用域是只读,但我认为您可以根据需要执行的操作进行更改。

<html>
  <head>
    <script type="text/javascript">
      // Your Client ID can be retrieved from your project in the Google
      // Developer Console, https://console.developers.google.com
      var CLIENT_ID = '<YOUR_CLIENT_ID>';
  var SCOPES = ['https://www.googleapis.com/auth/gmail.readonly'];
  /**
   * Check if current user has authorized this application.
   */
  function checkAuth() {
    gapi.auth.authorize(
      {
        'client_id': CLIENT_ID,
        'scope': SCOPES.join(' '),
        'immediate': true
      }, handleAuthResult);
  }
  /**
   * Handle response from authorization server.
   *
   * @param {Object} authResult Authorization result.
   */
  function handleAuthResult(authResult) {
    var authorizeDiv = document.getElementById('authorize-div');
    if (authResult && !authResult.error) {
      // Hide auth UI, then load client library.
      authorizeDiv.style.display = 'none';
      loadGmailApi();
    } else {
      // Show auth UI, allowing the user to initiate authorization by
      // clicking authorize button.
      authorizeDiv.style.display = 'inline';
    }
  }
  /**
   * Initiate auth flow in response to user clicking authorize button.
   *
   * @param {Event} event Button click event.
   */
  function handleAuthClick(event) {
    gapi.auth.authorize(
      {client_id: CLIENT_ID, scope: SCOPES, immediate: false},
      handleAuthResult);
    return false;
  }
  /**
   * Load Gmail API client library. List labels once client library
   * is loaded.
   */
  function loadGmailApi() {
    gapi.client.load('gmail', 'v1', listLabels);
  }
  /**
   * Print all Labels in the authorized user's inbox. If no labels
   * are found an appropriate message is printed.
   */
  function listLabels() {
    var request = gapi.client.gmail.users.labels.list({
      'userId': 'me'
    });
    request.execute(function(resp) {
      var labels = resp.labels;
      appendPre('Labels:');
      if (labels && labels.length > 0) {
        for (i = 0; i < labels.length; i++) {
          var label = labels[i];
          appendPre(label.name)
        }
      } else {
        appendPre('No Labels found.');
      }
    });
  }
  /**
   * Append a pre element to the body containing the given message
   * as its text node.
   *
   * @param {string} message Text to be placed in pre element.
   */
  function appendPre(message) {
    var pre = document.getElementById('output');
    var textContent = document.createTextNode(message + ''n');
    pre.appendChild(textContent);
  }
</script>

  <script src="https://apis.google.com/js/client.js?onload=checkAuth">
    </script>
  </head>
  <body>
    <div id="authorize-div" style="display: none">
      <span>Authorize access to Gmail API</span>
      <!--Button for the user to click to initiate auth sequence -->
      <button id="authorize-button" onclick="handleAuthClick(event)">
        Authorize
      </button>
    </div>
    <pre id="output"></pre>
  </body>
</html>

来源:Gmail API-快速启动