google chrome mở rộng :: console.log () từ trang nền?


173

Nếu tôi gọi console.log('something');từ trang bật lên, hoặc bất kỳ tập lệnh nào được bao gồm thì nó hoạt động tốt.

Tuy nhiên, vì trang nền không trực tiếp chạy khỏi trang bật lên nên nó không được bao gồm trong bảng điều khiển.

Có cách nào để tôi có thể console.log()vào trang nền để hiển thị trong bảng điều khiển cho trang bật lên không?

Có cách nào để, từ trang nền gọi một chức năng trong trang bật lên không?


Bạn có ý nghĩa chính xác bằng cách nói "nó hoạt động tốt"? Trường hợp đang đọc "một cái gì đó"? Sử dụng console.log () trong cửa sổ bật lên không nên in trong bảng điều khiển của trang đã tải - vì câu hỏi đã 2 năm nên API có thay đổi không?
anddam

14
nếu bạn nhấp chuột phải -> kiểm tra cửa sổ bật lên trên hành động trình duyệt của bạn, bạn sẽ nhận được trang công cụ dành cho nhà phát triển cho tiện ích mở rộng của mình. popup.js sẽ in nhật ký đến đó.
not_shitashi

Nhận xét của @ not_shitashi sẽ là câu trả lời cho câu hỏi này.
gabe

Câu trả lời:


154

Bất kỳ trang mở rộng nào (ngoại trừ tập lệnh nội dung ) đều có quyền truy cập trực tiếp vào trang nền thông qua chrome.extension.getBackgroundPage().

Điều đó có nghĩa là, trong trang bật lên , bạn chỉ có thể làm:

chrome.extension.getBackgroundPage().console.log('foo');

Để dễ sử dụng hơn:

var bkg = chrome.extension.getBackgroundPage();
bkg.console.log('foo');

Bây giờ nếu bạn muốn làm tương tự trong các tập lệnh nội dung, bạn phải sử dụng Message Passing để đạt được điều đó. Lý do, cả hai đều thuộc về các lĩnh vực khác nhau, có ý nghĩa. Có rất nhiều ví dụ trong trang Message Passing để bạn kiểm tra.

Hy vọng rằng sẽ xóa tất cả mọi thứ.


1
@MohamedMansour, giải pháp này không hiệu quả với tôi. Nếu tôi alert() chrome.extension.getBackgroundPage(), tôi nhận được null. Tôi có cần phải có quyền đặt hoặc một số cấu hình khác không?
gwg

@gwg tiện ích mở rộng của bạn có trang nền không? Theo tài liệu "Trả về null nếu tiện ích mở rộng không có trang nền." developer.chrome.com/extensions/
Kẻ

Điều này hoạt động hoàn hảo cho các tin nhắn của riêng tôi để điều khiển. Cảm ơn. Bạn có suy nghĩ gì về cách làm cho ngoại lệ, v.v. từ popup.js xuất hiện trong bảng điều khiển của background.js không?
steven_noble

194

Bạn có thể mở bảng điều khiển của trang nền nếu bạn nhấp vào liên kết "nền.html" trong danh sách tiện ích mở rộng.

Để truy cập trang nền tương ứng với tiện ích mở rộng của bạn, hãy mở Settings / Extensionshoặc mở một tab mới và nhập chrome://extensions. Bạn sẽ thấy một cái gì đó giống như ảnh chụp màn hình này.

Đối thoại tiện ích mở rộng Chrome

Dưới phần mở rộng của bạn bấm vào liên kết background page. Điều này mở ra một cửa sổ mới. Đối với mẫu menu ngữ cảnh , cửa sổ có tiêu đề : _generated_background_page.html.


4
Chúc mừng, tôi biết điều này, tuy nhiên việc mở trang nền trực tiếp không gọi bất cứ thứ gì từ trang bật lên.
Hailwood

Mở trang nền không xuất ra bất kỳ thông tin đăng nhập giao diện điều khiển.
Layke

@Hailwood mở trang nền không gọi bất cứ điều gì nhưng sẽ hiển thị bảng điều khiển cho trang nền.
anddam

1
@Layke khi bạn mở trang nền, bạn vẫn phải viết vào đó, tức là sử dụng trực tiếp console.log () từ trang nền hoặc, như mohamed-mansour đã nói, gọi phương thức tương tự trên đối tượng được getBackgroundPage ()
anddam trả về

3
Tôi tìm thấy câu hỏi này khi tìm cách kiểm tra đầu ra tiện ích mở rộng (như OP) và thấy câu trả lời này rất hữu ích vì nó cho phép tôi kiểm tra nhật ký bảng điều khiển mà không cần thông qua trang nội dung.
anddam

66

Để trả lời câu hỏi của bạn trực tiếp, khi bạn gọi console.log("something")từ nền, thông báo này được ghi lại, vào bảng điều khiển của trang nền. Để xem nó, bạn có thể đi đến chrome://extensions/và nhấp vào đó inspect viewdưới phần mở rộng của bạn.

Khi bạn nhấp vào cửa sổ bật lên, nó sẽ được tải vào trang hiện tại, do đó console.log sẽ hiển thị thông báo nhật ký trong trang hiện tại.


Tôi cũng vậy! Nó là đơn giản nhất và trực tiếp.
SaidbakR

phần mở rộng của tôi không có điều đó, tuy nhiên các phần mở rộng khác làm! Làm thế nào để tôi kích hoạt nó
Ahmed Eid

Nếu bạn có 3 màn hình như tôi ... hãy xoay đầu. Nó đã mở ChromeDevTools ở phía đối diện của mảng màn hình của tôi và tôi đã không nhìn thấy nó.
mở

26

Bạn vẫn có thể sử dụng console.log (), nhưng nó được đăng nhập vào một bảng điều khiển riêng. Để xem nó - nhấp chuột phải vào biểu tượng tiện ích mở rộng và chọn "Kiểm tra cửa sổ bật lên".


12

Giải pháp đơn giản nhất là thêm đoạn mã sau vào đầu tệp. Và hơn bạn có thể sử dụng tất cả api bảng điều khiển Chrome đầy đủ như bình thường.

 console = chrome.extension.getBackgroundPage().console;
// for instance, console.assert(1!=1) will return assertion error
// console.log("msg") ==> prints msg
// etc

9
const log = chrome.extension.getBackgroundPage().console.log;
log('something')

Nhật ký mở:

  • Mở: chrome: // extend /
  • Chi tiết> Trang nền

Bạn có muốn cung cấp thêm một số giải thích cho các lệnh của bạn?
inetph Phantom

7

Hãy thử điều này, nếu bạn muốn đăng nhập vào bảng điều khiển của trang hoạt động:

chrome.tabs.executeScript({
    code: 'console.log("addd")'
});

1
Yêu cầu quyền truy cập máy chủ cho tab hiện tại.
Xan

Bạn có thể thêm nó để kiểm tra và loại bỏ nếu bạn phát hành addon.
Faz

1

Liên quan đến câu hỏi ban đầu tôi muốn thêm vào câu trả lời được chấp nhận của Mohamed Mansour rằng đó cũng là một cách để thực hiện công việc này theo cách khác:

Bạn có thể truy cập các trang mở rộng khác (ví dụ trang tùy chọn, trang bật lên) từ trong trang / tập lệnh nền với chrome.extension.getViews()cuộc gọi. Theo mô tả ở đây .

 // overwrite the console object with the right one.
var optionsPage = (  chrome.extension.getViews()  
                 &&  (chrome.extension.getViews().length > 1)  ) 
                ? chrome.extension.getViews()[1] : null;

 // safety precaution.
if (optionsPage) {
  var console = optionsPage.console;
}

1

Đó là một bài viết cũ, với câu trả lời đã tốt, nhưng tôi thêm hai bit của mình. Tôi không muốn sử dụng console.log, tôi muốn sử dụng một trình ghi nhật ký để đăng nhập vào bảng điều khiển hoặc bất cứ nơi nào tôi muốn, vì vậy tôi có một mô-đun xác định chức năng nhật ký giống như cái này

function log(...args) {
  console.log(...args);
  chrome.extension.getBackgroundPage().console.log(...args);
}

Khi tôi gọi nhật ký ("đây là nhật ký của tôi"), nó sẽ viết thông báo cả trong bảng điều khiển bật lên và bảng điều khiển nền.

Ưu điểm là có thể thay đổi hành vi của nhật ký mà không phải thay đổi mã (như vô hiệu hóa nhật ký để sản xuất, v.v ...)


0

Để có được một bản ghi giao diện điều khiển từ một trang nền, bạn cần viết đoạn mã sau vào trang nền.js -

chrome.extension.getBackgroundPage (). console.log ('xin chào');

Sau đó tải phần mở rộng và kiểm tra trang nền của nó để xem nhật ký giao diện điều khiển.

Hãy tiếp tục !!

Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.