使用Python開發chrome插件

時間 2019-12-05

原文原文鏈接

本文由伯樂在線 - xianhu 翻譯，Daetalus 校稿。未經許可，禁止轉載！
英文出處：pythonspot.com。歡迎加入翻譯小組。html

谷歌Chrome插件是使用HTML、JavaScript和CSS編寫的。若是你以前歷來沒有寫過Chrome插件，我建議你讀一下這個。在這篇教程中，咱們將教你如何使用Python代替JavaScript。python

建立一個谷歌Chrome插件ajax

首先，咱們必須建立一個清單文件：manifest.json。chrome

 
        { 
       
        "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/" 
       
        ] 
       
        }

而後建立一個名爲popup.html的文件：json

 
        <!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 
        >

最後獲得一個圖標，並保存爲icon.png。打開chrome://extensions，點擊開發者模式。點擊「加載未打包擴展程序」，選擇文件夾，點擊OK。api

爲Chrome擴展程序添加Python瀏覽器

如今你擁有了最基本的權利，咱們能夠在代碼中添加Python。爲了能在一個瀏覽器中運行Python，你有不少個選擇，包括Brython和emcascripten。咱們決定使用Brython。咱們將從一個服務器運行Brython腳本。改變popup.html的內容：服務器

 
        <!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 
        >

重啓下你的插件，你就會在你的谷歌Chrome瀏覽器中獲得一個Python（Brython）解釋器。框架

運行你本身的腳本less

爲了可以運行你本身的腳本，簡單地修改一下popup.html框架中的url便可：

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

這個腳本應該運行在你本身的服務器上。你能夠從網上運行任意的Brython腳本。利用Brython，你能夠簡單地在腳本標籤中輸入Python代碼。看一下這個Brython的例子，或者簡單地瀏覽下這個網站。

總結：

Chrome插件是使用HTML、JavaScript和CSS建立的。咱們想知道在谷歌Chrome插件中可否使用Python代碼。咱們最終獲得了一個瀏覽器中的Python解釋器和執行Python腳本的能力。記住，這只是個實現性的結果，只是一個玩具，在這一點上，我不建議你將全部的插件都移植或創建在Brython上。