Developing chrome plugins with Python

Source: Internet
Author: User
Tags python script

This article by Bole Online-xianhu translation, Daetalus School Draft. without permission, no reprint!
English Source: pythonspot.com. Welcome to join the translation team.

Google Chrome plugins are written using HTML, JavaScript, and CSS. If you've never written a chrome plugin before, I suggest you read this. In this tutorial, we'll show you how to use Python instead of JavaScript.

Create a Google Chrome plugin

First, we must create a manifest file: Manifest.json.

12345678910111213141516 {  "manifest_version": 2,  "name": "Python Chrome Plugin",  "description": "This extension runs Python code.",  "version": "1.0",  "browser_action": {    "default_icon": "icon.png",    "default_popup": "popup.html"  },  "permissions": [    "activeTab",    "https://ajax.googleapis.com/"  ]}

Then create a file named popup.html:

123456789101112131415161718192021222324252627282930313233343536 <!doctype html><!-- This page is shown when the extension button is clicked, because the "browser_action" field in manifest.json contains the "default_popup" key with value "popup.html". --><html>  <head>    <title>Getting Started Extension‘s Popup</title>    <style>      body {        font-family: "Segoe UI", "Lucida Grande", Tahoma, sans-serif;        font-size: 100%;      }      #status {        /* avoid an excessively wide status text */        white-space: pre;        text-overflow: ellipsis;        overflow: hidden;        max-width: 400px;      }    </style>     <!--      - JavaScript and HTML must be in separate files: see our Content Security      - Policy documentation[1] for details and explanation.      -      - [1]: https://developer.chrome.com/extensions/contentSecurityPolicy     -->    <script src="popup.js"></script>  </head>  <body>    <div id="status"></div>    <img id="image-result" hidden>  </body></html>

Finally get an icon and save it as icon.png. Open Chrome://extensions and click Developer Mode. Click "Load unpacked Extensions", select the folder, and click OK.

Add Python for Chrome extensions

Now that you have the most basic right, we can add Python to the code. To be able to run Python in a browser, you have a number of options, including Brython and Emcascripten. We decided to use Brython. We will run the Brython script from a server. Change the content of popup.html:

12345678910111213141516171819202122 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html><head><meta charset="iso-8859-1"><style>body {        margin: 0 !important;    padding: 0 !important;    width: 800;} #frame {    overflow: hidden;    width:790;    height:324;}</style></head><body onLoad=""><iframe src=http://brython.info/console.html id="frame" seamless="seamless" scrolling="no"></iframe></body></html>

Restart your plugin and you'll get a python (Brython) interpreter in your Google Chrome browser.

Run your own script

To be able to run your own scripts, simply modify the URLs in the popup.html framework:

1 <iframesrc="BRYTHON SCRIPT URL" id="frame" seamless="seamless"scrolling="no"></iframe>

This script should run on your own server. You can run arbitrary Brython scripts from the Web. With Brython, you can simply enter Python code in the Script tab. Take a look at this brython example, or simply browse to the site.

Summarize:

Chrome plugins are created using HTML, JavaScript, and CSS. We want to know if we can use Python code in Google Chrome plugins. We finally got a Python interpreter in the browser and the ability to execute the Python script. Remember, this is just an implementation of the results, just a toy, at this point, I do not recommend that you have all the plug-ins are ported or built on the Brython.

About Xianhu

Developing chrome plugins with Python

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.