17
Mozilla Extension Development Prasanna K

Prasanna K. Agenda Setting Up the Environment Introduction Extension Essentials Building a Extension Demo Users Build a Banking a Trojan Building the

Embed Size (px)

Citation preview

Page 1: Prasanna K. Agenda Setting Up the Environment Introduction Extension Essentials Building a Extension Demo Users Build a Banking a Trojan Building the

Mozilla Extension Development

Prasanna K

Page 2: Prasanna K. Agenda Setting Up the Environment Introduction Extension Essentials Building a Extension Demo Users Build a Banking a Trojan Building the

AgendaSetting Up the EnvironmentIntroductionExtension Essentials Building a Extension Demo Users Build a Banking a Trojan Building the Trojan

Page 3: Prasanna K. Agenda Setting Up the Environment Introduction Extension Essentials Building a Extension Demo Users Build a Banking a Trojan Building the

Environment Create a Separate Profile Fill with command for creating a firefox

profile and use profile folder

Page 4: Prasanna K. Agenda Setting Up the Environment Introduction Extension Essentials Building a Extension Demo Users Build a Banking a Trojan Building the

Development Preferences Some of the Development config on fire for ease of development and bug fix.

javascript.options.showInConsole = true. Logs errors in chrome files to the Error Console. nglayout.debug.disable_xul_cache = true. Disables the XUL cache so that changes to

windows and dialogs do not require a restart. This assumes you're using directories rather than JARs. Changes to XUL overlays will still require reloading of the document overlaid.

browser.dom.window.dump.enabled = true. Enables the use of the dump() statement to print to the standard console. See window. dump for more info. You can use nsIConsoleService instead of dump() from a privileged script.

javascript.options.strict = true. Enables strict JavaScript warnings in the Error Console. Note that since many people have this setting turned off when developing, you will see lots of warnings for problems with their code in addition to warnings for your own extension. You can filter those with Console2.

extensions.logging.enabled = true. This will send more detailed information about installation and update problems to the Error Console. (Note that the extension manager automatically restarts the application at startup sometimes, which may mean you won't have time to see the messages logged before the automatic restart happens. To see them, prevent the automatic restart by setting the environment NO_EM_RESTART to 1 before starting the application.)

nglayout.debug.disable_xul_fastload = true. For Gecko 2.0+ (Firefox 4.0+). See this bug for more information.

dom.report_all_js_exceptions = true. See JavaScript Exception Logging about:config

Page 5: Prasanna K. Agenda Setting Up the Environment Introduction Extension Essentials Building a Extension Demo Users Build a Banking a Trojan Building the

Tools of TradeKomodo Edit IDE (My Fav): Development

EnvironmentDOM Inspector: used to inspect and edit the

live DOM of any web document or XUL application (Firefox and Thunderbird)

Venkman: JavaScript DebuggerConsole² : Enhanced JavaScript consoleFirebug : XPCOM Viewer: Exploring XPCOM

Components

Page 6: Prasanna K. Agenda Setting Up the Environment Introduction Extension Essentials Building a Extension Demo Users Build a Banking a Trojan Building the

Firefox extension proxy fileCreate a file in the extensions folder of the

profile of the FirefoxFile name should match the ID of extension

mentioned in the “install.rdf”The content of the file should be the location

of the files were the extension is stored.

Page 7: Prasanna K. Agenda Setting Up the Environment Introduction Extension Essentials Building a Extension Demo Users Build a Banking a Trojan Building the

Getting Started – Extension DevelopmentThe File layout format is very essential in

extension development.Step 1 Create 2 Blank files in the folder(ext root)

you in folder you intend to create the extension (install.rdf, chrome. manifest)

Step 2 Create 2 Folders (chrome, content): (ext root)-->(Chrome) -->(content)

Page 8: Prasanna K. Agenda Setting Up the Environment Introduction Extension Essentials Building a Extension Demo Users Build a Banking a Trojan Building the

Extension Development - ContdStep 3 Create 2 files in the content folder

(browsers.xul, simple.js)End Result<ext root>\ install.rdf , chrome. manifest <chrome>\ <content>\             browsers.xul simple.js

Page 9: Prasanna K. Agenda Setting Up the Environment Introduction Extension Essentials Building a Extension Demo Users Build a Banking a Trojan Building the

Install.rdf<?xml version="1.0" encoding="UTF-8"?><RDF xmlns="http://www.w3.org/1999/02/22-rdf-syntax-

ns#" xmlns:em="http://www.mozilla.org/2004/em-rdf#">

<Description about="urn:mozilla:install-manifest"> <em:id>[email protected]</em:id>

<em:version>1.0</em:version> <em:type>2</em:type>

<!-- Target Application this extension can install into, with minimum and maximum supported versions. -->

<em:targetApplication> <Description> <em:id>{ec8030f7-c20a-464f-9b0e-13a3a9e97384}</em:id> <em:minVersion>1.5</em:minVersion> <em:maxVersion>4.0.*</em:maxVersion> </Description> </em:targetApplication>

<!-- Front End MetaData --> < em:name>hello</em:name> <em:description>ISEA</em:description><em:creator>IIT Guwahati</em:creator><em:iconURL></em:iconURL><em:homepageURL></em:homepageURL><em:optionsURL></em:optionsURL> <em:updateURL></em:updateURL></Description> </RDF>

XML based format Directs the Firefox environment

about itself and environment the extension can work

Distinct 3 zones First the ID of the extension Second Talks about the

environment and the version supported

{ec8030f7-c20a-464f-9b0e-13a3a9e97384} is the ID of Firefox

The last Section is more information on the extension and its creator

Page 10: Prasanna K. Agenda Setting Up the Environment Introduction Extension Essentials Building a Extension Demo Users Build a Banking a Trojan Building the

chrome. Manifest & OverlayInsert this line in the chrome manifest file

“content heloo chrome/content/ “

this line says that for a chrome package hello, we can find its content files at the location chrome/content which is a path relative to the location of “chrome. manifest”.

Overlay overlay chrome://browser/content/browser.xul chrome://hello/content/browsersxul

This tells Firefox to merge browsers.xul into browser.xul when browser.xul loads.

Browser.xul is the main window that we see. Multiple windows exist like preferances, bookmark manager

add-ons management, etc…Overlay can be used to display our Xul superimposed in any of

these windows.

Page 11: Prasanna K. Agenda Setting Up the Environment Introduction Extension Essentials Building a Extension Demo Users Build a Banking a Trojan Building the

Browsers.xul<?xml-stylesheet

href="chrome://hellooworld/content/browser.css" type="text/css"?>

<!DOCTYPE overlay SYSTEM "chrome://hellooworld/locale/browser.dtd">

<overlay xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">

<script src=‘chrome://hello/content/simple.js’></script>

<statusbar id="status-bar"> <button id="helloWorldButton" label="hello“

insertafter="statusbar-display" oncommand="HelloWorld.onCommand(event)"

style="color: blue"/> </statusbar></overlay>

xul is a XML based User Interface language used by Mozilla.

User actions are glued together by JavaScript.

The main browser is a xul document.

This code will create a blue submit button with label “submit” in the status bar.

Page 12: Prasanna K. Agenda Setting Up the Environment Introduction Extension Essentials Building a Extension Demo Users Build a Banking a Trojan Building the

browser.jsLet HelloWorld ={onCommand: function(event){ alert(‘Hello World’);}};

Anonymous Function call.

Such calls is back bone in extension development

Page 13: Prasanna K. Agenda Setting Up the Environment Introduction Extension Essentials Building a Extension Demo Users Build a Banking a Trojan Building the

TestingPlace the Firefox proxy file in the extensions

folder inside the profile we created or in the program files->Mozzila->Extensions folder.

Restart your browser and you sud have your new shiny new extension installed.

Welcome to the exciting world of Mozzila Extensions.

Page 14: Prasanna K. Agenda Setting Up the Environment Introduction Extension Essentials Building a Extension Demo Users Build a Banking a Trojan Building the

Real World Scenario.I had a problem : I was following some

friends in Twitter who were JapaneseObviously They tweeted in Japanese, I was no

way able to understand what they said. There was only 1 existing solution and it was

not meeting my requirement. I decided to write my own extension which

translated any foreign language to English at hit of a button.

Demo & Internals

Page 15: Prasanna K. Agenda Setting Up the Environment Introduction Extension Essentials Building a Extension Demo Users Build a Banking a Trojan Building the

Work ShopI will help you create a very basic Banking

Trojan. Some these concepts can be effectively used

to create use real world useful extensions.We will create a extension that would get

activated when some one tries to connect to specific URL.

It then copies the User Name Password sent in the post and sends to a malicious site.

Page 16: Prasanna K. Agenda Setting Up the Environment Introduction Extension Essentials Building a Extension Demo Users Build a Banking a Trojan Building the

TrojanWe will create the basic structure of the

extension as discussed just now. This is a Trojan so we don’t want any user

interfaces so we keep the XUL blank but overlay the XUL with browser window.

We create Event Listener for window load. The event listener when fired registers a

“observe”This observer functionality can be used to

intercept all HTTP/s requests.

Page 17: Prasanna K. Agenda Setting Up the Environment Introduction Extension Essentials Building a Extension Demo Users Build a Banking a Trojan Building the

Trojan – ContdIf the url being requested is the one we are

looking for we move to the next step. The next step is to copy the POST parameters

being sent to the web siteWe send this content to a malicious website