Chrome extended development 2. How to use chrome extensions API?

Chrome extended development 2. How to use chrome extensions API?

Google's chrome extensions API is one of the most authoritative materials used to develop chrome extensions, this section describes in detail the functions implemented by chrome extensions and the interfaces provided by Chrome browsers (for example, how to call user bookmarks ). This article describes how to use chrome extensions.

What does a seemingly complete chrome extension have?

.. The title of the circle... In fact, it is what kind of chrome extension looks like .. (It's still around ...)

1. Plug-in bar icon (optional ):

These icons are all ~~

2. Plug-in pop-up page (optional)

The icons in the plug-in bar can be clicked. A small page will pop up with the left-click button, showing the items completely controlled by the developer. A menu will pop up when you right-click the page, this is not controlled by chrome extensions.

3. Extended Management page icon (optional)

The icon displayed on the extended management page. This icon is consistent with the icon displayed when installing the plug-in, but is set separately with the plug-in bar icon.

If you do not define this icon, it will look like this after the extension is installed...

4. Options page (plug-in settings page, optional)

If your plug-in contains a setting page, the "options" link will be displayed on the Extension Management page.

5. New Tab

By default, when you create a blank tag, it will display the recently visited website and recently closed tags.

This page can be modified through extension. Some extensions have changed this page to a task list and common websites.

6. small icons selected for different pages

For example, this icon can be displayed only when a specific page is loaded.

The icons in the extension bar cannot be displayed/hidden through program control.

These mentioned above are part of browser UI in the API documentation.

 

What interfaces does chrome provide for extensions?

1. bookmarks

Chrome extension can easily obtain the user's bookmarked data, including the bookmarked ID, address, title, and even directory. It also provides interfaces for adding, modifying, deleting, and searching.

2. History

Chrome extensions can be added or deleted (all, according to specific URLs, etc.), and user history can be searched.

3. browser tab

Chrome extension can be used to obtain the tabs opened by the current user, monitor the tab status (being created, loaded, loaded, and removed), create and remove tabs. You can also inject CSS to a specific tab (that is, add a new CSS to the page) and execute JS Code (equivalent to introducing a JS file to the page, and sharing the JS variables of the page)

4. browser window

A window can contain multiple tabs. Developers can create, remove, update a window, or monitor window actions (created? Status change? Disabled ?)

These are the browser interaction section in the API documentation.

Where can I write my code? Where to execute?

As mentioned above, chrome extension is a few web pages, so the code is JavaScript of the web page. The Chrome browser cleverly designs several special web pages. developers can use the JS Code in these pages to implement many functions.

1. Background pages)

Javascript in the background HTML starts to run when the browser is opened, and stops working when the browser is closed. You can write some code here to monitor browser actions (for example, when a user is monitored to create a new tab, _^ is disabled maliciously), and you can perform scheduled tasks (such as setinterval ), you can add a piece of music... However, this page is invisible to the body user ..

2. Pop-up page of the extension bar icon

When you click the extension bar icon, a page is displayed. When you click the page, the page is closed .. This is a complete web page with video, animation, and function buttons.

3. Content scripts)

You can use js to obtain the DOM data of your current webpage and listen to users' keyboard and mouse movements. These code is an independent JS file (instead of embedded js code in an HTML file, such as the background or pop-up window), which is injected to the corresponding Webpage through the extension configuration.

4. Read user computer data (npapi plugins)

This function requires DLL (Dynamic Link Library) knowledge, which can start the user's computer programs and delete user files .. It is equivalent to a small windows program. Using the method provided by Chrome, the extended background page can communicate with your DLL.

These are the implementation sections in the API documentation.

Automatic update

The autoupdating part tells you how chrome extended automatic upgrade works.