Creating Google Chrome Extensions.pdf - T HE E X P ER T...

Unformatted text preview: T HE E X P ER T ’S VOIC E ® IN W E B D E V E L O P M E N T Creating Google Chrome Extensions — Learn how to create great extensions for Google’s popular Chrome browser — Prateek Mehta Creating Google Chrome Extensions Prateek Mehta Creating Google Chrome Extensions Prateek Mehta New Delhi, India ISBN-13 (pbk): 978-1-4842-1774-0 DOI 10.1007/978-1-4842-1775-7 ISBN-13 (electronic): 978-1-4842-1775-7 Library of Congress Control Number: 2016943479 Copyright © 2016 by Prateek Mehta This work is subject to copyright. All rights are reserved by the Publisher, whether the whole or part of the material is concerned, specifically the rights of translation, reprinting, reuse of illustrations, recitation, broadcasting, reproduction on microfilms or in any other physical way, and transmission or information storage and retrieval, electronic adaptation, computer software, or by similar or dissimilar methodology now known or hereafter developed. Exempted from this legal reservation are brief excerpts in connection with reviews or scholarly analysis or material supplied specifically for the purpose of being entered and executed on a computer system, for exclusive use by the purchaser of the work. Duplication of this publication or parts thereof is permitted only under the provisions of the Copyright Law of the Publisher’s location, in its current version, and permission for use must always be obtained from Springer. Permissions for use may be obtained through RightsLink at the Copyright Clearance Center. Violations are liable to prosecution under the respective Copyright Law. Trademarked names, logos, and images may appear in this book. Rather than use a trademark symbol with every occurrence of a trademarked name, logo, or image we use the names, logos, and images only in an editorial fashion and to the benefit of the trademark owner, with no intention of infringement of the trademark. The use in this publication of trade names, trademarks, service marks, and similar terms, even if they are not identified as such, is not to be taken as an expression of opinion as to whether or not they are subject to proprietary rights. While the advice and information in this book are believed to be true and accurate at the date of publication, neither the authors nor the editors nor the publisher can accept any legal responsibility for any errors or omissions that may be made. The publisher makes no warranty, express or implied, with respect to the material contained herein. Managing Director: Welmoed Spahr Acquisitions Editor: Ben Renow-Clarke Development Editor: Matthew Moodie Technical Reviewer: Massimo Nardone Editorial Board: Steve Anglin, Pramila Balen, Louise Corrigan, James DeWolf, Jonathan Gennick, Robert Hutchinson, Celestin Suresh John, Nikhil Karkal, James Markham, Susan McDermott, Matthew Moodie, Douglas Pundick, Ben Renow-Clarke, Gwenan Spearing Coordinating Editor: Nancy Chen Copy Editor: Kezia Endsley Compositor: SPi Global Indexer: SPi Global Artist: SPi Global Distributed to the book trade worldwide by Springer Science+Business Media New York, 233 Spring Street, 6th Floor, New York, NY 10013. Phone 1-800-SPRINGER, fax (201) 348-4505, e-mail [email protected], or visit . Apress Media, LLC is a California LLC and the sole member (owner) is Springer Science + Business Media Finance Inc (SSBM Finance Inc). SSBM Finance Inc is a Delaware corporation. For information on translations, please e-mail [email protected], or visit . Apress and friends of ED books may be purchased in bulk for academic, corporate, or promotional use. eBook versions and licenses are also available for most titles. For more information, reference our Special Bulk Sales–eBook Licensing web page at . Any source code or other supplementary materials referenced by the author in this text is available to readers at . For detailed information about how to locate your book’s source code, go to . Printed on acid-free paper Dedicated to my parents and my brother for their everlasting support and encouragement. And to the Stack Overflow community, for making computer programming less troublesome. Contents at a Glance About the Author .............................................................................. xi About the Technical Reviewer ........................................................ xiii Acknowledgments ........................................................................... xv Introduction ................................................................................... xvii ■Chapter 1: Introduction to Google Chrome Extensions ................... 1 ■Chapter 2: Architecture Overview ................................................ 35 ■Chapter 3: API Availability and Messaging .................................. 79 ■Chapter 4: More About Extensions ............................................. 145 Index .............................................................................................. 163 v Contents About the Author .............................................................................. xi About the Technical Reviewer ........................................................ xiii Acknowledgments ........................................................................... xv Introduction ................................................................................... xvii ■Chapter 1: Introduction to Google Chrome Extensions ................... 1 What Are Google Chrome Extensions? .................................................... 1 Support for Browser Extensions ............................................................................... 1 Extensions Are Not Plug-ins ..................................................................................... 2 Extensions and Plug-ins ........................................................................................... 3 Notable Examples.................................................................................... 4 Adding Extensions from the Store ........................................................... 5 Technologies to Create Extensions .......................................................... 8 How Are Technologies Used? .................................................................................... 8 Extensions API ......................................................................................... 8 Creating Your First Extension .................................................................. 9 Validating a JSON File ............................................................................................ 11 Creating the Manifest ............................................................................................. 12 Adding the Button: Browser-Action ........................................................................ 12 vii ■ CONTENTS Loading the Extension Folder ................................................................ 15 Debugging an Extension........................................................................ 17 Inspecting the Popup .............................................................................................. 18 Sources and Resources Panel ................................................................................ 19 Console Panel ......................................................................................................... 21 Distributing on Store ............................................................................. 22 Summary ............................................................................................... 33 ■Chapter 2: Architecture Overview ................................................ 35 What Is User Perspective?..................................................................... 35 Components Involved in Creating Chrome Extensions .......................... 35 Extension Runtime ................................................................................ 40 Scripts Representing the Runtime .......................................................................... 41 Input Components: Part One.................................................................. 42 The Browser-Action and Page-Action Components ................................................ 42 Shortcut Key or Command...................................................................................... 46 Event Scripts ......................................................................................... 50 The Need for Event Scripts ..................................................................................... 51 Role of the Manifest for This Component ............................................................... 53 Event Objects .......................................................................................................... 56 Revisiting the onCommand Event ........................................................................... 57 Declarative Event Handlers..................................................................................... 57 Content Scripts ...................................................................................... 62 Role of the Manifest for this Component ................................................................ 63 HelloContentScript Extension ................................................................................. 65 Examples of Components ...................................................................... 68 BrowserActionNotes Extension .............................................................................. 68 PageActionNotes Extension .................................................................................... 74 Summary ............................................................................................... 77 viii ■ CONTENTS ■Chapter 3: API Availability and Messaging .................................. 79 Input Components: Part Two.................................................................. 79 Omnibox Inputs....................................................................................................... 79 Context Menu Items................................................................................................ 85 Revisiting Content-UI .............................................................................................. 90 Messaging for Communication ............................................................. 94 APIs and Events ...................................................................................................... 95 Web Page Scripts and Event Scripts ...................................................................... 96 Content Scripts and Event Scripts ........................................................................ 103 Popup Scripts and Event Scripts .......................................................................... 115 Google Chrome Extensions APIs .......................................................... 117 Declare Permissions ............................................................................................. 118 Alarms API ............................................................................................................ 121 Bookmarks API ..................................................................................................... 124 Downloads API ...................................................................................................... 128 History API ............................................................................................................ 132 Notifications API ................................................................................................... 134 Storage API ........................................................................................................... 137 Tabs API ................................................................................................................ 139 XHR API ................................................................................................................. 142 Summary ............................................................................................. 144 ■Chapter 4: More About Extensions ............................................. 145 Providing an Options Page .................................................................. 145 Role of Manifest for this Component .................................................................... 145 Writing an Options Page ....................................................................................... 146 Working with Override Pages .............................................................. 149 Role of Manifest for this Component .................................................................... 151 OverridePages Extension ...................................................................................... 151 ix ■ CONTENTS Creating Themes for Google Chrome................................................... 155 Extensions Development: Security Concerns ...................................... 160 API Permissions .................................................................................................... 160 Match Pattern Permissions .................................................................................. 160 Externally Connectable ......................................................................................... 160 Storage ................................................................................................................. 160 Content Script ....................................................................................................... 161 Summary ............................................................................................. 162 Index .............................................................................................. 163 x About the Author Prateek Mehta (pixdip.com/admin/about.html) holds a bachelor’s in Information Technology Engineering from the Indraprastha University, New Delhi. He is a web and game developer and is currently working full-time as a Unity3D Game Developer at MetaDesign Solutions, Gurgaon. He finds developing Chrome extensions really fun because he considers extensions the best possible way to enhance browsing experiences. Some of the sample extensions from this book, published on the Chrome web store, are available at pixdip.com/extensions. Prateek resides in the lovely city of Dwarka, in southwest Delhi. When not doing technical things, he works as a freelance music instructor. He spends his spare time playing CounterStrike. de_dust2 and de_inferno are his favorite maps, where he is busy sniping with his AWP. On Stack Overflow, he has a keen interest in answering questions tagged under “css”, “javascript”, “php”, “unity3d”, and “opengl-es-2.0”. He was also the lead author of Learn OpenGL ES (Apress, 2013). xi About the Technical Reviewer Massimo Nardone holds a master’s in computing science from the University of Salerno, Italy. He has worked as a project manager, software engineer, research engineer, chief security architect, information security manager, PCI/SCADA auditor, and senior lead IT security/cloud/ SCADA architect for many years. He currently works as the chief information security officer (CISO) for Cargotec Oyj. He has more than 22 years of work experience in IT, including in the security, SCADA, cloud computing, IT infrastructure, mobile, security, and WWW technology areas for both national and international projects. He worked as a visiting lecturer and supervisor for exercises at the Networking Laboratory of the Helsinki University of Technology (Aalto University). He has been programming and teaching people how to program with Android, Perl, PHP, Java, VB, Python, C/C++, and MySQL for more than 20 years. He holds four international patents (in the PKI, SIP, SAML, and Proxy areas). He was also the co-author of Pro Android Games (Apress, 2015). xiii Acknowledgments My sincere thanks go to Steve Anglin and Ben Renow-Clarke for giving me this wonderful opportunity to write for Apress! Thanks to my coordinating editor, Nancy Chen, for handling this project to completion. Thanks to Matthew Moodie, for his efforts to improve the content, and to Massimo Nardone, the tech reviewer for this book, for providing his helpful insights. Thank you to Tom Welsh and Jill Balzano—the editors on my first book Learn OpenGL ES—for mentoring me and preparing me as an author. Thanks to my friends—Anupam Appar and Pratik Sharma—for reviewing the source code and providing the necessary encouragement to write this book. Also thanks to my pro-gamer comrade, Tejas Tilak, for lending his amazing photography skills. xv Introduction Creating Google Chrome Extensions is an intermediate-level book that teaches development of browser extensions for Google Chrome web browser. Browser extensions are extremely viable in enhancing functionality of web browsers. They have access to almost all the features provided by the browser. And they can encapsulate such features in the form of a bundled application to provide a targeted functionality to users – such as an extension that can summarize the current page you are reading, or another extension that can save all the images in the page you are browsing. Extensions run in a sandboxed environment, making them secure – which is a huge plus! The APIs provided by Chrome Extensions framework help to empower web applications by coupling them with amazing features provided by the Google Chrome web browser, such as bookmarks, history, tabs, actions, storage, notifications, search, and a lot more other features. After understanding the examples and lessons in this book, you will be able to transform your existing web applications as (into) Google Chrome browser extensions, as well as create brand new extensions that serve some useful purpose. In this book we will go from discovering what Google Chrome Extensions are, how to create them, extension components and messaging, to publishing of extensions on the Chrome Web Store (formerly the Google Chrome Extensions Gallery). “Extensions” is the only way out for sped-up productivity on Google Chrome browsers. So, showcase your existing web development skills in a completely modernized way, by “Creating Google Chrome Extensions”. xvii CHAPTER 1 Introduction to Google Chrome Extensions In this chapter you will learn about Google Chrome Extensions, which are a useful way to add functionality to the Google Chrome web browser. We will first take a quick look at some popular Google Chrome Extensions and the technologies that are used to code Chrome Extensions. Then, you will learn how to create your own “Hello World” style Chrome Extension—but only after we describe the features and abilities of Chrome Extensions. Finally, you will learn about publishing Chrome Extensions on the Chrome Web Store (formerly the Google Chrome Extensions Gallery). This chapter assumes you have some experience writing simple web pages using technologies such as HTML, CSS, and JavaScript. That said, let’s get started! What Are Google Chrome Extensions? Google Chrome Extensions are browser extensions for the Google Chrome web browser. Browser extensions are programs that run within the context (security sandbox) of a web browser. They help to provide new functionality(ies) by combining existing features of the web browser and make it possible for users to do many things at once! ■ Note At the time of this writing, Google Chrome Extensions are only supported on the desktop versions of the Google Chrome web browser. Support for Browser Extensions The Google Chrome web browser started supporting browser extensions in its fourth version, which was released in 2010. It is also possible to create extensions for browsers such as Safari, Mozilla Firefox, and Opera. Extensions created for the Goog...
View Full Document