4. What is an Extension?
•
•
•
•
A compressed package
Extends the functionality of the browser
Minimal or No UI
Usually enhances functionality of websites or web apps
5. What is an App?
•
•
•
•
Runs inside your browser
Has a Dedicated User Interface
Rich User Interaction
Ex. Games and Photo Editors
6. What an Extension contains?
•
•
•
•
•
manifest.json
browser action or page action
content script - CSS/JS
background pages
Other media files
8. Layout of an Extension
chrome - top-level object & is exposed to extensions
•
•
•
•
•
•
•
chrome.extension.*
chrome.browserAction.*
chrome.pageAction.*
chrome.windows.*
chrome.tabs.*
chrome.bookmarks.*
Does not access much of the native code
9. Manifest.json
For details, see Manifest Files.
{
JSON
"manifest_version": 2,
"name": “HUG Chennai",
"description": "This is a sample app",
"version": "1.0",
"browser_action": {
"default_icon": "icon.png", "default_popup": "popup.html"
},
"permissions": [
"https://secure.flickr.com/"
]
}
13. Content Script
•
•
•
Part of the loaded page
Injects contents into the page using scripts
Exchange messages to parent script
14. Where are extensions stored?
http://dev.chromium.org/user-experience/user-data-directory
Windows :
%userprofile%Local SettingsApplication DataGoogleChromeUser DataDefaultExtensions
or
C:Documents and SettingsAdminLocal SettingsApplication DataGoogleChromeUser
DataDefaultExtensions
Linux :
~/.config/google-chrome/Default/Extensions/
Mac OSX :
~/Library/Application Support/Google/Chrome/Default
File:///
16. Nothing works!
• Refused to load script from 'http://code.jquery.com/jquery-latest.js' because of
Content-Security-Policy.
• Refused to execute inline script because of Content-Security-Policy.
• Refused to execute inline event handler because of Content-Security-Policy.
Need to:
• Load external scripts over HTTPS
• Extract own scripts to .js files
• Remove inline event handlers
