>本文展示了使用Gmail Rest API和JavaScript構建基本的Gmail收件箱查看器。 我們將利用jQuery和Bootstrap提高效率。完整的代碼可在我們的github存儲庫中可用。
>
密鑰功能：
>訪問Google的開發人員控制台。
創建或選擇一個項目。
http://localhost
>我們將使用Google的JavaScript客戶端庫進行簡化的交互。 我們的HTML文件包括jQuery，Bootstrap和Google客戶端庫：
> 。 >
用戶身份驗證：
<!DOCTYPE html>
<html>
<head>
<title>Gmail API demo</title>
<meta charset="UTF-8">
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css">
<style>
.hidden { display: none; }
</style>
</head>
<body>
<div class="container">
<h1>Gmail API demo</h1>
<button id="authorize-button" class="btn btn-primary hidden">Authorize</button>
<table class="table table-striped table-inbox hidden">
<thead>
<tr>
<th>From</th>
<th>Subject</th>
<th>Date/Time</th>
</tr>
</thead>
<tbody></tbody>
</table>
</div>
<🎜>
<🎜>
<🎜>
<🎜>
</body>
</html>，YOUR_CLIENT_ID>，YOUR_API_KEY，
， 函數使用OAuth 2.0處理用戶身份驗證。 （此處省略了這些功能的代碼，但可在GitHub repo中使用）。
>。handleClientLoad()>提取和顯示收件箱消息：checkAuth()>
handleAuthClick()handleAuthResult()函數使用gmail API獲取最後十個消息，並調用loadGmailApi()將它們添加到表中。
>。 顯示電子郵件內容：
displayInbox()>模態窗口使用iframe安全地顯示電子郵件內容，從而防止了與應用程序的樣式發生的潛在衝突。 （此處省略了此功能的代碼，但在GitHub repo中可用）。 appendMessageRow()>
appendMessageRow()
>提供的CSS樣式在模態內iframe。 （此處省略了此處的代碼，但可以在GitHub repo中使用）。 >
進一步的改進：
以上是使用Gmail JavaScript API掌握收件箱的詳細內容。更多資訊請關注PHP中文網其他相關文章！
