前面我們介紹了幾款比較優(yōu)秀的 Chrome 插件，大家都覺得好用，比如 Omni，這些工具都是為提高生產(chǎn)力而生的，今天我們又來(lái)介紹另外一款火爆的開源 Chrome(也支持 Firefox)插件：Automa，我相信你一定也會(huì)喜歡的。

Automa 是一個(gè)用于 Chrome 瀏覽器自動(dòng)化的插件，從自動(dòng)填寫表格、執(zhí)行重復(fù)性任務(wù)、截屏、抓取網(wǎng)站數(shù)據(jù)等等，完全可以根據(jù)你自己的需求來(lái)決定如何使用。

安裝

最簡(jiǎn)單的方式可以通過(guò)打開 Chrome 網(wǎng)上應(yīng)用店 https://chrome.google.com/webstore/detail/infppggnoaenmfagbfknfkancpbljcca 打開并單擊添加到 chrome按鈕即可安裝 Automa chrome 擴(kuò)展程序。

當(dāng)然也可以根據(jù)源碼構(gòu)建進(jìn)行離線安裝：

# Clone 代碼
git clone https://github.com/Kholid060/automa.git && cd automa
# 安裝依賴
yarn install
# 構(gòu)建插件包
yarn build
# 創(chuàng)建一個(gè)zip包
yarn build:zip
# 然后將構(gòu)建后的插件拖到瀏覽器插件頁(yè)面即可

使用

安裝完成后會(huì)跳轉(zhuǎn)到歡迎頁(yè)面，左側(cè)是整個(gè)工具可操作的菜單。

可以通過(guò)閱讀文檔了解 Automa 如何使用，Automa 官方市場(chǎng)也提供了許多可用的工作流可以直接使用。在工作流頁(yè)面可以導(dǎo)入或新建工作流。工作流是由塊組成的一系列自動(dòng)化過(guò)程，這些塊按照它們連接的順序執(zhí)行，并且總是從觸發(fā)塊開始?？梢酝ㄟ^(guò)錄制和手動(dòng)兩種方式創(chuàng)建工作流。默認(rèn)會(huì)自帶一個(gè) Google search 的工作流。

點(diǎn)擊工作流可以進(jìn)入編輯頁(yè)面。比如現(xiàn)在我們來(lái)新建一個(gè)下載抖音視頻的工作流。點(diǎn)擊新建工作流創(chuàng)建一個(gè)新的工作流，默認(rèn)會(huì)添加一個(gè)手動(dòng)的觸發(fā)器。

然后在左側(cè)工具欄中拖動(dòng)活動(dòng)標(biāo)簽頁(yè)到編輯器，并拖動(dòng)鼠標(biāo)將觸發(fā)器與活動(dòng)標(biāo)簽頁(yè)鏈接起來(lái)：

接著我們需要獲取抖音的視頻文件，可以在需要處理的頁(yè)面點(diǎn)擊Automa獲取元素信息:

由于抖音的視頻文件地址并沒有直接顯示在頁(yè)面上，直接獲取較麻煩，我們可以在抖音頁(yè)面審查元素來(lái)獲取，打開審查元素頁(yè)面，Ctrl + F 搜索mp4關(guān)鍵字，找到視頻地址的元素，然后右鍵選擇 Copy -> Copy XPath，獲取視頻地址 XPath 路徑 //*[@id="douyin-header"]/div[2]/div[2]/div/div[1]/div/div/xg-video-container/video/source[1]：

然后回到 Automa 工作流編輯頁(yè)面添加一個(gè)屬性值，并配置上 XPath：

這里比較重要的是要配置獲取的屬性名稱src，然后我們還可以將獲取到的數(shù)據(jù)分配給一個(gè)變量videosrc，接著可以再添加一個(gè)新建標(biāo)簽頁(yè)，將其中的 URL 地址設(shè)置為：https:{{ variables@videosrc}}，表示將前面獲取到的視頻文件作為一個(gè)新的標(biāo)簽頁(yè)地址，如下所示：

創(chuàng)建完工作流后保存即可?，F(xiàn)在我們就可以在任何一個(gè)抖音頁(yè)面來(lái)獲取視頻地址了，只需要點(diǎn)擊上面創(chuàng)建工作流的『播放』按鈕即可獲取到了。

如果你想直接保存到本地也可以繼續(xù)添加一些 Block。

Automa 還有非常多功能，可以查看官方文檔 https://docs.automa.site/ 了解更多使用方法。