能被重複的事，就該交給機器去做。

在 Day 18，我們學會把資料存進 Airtable，讓工作流不再只是一次性任務，而成為未來資料的「中繼站」。

那麼，接下來我們要更進一步：如何讓這些資料自動化地一筆筆被處理？

想像你現在手上有 20 本書的網址，要打開、擷取、儲存。

如果你要為每本書手動做一套流程，那會是 20 條工作流。

但其實，n8n 有一個超強的「Loop Over Items」節點，可以讓我們把同樣的流程自動重複執行 20 次，而這正是自動化的精髓。

本篇的模板可在此下載（連結）

🧩 Step 1｜研究要爬的網頁結構

為了知道迴圈裡要做什麼，我們先了解要從每本書頁面抓什麼。

1. 點進首頁第一本書的頁面，可以看到網址是

   https://books.toscrape.com/catalogue/a-light-in-the-attic_1000/index.html

   而我們原本抓到的網址是 catalogue/a-light-in-the-attic_1000/index.html，這代表它是「相對路徑」。

2. 接著想想要抓哪些資訊，並打開瀏覽器的檢查工具（Day 9 有教過），找出它們的 CSS Selector：

Classification（類別）：body > div > div > ul > li:nth-child(3) > a

Price（價格）：#content_inner > article > div.row > div.col-sm-6.product_main > p.price_color

Availability（剩餘數量）：#content_inner > article > div.row > div.col-sm-6.product_main > p.instock.availability

我們只要抓它們的「文字」就好。

🔁 Step 2｜Loop Over Items 迴圈設定

1. 在前一篇 Airtable 的 Search records 節點後面，連上 Loop Over Items 節點。

   它有 1 個輸入口、2 個輸出口：「done」和「loop」。

2. 把「loop」接到一個「Replace Me」節點，然後再接回 Loop Over Items 的輸入口。

   • 「loop」是每次要重複的動作
   • 「Replace Me」是要被換掉的節點

3. 執行一次「Replace Me」看看，會發現每次只會進來 1 筆資料。

4. 執行整條流程，可以看到上面線條顯示 20 items，而 Loop Over Items 節點顯示 21 次（代表進來1次+迴圈20次）。

✅ 這代表它已經可以一筆一筆地處理資料了。

🌐 Step 3｜HTTP Request 節點

1. 我們要用它打開每本書的頁面。

2. 在 URL 欄位中，將前一個節點的資料拖曳進來，會變成

   {{ $json.URL }}

   但它只有相對路徑，所以要改成：

https://books.toscrape.com/{{ $json.URL }}

這樣每次迴圈時，{{ $json.URL }} 都會換成當前那筆資料的網址。

📄 Step 4｜HTML 節點擷取資料

1. 設定方式如下：
   • Operation：Extract HTML Content
   • Source Data：JSON
   • JSON Property：data
   • Extraction Values：
     • KEY：Classification / Price / Availability
     • CSS Selector：填入剛剛找到的選擇器
     • Return Value：Text
2. 執行後，檢查輸出資料是否正確。

💾 Step 5｜Airtable 儲存資料

1. 設為「Map Each Column Manually」模式。
2. 從 HTML 節點拉入三個資料：
   • {{ $json.Classification }}
   • {{ $json.Price }}
   • {{ $json.Availability }}
3. Title、URL 要從前面的 Search records 節點拉入：
   • {{ $('Search records').item.json.Title }}
   • {{ $('Search records').item.json.URL }}

📌 小提醒：

• $json.xxx 代表是上一個節點的資料
• $('節點名稱').item.json.xxx 則是從指定節點拉資料
• 這樣即使節點位置移動，我們也能準確抓到資料。

1. 點擊執行，回到 Airtable，就會看到資料被更新！

🏁 Step 6｜完整迴圈測試

回到工作流最前端，按下「Execute Workflow」按鈕，觀察流程會自動重複 20 次，抓完首頁所有 20 本書的資料 🎉

📝 小小展望

現在，我們已經能自動擷取書本的 分類、價格、剩餘數量，並全部存到資料庫。

不過像 Availability 目前是「In stock (22 available)」這種文字，我們能不能只抓出數字 22 呢？

下一篇（Day 20）我們就要教大家，用 Code 節點跑 JS 程式碼 來萃取想要的內容。

不會寫程式也別怕，你可以請 AI 幫你寫！

📌 小作業

• 如果不熟 HTML 的夥伴，可以先用 Day 10~12 的方法，用第三方 API、MCP、AI Agent 來處理資料。
• 並嘗試讓這些資料能在 Airtable 中以同樣格式儲存。

🔑 提示：Day 10 提到的「設定輸出格式」，會是重點。

交流

我建立了一個行銷技術交流群，專注討論 SEO、行銷自動化等主題，歡迎有興趣的朋友一起加入交流。

掃QR Code 或點擊圖片加入