thêm chức năng tùy chỉnh vào bảng điều khiển của chrome

Question

Có thể có chức năng tùy chỉnh trong google-chrome sẽ luôn có sẵn trong bảng điều khiển (bất kể trang nào được tải) không? Ví dụ, tôi muốn có một chức năng gọi là echo đó sẽ chỉ là một wrapper quanh console.log. Điều này chỉ tiết kiệm một chút gõ nhưng sau đó tôi có thể muốn tạo ra một số chức năng gỡ lỗi hữu ích.

Answer 1

Cũng khá dễ thực hiện. Những gì bạn cần là tạo một content script. Tập lệnh này sẽ được chèn vào bất kỳ trang nào và tạo một số hàm toàn cục cần thiết mà bạn sẽ sử dụng trong bảng điều khiển của mình. Phần khó khăn nhất là cách làm cho các hàm scrtipt nội dung tùy chỉnh trở thành một phần của đối tượng thực tế của bạn, bởi vì thông thường bạn không thể truy cập các hàm hoặc biến mà bạn xác định trong tập lệnh nội dung của bạn từ phần còn lại của mã javascript không nằm trong nội dung kịch bản. Các tập lệnh nội dung chạy trong môi trường bị cô lập.

Đoạn mã nội dung được thực thi trong một môi trường đặc biệt được gọi là thế giới bị cô lập. Họ có quyền truy cập vào DOM của trang mà họ được tiêm vào, nhưng không truy cập vào bất kỳ biến hoặc hàm JavaScript nào được tạo bởi trang. Dường như mỗi tập lệnh nội dung như thể không có JavaScript thực thi khác trên trang đang chạy. Điều ngược lại cũng đúng: JavaScript chạy trên trang không thể gọi bất kỳ chức năng nào hoặc truy cập bất kỳ biến nào được xác định bởi tập lệnh nội dung.

Nhưng có cách giải quyết lạ mắt.
Bạn xác định file manifest của bạn như sau:

manifest.json

{ 
    "name": "Content script", 
    "version": "0.1", 
    "manifest_version": 2, 
    "content_scripts": [{ 
     "matches": ["http://*/*"], 
     "js": ["console.js"] 
    }] 
} 

Và kịch bản nội dung của bạn:

console.js

function customConsole() { 
    window.myNewFunction = function() { 
     console.log("Hello I'm available from console."); 
    }; 
} 

var script = document.createElement('script'), 
    code = document.createTextNode('(' + customConsole + ')();'); 
script.appendChild(code); 
(document.body || document.head || document.documentElement).appendChild(script); 

Vì vậy, bạn chỉ định các hàm mới của bạn là các hàm toàn cục mũ bạn có thể sử dụng chúng trong console.
Ngoài ra, hãy xem tại đây post