Budget Bytesのスクレイピング方法：レシピとコストデータの抽出

import asyncio
from playwright.async_api import async_playwright

async def scrape_budget_bytes():
    async with async_playwright() as p:
        # ブラウザの起動
        browser = await p.chromium.launch(headless=True)
        page = await browser.new_page()
        
        # レシピページへ移動
        await page.goto('https://www.budgetbytes.com/one-pot-creamy-mushroom-pasta/')
        
        # レシピコンテナの読み込みを待機
        await page.wait_for_selector('.wprm-recipe-container')
        
        # page.evaluate 経由でデータを抽出
        recipe_data = await page.evaluate('''() => {
            return {
                title: document.querySelector('.wprm-recipe-name')?.innerText,
                total_cost: document.querySelector('.wprm-recipe-cost')?.innerText,
                calories: document.querySelector('.wprm-nutrition-label-text-nutrition-value-calories')?.innerText
            }
        }''')
        
        print(recipe_data)
        await browser.close()

asyncio.run(scrape_budget_bytes())

import scrapy

class BudgetBytesSpider(scrapy.Spider):
    name = 'budget_bytes'
    # よりクリーンなデータ抽出のために WordPress REST API を使用
    start_urls = ['https://www.budgetbytes.com/wp-json/wp/v2/posts?per_page=20']

    def parse(self, response):
        posts = response.json()
        for post in posts:
            yield {
                'id': post.get('id'),
                'title': post.get('title', {}).get('rendered'),
                'url': post.get('link'),
                'published_date': post.get('date'),
                'slug': post.get('slug')
            }
        
        # ヘッダーにページネーションがあれば追跡する
        # （ロジックは簡略化のため省略）

const puppeteer = require('puppeteer');

(async () => {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();
  
  // 基本的なブロックを回避するために user agent を設定
  await page.setUserAgent('Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/95.0.4638.69 Safari/537.36');
  
  await page.goto('https://www.budgetbytes.com/one-pot-creamy-mushroom-pasta/', { waitUntil: 'networkidle2' });

  const data = await page.evaluate(() => {
    const title = document.querySelector('.wprm-recipe-name')?.textContent;
    const costPerServing = document.querySelector('.cost-per')?.textContent;
    const items = Array.from(document.querySelectorAll('.wprm-recipe-ingredient')).map(i => i.textContent.trim());
    return { title, costPerServing, items };
  });

  console.log(data);
  await browser.close();
})();