Chrome Extensions Development--gmail Attachment Management Assistant

0. Why do you have this set of blog posts

At the end of 2014, although the Chrome extension development (also as a practical project for the Software Engineering course) had been largely completed, the extension was difficult to work in the case of a large number of messages in the mailbox (about five-digit orders of magnitude), gmailassist This is obviously not a qualified software, at that time, although the final acceptance of the smooth "finish", but the software "unqualified" has been my heart. After a year of study, although the front-end development of knowledge there is no further grasp, but the idea of software engineering and so on has a deeper level than at the time of understanding. At the same time, although it was developed to some extent following the principles of agile development, the code structure was still confusing, so it was recently planned to be completely refactored, fixing bugs, and improving the performance of the extension.
At that time in the development, I almost completely no front-end development experience, from the HTML, JS, the most basic syntax to learn the edge of the development of the extension, when lazy did not timely knowledge, skills, including the development of the detour in the road to comb and record down. Now want to refactor, found a lot of things have to re-comb, so decided in this refactoring process, the Gmail API, Chrome extension, mail format, OAUTH2 certification and other related knowledge to organize into text, deepen their understanding, memory, at the same time, It is also expected that this article will be helpful to developers who are ready to develop in these areas.
If you're interested in gmailassist, you can search for "Gmail assistant " or "gmailassist" in the chrome store, or go directly to https:// Chrome.google.com/webstore/detail/gmail-attachment-manager/lchiijlphndndjfgecehgmkjbdohndjd to try it out. If you are interested in the source code, you are welcome to check its source code on GitHub: Https://github.com/IceSuger/Gmail_Plugin. (When writing this article, refactoring is not finished, so on GitHub is still a piece of rotten code ...) 2016.1.11)

first, the user needs

The user's Gmail is a lot of attachments, scattered in the various messages, I hope to have a plug-in, through it to unified view, bulk download, when creating a new message from the bulk selection of attachments and inserted, without having to manually search and download the re-upload.

second, the target function

Before development begins, it is necessary to understand each of our specific functions (otherwise, it is difficult to do without a clear goal in the development process). So, here are a few basic features that our plug-in needs to have:

1. be able to obtain and display all the attachments in the user's mailbox;
2. Be able to download one of the listed attachments separately;
3. The ability to insert an attachment from a list in the file to be sent.

In these basic functions, we can improve the functionality by iterating over and over again, allowing the user to better use the plugin. In particular, further (some of them are thought of during the development process or are added based on user feedback):

1. In the attachment list, display the message header, time and other message information of the attachment;
2. The list of attachments is sorted by different keywords (including attachment name, attachment size, message time, etc.);
3. Allows the user to specify a smaller search range by entering the list of attachments;
4. The list of attachments obtained, allowing the user to filter out unwanted entries by input;
5. Allows users to check the box to select multiple attachments, to achieve bulk operation;
6. Implementation of both Chinese and English versions.

Iii. What knowledge is required to complete development

With a general objective, it is time to consider further how it is achieved. The first idea is that we want to develop a chrome extension, which is the basic knowledge of the development of chrome extensions and basic front-end development knowledge (at least HTML, JavaScript, CSS Common syntax) is needed. Second, after the search, Gmail has an official set of more mature APIs for developers to call. The next step to learn about developing a third-party plugin for Gmail is to get the user's authorization through OAUTH2, so the fundamentals of OAuth2 need to be understood.
So this blog post will have the following:[Chrome expands the basics of development and some tips and traps reminders. A simple introduction to the Gmail API, including tips and trap reminders. Understanding of the OAuth2. i18n methods and tricks for chrome extensions. ]

Each of them is written in conjunction with Gmailassist's specific development process, as many of the knowledge points have specific examples, which are easier to write and read. The Chrome extension is actually a plug-in for Chrome, so I'll use the words "plugins", "Extensions", "extensions" later in the article. In addition, because of the more specific, so some things may not be comprehensive introduction, I will introduce them with a more complete document, such as the address, so that you can further understand the relevant content.

Chrome Extensions Development--gmail Attachment Management Assistant