Chrome扩展开发（Gmail附件管理助手）系列之〇——概述

最新推荐文章于 2022-06-17 18:14:22 发布

weixin_30686845

最新推荐文章于 2022-06-17 18:14:22 发布

阅读量187

点赞数

文章标签：前端 javascript ViewUI

原文链接：http://www.cnblogs.com/ligerleng/p/gmail_assist_0.html

版权

零、为什么会有这一套博文

　　2014年底虽然已经基本完成GmailAssist这一chrome扩展开发（当时也是作为软件工程课程的实践项目），但该扩展程序对于邮箱内邮件数目较多（大约五位数的数量级上）的情况，就很难正常工作了，这显然不是一个合格的软件，当时虽然终期验收顺利“交差”了，但这个软件的“不合格”却一直是我的一个心病。经过一年的学习，尽管对于前端开发的知识没有什么更进一步的掌握，但对软件工程的思想等等有了比起当时来说更深一层的认识。同时，当时虽然是一定程度上遵循敏捷开发的原则来进行的开发，但代码结构仍然比较混乱，因此最近计划对其进行一次完整的重构，同时修复bug、提升该扩展的性能。
当时在进行开发时，我几乎完全没有前端开发的经验，从HTML、js的最基本语法开始边学边实现了该扩展的开发，当时偷懒没有及时把知识、技巧包括开发途中走的弯路梳理并记录下来。现在想重构时，发现很多东西都得从头再梳理，因此决定在此次重构过程中，把Gmail API、chrome扩展、邮件格式、OAuth2认证等相关的知识整理成文字，加深自己理解、记忆的同时，也期待这套文章能对准备进行有关这些方面开发的开发者有所帮助。
如果你对GmailAssist感兴趣，可以在chrome商店中搜索“Gmail助手”或者“GmailAssist”，或者直接访问https://chrome.google.com/webstore/detail/gmail-attachment-manager/lchiijlphndndjfgecehgmkjbdohndjd来试用它。如果你对源码感兴趣，欢迎在GitHub上查看它的源码：https://github.com/IceSuger/Gmail_Plugin。（写这篇文章时，重构还没完成，所以github上暂时还是一坨烂代码...2016.1.11）

一、用户需求

　　用户的Gmail中附件很多，分散在各个邮件中，希望能有一款插件，通过它来统一查看、批量下载、在建立新邮件时从中批量选择附件并插入，而不必手动搜索并下载重新上传。

二、目标功能

　　开发开始之前，有必要搞清楚我们具体要实现的每一个功能（否则开发过程没有清晰的目标，就很难进行）。那么，我们的插件需要拥有的几项基本的功能如下：

能够获取并显示用户邮箱里的全部附件；
能够单独下载列出的附件中的某个；
能够在要发送的草稿中插入列表中的某个附件。

　　在这些基本的功能上，我们可以通过一次次迭代来完善功能，让用户更好地使用这个插件。具体点来说，进一步还要有（其中的一些是开发过程中才想到的或者根据用户反馈而追加的）：

在附件列表中显示该附件对应的邮件标题、时间等邮件信息；
对附件列表进行按不同关键词（包括附件名称、附件大小、邮件时间等）的排序；
获取附件列表时，允许用户通过输入指定一个更小的搜索范围；
对获取到的附件列表，允许用户通过输入来过滤掉不需要的条目；
允许用户通过复选框来勾选多个附件，实现批量操作；
实现中文、英文两种版本。

三、要完成开发需要哪些知识

　　有了一个大致的目标，就该进一步考虑如何实现了。首先的想法是我们要开发一个chrome扩展，那chrome扩展的开发的基本知识以及基本的前端开发知识（至少是HTML、javascript、CSS的常用语法）是需要的。其次，搜索后得知Gmail有着一套官方的比较成熟的API，供开发者调用。接下来了解到开发针对Gmail的第三方插件，需要通过OAuth2获得用户的授权，那么OAuth2的基本原理也需要了解。
因此这套博文会有如下内容：[chrome扩展开发基础知识及一些小tips和陷阱提醒。Gmail API的简单介绍、包括tips和陷阱提醒。对OAuth2的理解。chrome扩展的i18n方法和技巧。]

其中每篇我都结合GmailAssist的具体开发过程来写，因为很多知识点有具体例子的话，写起来和读起来都会更容易。chrome扩展，其实就是一个针对chrome浏览器的插件，因此后文中我会混用“插件”、“扩展”、“扩展程序”这几个名词。另外，因为比较具体，所以有些东西的介绍可能并不全面，我会在介绍它们时附上更完整的文档等的地址，方便大家进一步了解相关内容。

转载于:https://www.cnblogs.com/ligerleng/p/gmail_assist_0.html