Firefox 3のUser Agentを変更して非互換アドオンをインストールする

杉山貴章（オングス）
2008/07/14 16:02

ウェブ開発者必携のアドオン「User Agent Switcher」は、ブラウザごとに表示するウェブページの確認に便利だが、非互換アドオンのインストールにも使えたりするのだ。

　2回続けてアドオン管理のための機能を持ったアドオンを紹介したので、それに関連してFirefox 3でアドオンをインストールするのに便利なものをもうひとつ紹介しておこう。

User Agent Switcher

　Firefox 3のリリースと並行して、Firefox Add-onsがリニューアルされた。

　使用しているFirefoxのバージョンにアドオンが対応していない場合には［Firefoxへインストール］ボタンをクリックできないようになった。これは誤って非互換のアドオンをインストールできないようにするための措置だが、非互換と知りつつあえてインストールしているユーザにとってはかえって不便になってしまった。

　そこで便利なのがUser Agent Switcherだ。

　このアドオンはブラウザのUser-Agentの値を手軽に変更できるようにするためのものである。本来は特定のウェブブラウザでしか表示できないページを、User-Agentを偽装することで見られるようにするためのものだが、Firefoxのバージョンを偽装すればFirefox Add-onsの互換性チェックも回避することができる。

　まず、アドオンの設定ダイアログにおいて図1のように［User Agents］のページを表示させる。デフォルトではWindows版のIE、Netscape、OperaのUser-Agentが用意されている。FirefoxのUser-Agentの形式は［View Default］ボタンで現在のバージョンのものが見られるので参考にするといいだろう。

図1 User Agent Switcherの設ダイアログ 図1 User Agent Switcherの設ダイアログ

　ここで［Add］ボタンをクリックして、図2のように名乗りたいバージョンのUser-Agent情報を入力する。この例はWindows版のFirefox 2.0.0.14のもの。

図2 User-Agent情報を追加 図2 User-Agent情報を追加

　User Agent SwitcherをインストールするとツールバーにUser-Agentを切り替えるためのアイコンを付けることができるようになる。これをクリックすれば、図3のように利用可能なUser-Agentの一覧が表示され、簡単に切り替えられるようになる。

図3 ツールバーのアイコンからUser-Agentを切り替え 図3 ツールバーのアイコンからUser-Agentを切り替え

　User Agent Switcherは自分でウェブページやウェブアプリケーションを作成する際の表示テストにも活用できる。

　例えばブラウザ毎に表示する内容が変わるようなページを作りたい場合、通常はJavaScriptなどを利用してUser-Agent別の処理を行うようにする。そのため、User Agent Switcherを使えばその判別が正しく行えているかどうかを、Firefoxだけで手軽に調べることができる。

　リスト4はUser-Agentを調べる非常に簡単なJavaScriptの例だ。これをFirefox 3で表示すると図5のようになるが、User-Agentを変更すると表示が変わる。機能そのものはシンプルだが、意外と使いどころの多いアドオンである。

リスト 4 User-Agentを調べるJavaScriptの例

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  <title>User-Agentのテスト</title>
</head>
<script language="JavaScript">

  document.write( "ブラウザ　　　　　" , navigator.appName    ,"</br>");
  document.write( "エージェント　　　" , navigator.userAgent  ,"</br>");
  document.write( "バージョン　　　　" , navigator.appVersion ,"</br>");
  document.write( "コードネーム　　　" , navigator.appCodeName,"</br>");
  document.write( "プラットフォーム　" , navigator.platform   ,"</br>");

  function uatest() {
    var ua = navigator.userAgent;
    var message;

    if(ua.indexOf('Firefox/3') != -1) {
      message = "このブラウザはFirefox 3です";
    }
    else if(ua.indexOf('Firefox/') != -1) {
      message = "このブラウザはFirefoxです"
    }
    else {
      message = "このブラウザはFirefox以外です";
    }

    var base = document.getElementById('base');
    base.innerHTML = "<h1>" + message + "</h1>";
  }
</script>

<body onload="uatest()">

  <div id="base"/>

</body>
</html>
※ブラウザで実際に確認してみる
図5 User-Agentによって表示が変わる 図5 User-Agentによって表示が変わる
記事に関係する情報をコメントでお寄せください

ニックネーム : CNET_IDにログインしてコメントする

コメント本文（必須） :
  • 新着記事
  • 人気記事
  • 特集
  • ブログ
  • 話題のタグ
プログラミング言語 Chrome JavaScript Firefox 3 Linux PHP リファレンス オープンソース Webデザイン Windows XP Tips Java UI WebKit 小技 iPhone 3G Mac OS X モバイル Windows HTML Webサービス Internet Explorer 仮想化 Windows Vista Opera Flash Ajax インストール Google iPhone ソフトウェア開発 セキュリティ Windows 7 Safari RIA Database マイクロソフト アプリケーション Mozilla ブラウザ 開発環境 データベース Apple 脆弱性 CSS Off Topic Microsoft OS Firefox iPod touch
  • 話題のタグを見る »