Chrome-Lighthouse

是否攔截Chrome-Lighthouse？

可能不需要。工具型別爬蟲通常為網站所有者使用此類工具對網站進行相關服務請求才會出現。當然，實際情況需站長判斷後再作決定。

通過Robots.txt攔截

您可以通過在網站的 robots.txt 中設定使用者代理訪問規則來遮蔽 Chrome-Lighthouse 或限制其訪問許可權。我們建議安裝 Spider Analyser 外掛，以檢查它是否真正遵循這些規則。

# robots.txt
# 下列程式碼一般情況可以攔截該代理
User-agent: Chrome-Lighthouse
Disallow: /

您無需手動執行此操作，可通過我們的 Wordpress 外掛 Spider Analyser 來攔截不必要的蜘蛛或者爬蟲。

Lighthouse是一個開源的自動工具，用於提高網頁的質量。你可以針對任何網頁執行它，無論是公共的還是需要認證的。它可以對效能、可訪問性、漸進式網路應用程式、搜尋引擎優化等進行檢測。

你可以在Chrome DevTools中執行Lighthouse，也可以從命令列中執行，或者作為一個Node模組。你給Lighthouse一個需要審計的URL，它就會對該頁面進行一系列的審計，然後生成一份關於該頁面表現的報告。在此基礎上，你可以將失敗的審計結果作為改善頁面的指標。每個審計都有一個參考文件，解釋為什麼該審計很重要，以及如何修復它。

你還可以使用Lighthouse CI來防止你的網站出現退步。

請看下面這段來自Google I/O的視訊，瞭解更多關於如何使用Lighthouse併為之做出貢獻。

開始工作

選擇最適合你的Lighthouse工作流程。

• 在Chrome DevTools中。輕鬆稽覈需要認證的頁面，並以使用者友好的格式閱讀你的報告。
• 在命令列中。通過Shell指令碼自動執行Lighthouse。
• 作為一個Node模組。將Lighthouse整合到你的持續整合系統中。
• 從Web UI。執行Lighthouse並連結到報告，無需安裝任何東西。

CLI和Node工作流程要求你在機器上安裝一個Google Chrome瀏覽器例項。

在Chrome DevTools中執行Lighthouse

Lighthouse在Chrome DevTools中擁有自己的面板。要執行一個報告：

1. 下載桌面版谷歌瀏覽器。
2. 在谷歌瀏覽器中，轉到你想審計的URL。你可以審計網路上的任何URL。
3. 開啟Chrome DevTools。
4. 點選Lighthouse標籤。
5. 左邊是將被審計的頁面的視口。右邊是Chrome DevTools的Lighthouse面板，它是由Lighthouse提供的。
6. 單擊 “Analyze page load“。DevTools會向你顯示一個審計類別的列表。讓它們全部啟用。
7. 點選Run audit。30至60秒後，Lighthouse會給你一份關於該頁面的報告。

安裝並執行Node命令列工具

要安裝Node模組：

• 下載桌面版谷歌瀏覽器。
• 安裝當前長期支援版本的Node。
• 安裝Lighthouse。 -g 標誌將其作為一個全域性模組安裝。

npm install -g lighthouse

要執行一個檢測：

lighthouse <url>

要看到所有的選項：

lighthouse --help

以程式設計方式執行Node模組

關於以程式設計方式執行Lighthouse（作為Node模組）的例子，請參見以程式設計方式使用。

執行PageSpeed Insights

要在PageSpeed Insights上執行Lighthouse：

1. 導航到PageSpeed Insights。
2. 輸入一個網頁的URL。
3. 單擊 “Analyze“。

將Lighthouse作為Chrome擴充套件程式執行

注意事項：除非您有特殊原因，否則您應該使用Chrome DevTools工作流程而不是這個Chrome擴充套件工作流程。DevTools工作流程允許測試本地網站和經過驗證的頁面，而該擴充套件程式不允許。

安裝擴充套件程式:

1. 下載[Google Chrome for Desktop][desktop]。
2. 從Chrome Webstore安裝Lighthouse Chrome擴充套件。

要執行一個檢測：

1. 在Chrome瀏覽器中，進入你想要檢測的頁面。
2. 點選Lighthouse圖示。它應該在Chrome位址列的旁邊。如果沒有，請開啟Chrome的擴充套件選單，從那裡進入。點選後，Lighthouse選單會展開。
3. 單擊 “Generate report“。Lighthouse會根據當前的重點頁面進行檢測，然後開啟一個新的標籤頁，上面有一份結果報告。

線上分享和檢視報告

使用Lighthouse Viewer線上檢視和分享報告。

使用JSON分析報告

Lighthouse Viewer需要Lighthouse報告的JSON輸出。下面的列表解釋瞭如何獲得JSON輸出，這取決於你所使用的Lighthouse工作流程：

• Lighthouse報告。開啟右上角的三個點選單然後點選Save as JSON
• 命令列。執行:

  lighthouse --output json --output-path <path/for/output.json>

   

檢視報告資料:

1. 開啟Lighthouse Viewer.
2. 將JSON檔案拖到檢視器上，或者點選檢視器中的任何地方，開啟你的檔案導航器並選擇該檔案。

以GitHub Gists的形式分享報告

如果你不想手動傳遞JSON檔案，你也可以將你的報告作為祕密的GitHub gists來分享。gists的一個好處是免費的版本控制。

要從報告中匯出一個報告作為gist：

1. (如果已經在檢視器上，跳過這一步）開啟右上方的三個點選單然後點選Open In Viewer。該報告在檢視器中開啟，位於 https://googlechrome.github.io/lighthouse/viewer/.
2. 在檢視器中，開啟右上方的三個點選單然後點選Save as Gist。第一次這樣做時，會有一個彈出視窗，要求允許訪問你的GitHub基本資料，以及讀寫你的gists。

要從Lighthouse的CLI版本將報告匯出為gist，需要手動建立一個gist，並將報告的JSON輸出複製貼上到gist中。包含JSON輸出的gist檔名必須以 .lighthouse.report.json結尾。關於如何從命令列工具中生成JSON輸出的例子，請參見分享報告為JSON。

要檢視已儲存為要點的報告：

• Addto the Viewer’s URL, where <ID> is the ID of the gist.在檢視器的URL中新增 ?gist=<ID> ，其中<ID> 是gist的ID。

  https://googlechrome.github.io/lighthouse/viewer/?gist=

• 開啟檢視器，並將gist的URL貼上到其中。

Lighthouse的可擴充套件性

Lighthouse旨在為所有網站開發人員提供相關的、可操作的指導。為此，Lighthouse有兩個功能，可以讓你根據自己的具體需要來定製Lighthouse。

Stack Packs

開發人員使用許多不同的技術（後端/CMS/JavaScript框架）來構建他們的網頁。Lighthouse現在能夠根據所使用的工具，提供更有針對性和可操作性的建議，而不是隻提供一般建議。

“Stack Packs” 使Lighthouse能夠檢測到你的網站是在什麼平臺上建立的，並顯示基於堆疊的具體建議。這些建議是由社羣的專家定義和策劃的。

要想貢獻一個Stack Pack，請檢視貢獻指南。

Lighthouse 外掛

Lighthouse 外掛允許領域專家根據其社羣的具體需求擴充套件Lighthouse的功能。你現在能夠利用Lighthouse收集的資料來建立新的審計。Lighthouse外掛的核心是一個節點模組，它實現了一組檢查，將由Lighthouse執行，並作為一個新的類別新增到報告中。

有關如何建立自己的外掛的更多資訊，請檢視Lighthouse GitHub repo中的《外掛手冊》。

整合Lighthouse

如果你是一家公司或個人，正在將Lighthouse作為你所提供的產品/服務的一部分，首先，我們很高興你能這樣做！我們希望儘可能多的人能夠使用Lighthouse。我們希望儘可能多的人使用Lighthouse，本《整合Lighthouse的指南和品牌資產》旨在讓你在保護我們的品牌的同時，直接展示Lighthouse在引擎中的作用。

為Lighthouse做貢獻

Lighthouse是開源的，歡迎大家做出自己貢獻。你可以檢視儲存庫的問題追蹤器，找到你可以修復的錯誤，或者你可以建立或改進的審計。問題追蹤器也是一個討論效能指標、新審計想法或其他與Lighthouse有關的問題的好地方。