💬

Dify × NotionAPI でNotion内のスクショを自動でテキスト化

に公開
Notion API
Dify
tech

目的

Notion のページにある画像ファイル(スクショ)をDifyのLLMでテキストに変換して、Difyのナレッジベースに登録したい

背景

ナレッジパイプライン機能を利用した際に、データソースでNotionのテキストをナレッジベースに登録できるフローを作成しました。

このとき、Notion で張り付けた画像(スクショ)も読み込んでテキスト化してナレッジベースに登録したいと考えました。

しかし、ナレッジパイプライン機能のNotion の「データソース」やNotion「プラグイン」では、Notion側に貼り付けた画像は取得できなかったので、NotionAPIをHTTPリクエストノードで直接呼び出す方法を試してみました。

他に、ナレッジパイプラインやプラグイン などでもしかすると他にもっと手軽にできる手段があるかもしれませんが、一旦、Notion API で試してみることにしました。

※　Notionプラグインの詳細ページに記載

課題

  • 本当は、ナレッジパイプラインで同時に、スクショもテキスト化して、ナレッジベースに登録してほしかったが、統合方法が見つけれなかったため、今後調査したい。

結果

  • Notionに保存しているスクショ
  • Difyのワークフロー実行後
    テスト実行ですが、画像の内容がテキスト化されています。

作成したワークフロー

Difyバージョン

1.9.1

実施手順

    1. Notion側の設定
    1. Dify側の設定
    1. 動作確認

1. Notion 側の設定

  • Dify のトップページ上部のプラグイン　→　マーケットプレイス　→　検索して、Notion の「詳細を見る」ボタンを押します。

  • Notion プラグインのインストールページが開きますので、ドキュメント記載の「方法１」の「3」まで実施します。Notionプラグインは使用せず、Notion API を直接 HTTP リクエストノードで利用します。

  • 手順通り実施して、「内部インテグレーションシークレット」(Notion API キーのこと)をコピペします

  • 手順通り実施して、対象のNotion のページを 共有できるアクティブな接続状態にします。

  • この時、対象のNotion のページのURLから、Notion の PageID のみをコピペしておきます。

https://www.notion.so/{My-Page-Title}-{PageID}

2. Dify 側

  • 環境変数を設定します。

  • 以下の名前で、先ほどコピペした「Notion API KEY 」と「PageID」の値を貼り付けます。
    変数名は以下のようにしました。

    • NOTION_API_KEY
    • PAGE_ID

  • HTTPリクエストノードを作成します。

  • 右側のペインのcurlからインポートをクリックします。

    • ペイン（pane）: 画面やウィンドウ内で分割された「表示領域」や「パネル」のこと

  • コピペしたcurlコマンドを貼り付けます。

  • 必要な設定が自動でされますので、赤枠の環境変数のところだけ変更します。

  • 次にコード実行ノードを作成します。

  • 赤枠を設定します。

    • コードは、claude に使ってもらいました。(chatGPTだとうまく実行できるコードが生成されず、やはり、一般に言われているようにclaudeの方がコード生成が得意だと感じました。)
    • コード
      ※ Claude により生成
    import json

def main(body: str):
    try:
        # bodyはJSON文字列(エスケープあり)なのでパース
        obj = json.loads(body)
        
        # resultsからブロックデータを取得
        results = obj.get("results", [])
        
        # 画像URLを格納するリスト
        image_urls = []
        
        for block in results:
            # ブロックタイプがimageの場合のみ処理
            if block.get("type") == "image":
                image_data = block.get("image", {})
                
                # fileタイプの場合、URLを取得
                if image_data.get("type") == "file":
                    file_data = image_data.get("file", {})
                    url = file_data.get("url")
                    
                    if url:
                        image_urls.append(url)
        
        return {
            "result": image_urls
        }
        
    except Exception as e:
        return {"error": str(e)}

  • イテレーションノードを作成します。

  • HTTPリクエストノードを作成します。

  • イテレーションノードの item を設定します。

  • ＬＬＭノードを作成します。

  • マルチモーダル機能対応のモデルを設定します。

  • LLMのプロンプトは、一度自身で作成してみてから、Difyの「プロンプト最適化」機能で改善してみました。

  • プロンプトの改善するための指示を入れて、システムプロンプトを改善してもらいました。

  • 画面の「ビジョン」のトグルをオンにして、HTTPリクエスト2 の files を設定します。

  • LLMの全体の設定は以下です。

  • イテレーションノードの入力変数、出力変数は以下を設定しました。

  • 終了ノードは、以下です。

3. 動作確認

  • 実行を押すと、Notion のスクショの画像がテキスト化されていることを確認しました。

参考URL

Discussion