キャプチャーブラウザー(その後)

キャプチャーブラウザー(その後)

IEコンポーネントを使ったキャプチャーブラウザーの開発ですが、 ブラウザーの挙動もなんとかなって、現在ほぼ完成しています。 公開の目途が建ちました。

ただ開発していて気になった点としては、 画面表示は許しても、印刷は禁止しているWEBのページ(やアプリケーション)は よくあるケースだと思います。

キャプチャーブラウザーでも画面のイメージを画像に保存することは 初期の段階で実現していましたが、テキスト情報も保ったままPDFにしたい場合は PDF印刷をする事になります。この際に印刷用のスタイルシートで 印刷させないような作りになっているとそのままでは希望のPDFが作成できません。

方法として考えたのが、

  1. 印刷はJavaScriptで行う。
  2. JavaScriptのイベントで印刷直前に都合のよい印刷用スタイルシートに再設定する。

という方法です。

  • JavaScriptを注入する方法はすでに行っていたので少しの修正で可能でした。
  • 印刷前のイベントはIEであればwindow.onbeforeprintで可能です。
  • 一番苦労したのは印刷用スタイルシート(display: none;で無くす)を動的に再設定する方法です。

結果的には

var element = document.createElement('style');
element.setAttribute('type', 'text/css');
element.setAttribute('media', 'print');

でできました。

setAttribute('media', 'print');とするのが重要でした。 新たに作成したスタイルを対象のセレクター(クラス名やID)のスタイルとしてhtmlの後方(後ろの方が優先されるため)に追加すれば 希望の通りのスタイルで印刷できました。

こちらの機能は残念ならがセレクターの指定がWEBページに依存する為に汎用的な機能としては キャプチャーブラウザーに組み込んでいません(セレクターを画面から指定する様にすれば可能ですが)。