GASでFloccusのXbelをHtml化する。

GAS(Google Apps Script)でGoogleDriveに拡張Floccusによって自動同期されたBookmarks.xbelをブラウザで表示する。

概要

GoogleDriveに保存されたBookmarks.xbelファイルをブラウザで表示するには、Floccusという拡張機能を使用することができます。Floccusは、ブラウザのブックマークをクラウドストレージに同期するためのツールであり、GoogleDriveもサポートしています。これとGAS(Google Apps Script)を通してブラウザで表示します。

手順

FloccusをインストールしてブックマークをGoogleDriveへ同期保存
GAS(Google Apps Script)でGoogleDriveのBookmarks.xbelを取得してブラウザで表示

Floccus

Floccusは、ブラウザのブックマークをGoogleDriveやNextcloudなどのクラウドストレージに保存して、複数のデバイスで同期できる拡張機能です。Floccusを使用すると、ブラウザのブックマークを自動的にクラウドにバックアップし、他のデバイスと同期できます。

Floccusを使用してGoogleDriveにブックマークを保存するには、以下の手順を実行します。

Floccusをインストールします。Floccusは、Firefox、Chrome、Edgeなどの主要なブラウザで利用できます。
Floccusを開き、GoogleDriveアカウントに接続します。Floccusの設定画面で、GoogleDriveを選択し、認証プロセスを完了します。
同期するブックマークフォルダを選択します。Floccusの設定画面で、同期したいブックマークフォルダを選択します。
同期を開始します。Floccusの設定画面で、「同期」ボタンをクリックして、ブックマークの同期を開始します。

Floccusは、GoogleDriveに保存されたBookmarks.xbelファイルを自動的に更新し、他のデバイスと同期します。これにより、複数のデバイスで同じブックマークを使用できるようになります。

Floccusは、ブックマークの管理と同期を簡単にする便利なツールです。GoogleDriveにブックマークを保存することで、デバイス間でのブックマークの一貫性を保ち、紛失や破損のリスクを軽減できます。

Floccusの詳細な使用方法や設定については、公式ドキュメントを参照してください。

参考リンク:

GAS(Google Apps Script)でGoogleDriveのBookmarks.xbelを取得してブラウザで表示

Google Apps Script (GAS)を使用して、GoogleDriveに保存されたBookmarks.xbelファイルを取得し、HTMLで表示する方法を説明します。

手順

GoogleDrive APIの設定

GoogleDrive APIを使用するために、GoogleDriveの開発者コンソールでアプリを作成し、アクセストークンを取得します。

GASプロジェクトの作成

Google Apps Scriptの新しいプロジェクトを作成します。

GoogleDrive APIを呼び出すコードの作成

以下のコードをGASプロジェクトに追加します。アクセストークンを適切な値に置き換えてください。

code.gs

function doGet() {
  var fileId = "*****************"; // GoogleDriveのBookmarks.xbelファイルのIDを指定
  
  try {
    var file = DriveApp.getFileById(fileId);
    var xmlContent = file.getBlob().getDataAsString();
    
    // XMLを解析してHTMLを生成
    var htmlContent = parseXbelToHtml(xmlContent);
    
    var output = HtmlService.createHtmlOutput(htmlContent)
      .setTitle("Floccus Bookmarks")
      .setXFrameOptionsMode(HtmlService.XFrameOptionsMode.ALLOWALL);
      
    return output;
    
  } catch (e) {
    return HtmlService.createHtmlOutput('エラーが発生しました: ' + escapeHtml(e.message));
  }
}

// xbelファイルを解析し、HTML文字列を生成する関数
function parseXbelToHtml(xmlString) {
  var document = XmlService.parse(xmlString);
  var root = document.getRootElement();
  
  var html = ""
    + ""
    + ""
    + ""
    + "Floccus Bookmarks"
    + ""
    + ""
    + ""
    + ""
    + "Bookmarks"
    + "";
  
  html += processChildren(root);
  
  html += ""
    + ""
    + ""
    + "";
  
  return html;
}

// フォルダとブックマークを再帰的に処理
function processChildren(element) {
  var html = "";
  var children = element.getChildren();
  
  for (var i = 0; i < children.length; i++) {
    var child = children[i];
    var tagName = child.getName();
    
    if (tagName === "folder") {
      var titleElement = child.getChild("title");
      var title = titleElement ? escapeHtml(titleElement.getText()) : "無題のフォルダ";
      
      html += "📁 " + title + "";
      html += processChildren(child);
      html += "";
    } else if (tagName === "bookmark") {
      var titleElement = child.getChild("title");
      var title = titleElement ? escapeHtml(titleElement.getText()) : "無題のブックマーク";
      var url = child.getAttribute("href").getValue();
      
      var icon = url.startsWith("javascript:") ? "✨" : "🔗";
      
      html += "" + icon + " " + title + "";
    }
  }
  
  return html;
}

// HTMLエスケープ関数
function escapeHtml(text) {
  return text
    .replace(/&/g, "&")
    .replace(//g, ">")
    .replace(/"/g, """)
    .replace(/'/g, "'");
}

ウェブアプリとしてデプロイ

GASプロジェクトをウェブアプリとしてデプロイします。公開範囲を「全員（匿名ユーザーを含む）」に設定します。

ブラウザで表示

デプロイしたウェブアプリのURLにアクセスすると、GoogleDriveに保存されたBookmarks.xbelファイルの内容がHTML形式で表示されます。

この方法を使用すると、GoogleDriveに保存されたBookmarks.xbelファイルを簡単にブラウザで表示できます。必要に応じて、HTMLのスタイルや構造をカスタマイズして、表示を改善することも可能です。

注意: このコードは基本的な例であり、エラーハンドリングやセキュリティ対策が含まれていません。実際の運用環境では、適切なエラーハンドリングとセキュリティ対策を実装することをお勧めします。

参考リンク:

このブログを検索

なんとなく備忘録