ChromeでMHTML形式でページを保存するブックマークレットの作り方

Webページを保存する際、HTMLファイルだけでなく、すべてのリソースを含んだMHTML形式で保存したい場合があります。特に、Webページをそのまま保存したい場合にはMHTML形式が便利です。このガイドでは、Chromeブラウザで「名前を付けて保存」を使用してMHTML形式で保存するためのブックマークレットの作成方法を紹介します。

1. MHTML形式とは？

MHTML（MIME HTML）は、WebページのHTML、画像、CSS、JavaScriptなどを1つのファイルにまとめて保存する形式です。これにより、ページがそのまま保存され、オフラインでも完全に表示できます。特にアーカイブ用や、特定のページをそのまま保存したい時に便利なフォーマットです。

2. 既存のブックマークレットの問題点

質問者が示しているブックマークレットは、ページを「HTMLのみ」で保存するものです。実際に「MHTML形式」で保存するためには、少し修正が必要です。現在のコードでは、HTMLファイルが保存されているだけで、画像やスタイルシートなどが含まれていません。

3. MHTML形式で保存するための修正方法

ChromeでMHTML形式でページを保存するには、まず「MHTML」形式で保存するためのAPIを使用する必要があります。以下のコードは、MHTML形式でページを保存するための簡単なブックマークレットです。

javascript:(function(){ var anchor = document.createElement('a'); anchor.download = location.hostname + '.mhtml'; anchor.href = 'javascript:document.location.href'; anchor.style.display = 'none'; document.body.appendChild(anchor); anchor.click(); document.body.removeChild(anchor); })();

4. このコードの仕組み

このコードは、現在開いているWebページをMHTML形式で保存します。まず、``タグを作成し、その`href`に現在のURLを設定します。そして、ダウンロード属性を設定してファイル名を指定し、ページに非表示で追加します。最後に、`click()`メソッドを使ってファイルのダウンロードを開始します。