Featured image of post Obsidianで選択したテキストをGeminiに投げる｜自分専用のAIエディターを自作した話
Tips

Obsidianで選択したテキストをGeminiに投げる｜自分専用のAIエディターを自作した話

Obsidianでブログを書いているとき、「あ、ここの文章を要約したい」とか「誤字脱字を直したい」と思う瞬間がありますよね。

ブラウザを開いてコピペするのは面倒。かといってAIエディター（有償ツール）をわざわざ導入するほどでもない。

それなら、APIを使ってObsidianの中にGeminiを直接呼び出せばいいじゃないか、というのが今回のテーマです。

JavaScriptを使って、自分好みの「書く相棒」を仕立て上げるプロセスを楽しんでいきましょう。

ObsidianとAIの融合イメージ

結局、CLIよりAPIのほうが「話が早かった」

最初はカッコつけて、ローカル環境で動く「Gemini CLI」をObsidianから呼び出そうと格闘していました。でも、CLIだと「今、自分がエディターで選択しているこのテキスト」をスマートにAIに渡すのが意外と難儀したんです。

OSの環境パスの問題や、エスケープ処理の泥臭さに頭を悩ませ……。試行錯誤の末にたどり着いたのが、 QuickAdd（プラグイン）とJavaScriptを使ったAPI直接呼び出し でした。

これなら、マウスで選択したテキストをそのままGeminiの懐にダイレクトに放り込めます。

準備するもの：APIキーと、ほんの少しの好奇心

必要なものはこれだけ。拍子抜けするほどシンプルです。

  1. Google AI StudioのAPIキー : こちらで無料で取得できます。
  2. QuickAddプラグイン : Obsidianのコミュニティプラグインからインストールしてください。
  3. JavaScriptコード : 下記に用意しました。

コードを置く場所は、Vault内の任意のフォルダでOKですが、管理しやすいように名前をつけておきましょう。

魔法のスクリプト：gemini_process.js

これが今回作成した、Obsidian内で動くJavaScriptです。これを .js ファイルとして保存して、Vault内の好きな場所に置いてください。

※APIキーはGitHubなどで公開しないよう注意してください。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64

// ファイル名: gemini_process.js
module.exports = async (params) => {
  const { quickAddApi, app } = params;

  // ※ここに取得したAPIキーを入力してください
  const API_KEY = "YOUR_API_KEY_HERE";
  const MODEL = "gemini-2.0-flash";

  if (!API_KEY || API_KEY === "YOUR_API_KEY_HERE") {
    new Notice("APIキーを正しく設定してください");
    return;
  }

  const activeLeaf = app.workspace.activeLeaf;
  if (!activeLeaf || activeLeaf.view.getViewType() !== "markdown") return;

  const editor = activeLeaf.view.editor;
  const selection = editor.getSelection();
  if (!selection) {
    new Notice("テキストを選択してください");
    return;
  }

  const instruction = await quickAddApi.inputPrompt(
    "Geminiへの指示",
    "要約して / 構成案を作って / 誤字脱字を直して...",
  );
  if (!instruction) return;

  new Notice("Geminiに相談中...");

  const endpoint = `https://generativelanguage.googleapis.com/v1beta/models/${MODEL}:generateContent?key=${API_KEY}`;

  try {
    // Obsidian内蔵のrequestUrlを使ってCORSを回避
    const response = await requestUrl({
      url: endpoint,
      method: "POST",
      headers: { "Content-Type": "application/json" },
      body: JSON.stringify({
        contents: [{ parts: [{ text: `${instruction}:\n\n${selection}` }] }],
      }),
    });

    const data = response.json;
    const output = data?.candidates?.[0]?.content?.parts?.[0]?.text;

    if (output) {
      const cursor = editor.getCursor("to");
      // コールアウト形式にして挿入
      const lines = output
        .split("\n")
        .map((line) => `> ${line}`)
        .join("\n");
      const insertText = `\n\n> [!info] Geminiの回答\n${lines}\n\n`;

      editor.replaceRange(insertText, cursor);
      new Notice("完了しました！");
    }
  } catch (err) {
    console.error(err);
    new Notice("APIリクエストでエラーが発生しました");
  }
};

注意点：jsファイルがQuickAddから見えないときは？

Obsidianの標準設定だと、.js ファイルなどの馴染みのない拡張子をファイルブラウザに表示してくれないことがあります。 その場合は、設定の「ファイルとリンク」から 「すべてのファイル拡張子を認識」 をONにしてください。

これを見落とすと、QuickAddの設定画面で「あれ、スクリプトが選択肢に現れないぞ？」と迷うことになります（私はここで10分ハマりました笑）。

コードに焦点を当てるイメージ

なぜAIエディターではなく「自作」なのか

今の時代、ObsidianをAI化する高機能なプラグインは他にもたくさんあります。それでも今回「自作」にこだわったのは、 「自分のクォータ（制限）を自由にコントロールしたい」 からです。

有償ツールのサブスクリプションは便利ですが、モデルが固定されていたり、回数制限があったりすることも多い。GoogleのGemini APIなら、個人利用の範囲内であれば無料枠でも驚くほど高速で、しっかり働いてくれます。

部分的に「節約」しつつ、必要なときに最高レスポンスのAIを呼び出す。これこそが、エンジニア的なライフハックの醍醐味だと思うんですよね。

まとめ：Obsidianが「考える場所」に進化する

このスクリプトを使い始めてから、Obsidianが単なるメモ帳から、AIと対話しながら思考を深める「ラボ」に進化した感覚があります。

やってみて分かったのですが、これは自分だけの 「軽量版MCP（Model Context Protocol）」 を作っているようなものです。ローカルの知識（ノート）をAIに渡して、その場で加工してもらう。この滑らかな感覚は、一度体験すると戻れません。

「もっと簡単にできるツール」は確かにあるかもしれません。 でも、自分の手で繋ぎ合わせたツールには、愛着と、そこから広がる無限の拡張性が詰まっています。

次は、選択したテキストから画像を生成して、そのままVaultに埋め込む仕組みでも作ってみようかな。執筆の相棒が、どんどん頼もしくなっていくのが楽しみです。