マウスを使わず、キーボードのみでブラウザを操作したい。
その需要を満たすツールとして、「Vimium」というChrome拡張機能があります。
カンタンにいえば、新しいタブやブックマークを開くなどの動作をショートカットキーで実行できるツールです。
たとえば、パソコン内でコピーを実行する場合、マウスを使わずとも「ctrl(又はcommand) + C」のショートカットキーでコピーできます。
「Vimium」を導入すれば、このショートカットキーでできる操作の種類が増えるため、作業効率化を図れます。
「Vimium」では、デフォルトで「b」のショートカットキーでブックマークを開くことができます。
そんな便利な「Vimium」ですが、ブックマークレットが動作しないエラーが発生する場合があります。
ブックマークをクリックするとJavaScriptのプログラムが動作するシステム(ブックマークレット)を活用している方の中には、「Vimium」でブックマークレットを使用してエラーが発生する方もいると思います。
この記事では、なぜ「Vimium」でブックマークレットを使用するとエラーが発生するのか、原因と対処法について解説します。
この記事のポイントは以下のとおりです。
- 「Vimium」でブックマークレットのエラーが発生する具体例の紹介
- 「Vimium」でブックマークレットのエラーが発生する原因の解説
- 「Vimium」のブックマークレットのエラーの対処法の解説
結論からいうと、ブックマークレットのJavaScriptコード内で「?」や「%」を使用していると、エラーが発生します。
「Vimium」のブックマークレットエラーについて、この記事では具体例も含めて解説していきます。
「Vimium」でブックマークレットのエラーが発生する具体例
まず、実際に「Vimium」でブックマークレットを使用したときに発生するエラーの具体例を紹介します。
ブックマークレットの作成方法は以下の3ステップでカンタンです。
- 適当なWebサイトをブックマークに登録する
- 登録したブックマークの編集画面を開く
- 編集画面のURLをJavaScriptのコードに変更して保存する
上記の3ステップ完了後、保存したブックマークをクリックするとプログラムが実行されます。
試しに、この記事をブックマークしてみましょう。
ブラウザがChromeの場合、以下の画像の「☆」をクリックして「ブックマークを追加」を選択すると、ブックマークできます。
ブックマーク完了後、ブックマークしたこの記事(以下の画像ではtestブックマークレット)を右クリックして、「編集」を選択します。
以下の編集画面が開くので、「名前」は好きな名前に変更してください。
「URL」に実行したいJavaScriptのコードを記載しましょう。
たとえば、URLに以下のコードを貼り付けると、現在開いているWebサイトのURLをアラート表示できます。
javascript:(function()%7Blet h%3Dlocation.href;alert(h);%7D)();
JavaScriptのコード貼り付け時の注意点として、改行や余計なスペースは入れないようにしましょう。
URLにJavaScriptのコード記載後、編集内容を保存します。
あとは、変更したブックマークをクリックすると、記載したJavaScriptのプログラムを実行してくれます。
実際に、上記のコードを貼り付けて、マウス操作でブックマークをクリックした際、アラート表示がされることを確認してみましょう。
ブックマークレットが正しく動作することを確認したら、次に「Vimium」のショートカットキーでブックマークレットが動作するか確認してみましょう。
「Vimium」導入後、ブラウザ上で「b」を押すと、ブックマーク検索バーが開きます。
動作させたいブックマークレットの名前を入力して、「Enter」を押すとブックマークレットが実行されます。
しかし、この記事の上記のコードを使用していた場合、エラーが発生してアラート表示されないことがわかります。
この「Vimium」でブックマークレットが動作しない原因と対処法について、次から解説していきます。
「Vimium」でブックマークレットのエラーが発生する原因
「Vimium」でブックマークレットが動作しないエラーが発生した場合、ブラウザのデベロッパーツールを開いてみましょう。
Chromeの場合、「F12」のショートカットキーで開けます。
この記事の上記JavaScriptコードを使用した場合、デベロッパーツールのConsole内で次のようなエラーが表示されているはずです。
Uncaught SyntaxError: Unexpected token ‘%’
カンタンにいうと、JavaScriptコード内の「%」が原因でエラーが発生しているという通知です。
「Vimium」では、ブックマークレットのコード内に「?」や「%」を使用した場合、上記のようなエラーが出ます。
これは「Vimium」の使用上の問題かと思われます。
「Vimium」のブックマークレットエラーの対処法
「Vimium」のブックマークエラーの対処法としては、コード内で「?」や「%」を使わないことです。
たとえば、この記事で紹介した上記のJavaScriptコードは、以下のコードに置き換えることができます。
javascript:(function(){let h=location.href;alert(h);})();
おそらく、「Vimium」でブックマークレットのエラーが発生する状況として、エンコードなどの関係で{ }や=などの記号を「%」を用いて表記している場合が多いと思います。
そのため、「Vimium」で使用できる記号に置き換えてコードを記載しましょう。
コメント