2025.05.06

dify-workflow-scraping-post-request-remix

Difyのワークフローでスクレイピングしたデータを外部アプリへPOST

  • Dify
  • AI
  • Remix

Difyのワークフローで、スクレイピングしたデータを外部アプリにPOST送信し、データベースに保存できるかを検証してみました!本記事ではRemixで用意したAPIエンドポイントにリクエストしています。

ワークフローアプリの作成

ワークフローを選択し作成します。

Web Scraper

Web ScraperはGoogleの提供しているスクレイピングツールで、無償で利用できます。1ブロックにつき、1ページごとの情報を取得します。今回は簡易的に自社サイトで試してみました。

コード実行

ワークフローでpythonかjavascriptのコードを実行できます。デフォルトのままですが、取得した記事をセットします。

localhostを公開

DifyはローカルPCの localhost を参照できないので、ngrokを使って一時的にローカルのurlを公開します。

ngrok http 3333

HTTPリクエスト

ngrokで発行された公開URLを使って、POST送信したいAPIエンドポイント、ヘッダー、ボディを登録します。内容は雑ですがご容赦下さい。

APIエンドポイントの用意

今回Remixで用意したエンドポイントはこちらで、シンプルにデータを登録するだけの内容です。

import arc from "@architect/functions";
import { json } from "@remix-run/node";
import type { ActionFunctionArgs } from "@remix-run/node";

interface Product {
  pk: string;
  name: string;
  description: string;
  createdAt: string;
}

interface ProductResponse {
  name: string;
  description: string;
  createdAt: string;
}

interface CreateProductRequest {
  name: string;
  description: string;
}

export async function loader() {
  const db = await arc.tables();
  
  try {
    const result = await db.product.scan();

    const products: ProductResponse[] = result.Items.map((product: Product) => ({
      name: product.name,
      description: product.description,
      createdAt: product.createdAt,
    }));

    return json({ products });
  } catch (error) {
    console.error("Error fetching products:", error);
    return json({ error: "Failed to fetch products" }, { status: 500 });
  }
}

export async function action({ request }: ActionFunctionArgs) {
  if (request.method !== "POST") {
    return json({ error: "Method not allowed" }, { status: 405 });
  }

  try {
    const db = await arc.tables();
    const body = await request.json() as CreateProductRequest;

    if (!body.name || !body.description) {
      return json(
        { error: "Name and description are required" },
        { status: 400 }
      );
    }

    const product: Product = {
      pk: `product#${Date.now()}`,
      name: body.name,
      description: body.description,
      createdAt: new Date().toISOString(),
    };

    await db.product.put(product);

    return json({ 
      message: "Product created successfully",
      product: {
        name: product.name,
        description: product.description,
        createdAt: product.createdAt,
      }
    }, { status: 201 });
  } catch (error) {
    console.error("Error creating product:", error);
    return json({ error: "Failed to create product" }, { status: 500 });
  }
} 

実行

この内容で、実行してみますと無事成功しました。

Remixアプリ側でもデータを受け取れました。

POST /api/products                            201 Created 

以上、足早に試してみましたが、Difyのワークフロー機能を活用することで、ノーコードでWebスクレイピングからデータの送信までを自動化し、外部アプリケーションとの連携もスムーズに行えました。より作り込んでいくことで開発効率の向上が期待できそうです。