* [Blog](https://www2.paloaltonetworks.com/blog) * [Palo Alto Networks](https://www2.paloaltonetworks.com/blog/corporate/) * [Secure the Enterprise](https://www2.paloaltonetworks.com/blog/category/secure-the-enterprise-2/?lang=ja) * PAN-OSの応答ページを多言語対応化する方法... # PAN-OSの応答ページを多言語対応化する方法 [](https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fwww2.paloaltonetworks.com%2Fblog%2F2022%2F12%2Fhow-to-use-multilingual-urlf-blocking-page%2F%3Flang%3Dja) [](https://twitter.com/share?text=PAN-OS%E3%81%AE%E5%BF%9C%E7%AD%94%E3%83%9A%E3%83%BC%E3%82%B8%E3%82%92%E5%A4%9A%E8%A8%80%E8%AA%9E%E5%AF%BE%E5%BF%9C%E5%8C%96%E3%81%99%E3%82%8B%E6%96%B9%E6%B3%95&url=https%3A%2F%2Fwww2.paloaltonetworks.com%2Fblog%2F2022%2F12%2Fhow-to-use-multilingual-urlf-blocking-page%2F%3Flang%3Dja) [](https://www.linkedin.com/shareArticle?mini=true&url=https%3A%2F%2Fwww2.paloaltonetworks.com%2Fblog%2F2022%2F12%2Fhow-to-use-multilingual-urlf-blocking-page%2F%3Flang%3Dja&title=PAN-OS%E3%81%AE%E5%BF%9C%E7%AD%94%E3%83%9A%E3%83%BC%E3%82%B8%E3%82%92%E5%A4%9A%E8%A8%80%E8%AA%9E%E5%AF%BE%E5%BF%9C%E5%8C%96%E3%81%99%E3%82%8B%E6%96%B9%E6%B3%95&summary=&source=) [](https://www.paloaltonetworks.com//www.reddit.com/submit?url=https://www2.paloaltonetworks.com/blog/2022/12/how-to-use-multilingual-urlf-blocking-page/?lang=ja&ts=markdown) [](mailto:?subject=PAN-OSの応答ページを多言語対応化する方法) Link copied By [Tadayoshi Suzuki](https://www.paloaltonetworks.com/blog/author/tasuzuki/?lang=ja&ts=markdown "Posts by Tadayoshi Suzuki") Dec 14, 2022 2 minutes [Secure the Enterprise](https://www.paloaltonetworks.com/blog/category/secure-the-enterprise-2/?lang=ja&ts=markdown) [HTML](https://www.paloaltonetworks.com/blog/tag/html/?lang=ja&ts=markdown) [JavaScript](https://www.paloaltonetworks.com/blog/tag/javascript-ja/?lang=ja&ts=markdown) [Language](https://www.paloaltonetworks.com/blog/tag/language/?lang=ja&ts=markdown) [Multilingal](https://www.paloaltonetworks.com/blog/tag/multilingal/?lang=ja&ts=markdown) [SE monthly series](https://www.paloaltonetworks.com/blog/tag/se-monthly-series/?lang=ja&ts=markdown) ## はじめに 働き方の多様化が進み、とくにグローバル企業では、英語や日本語以外の言語を使用される方が混在している環境も増えてきました。そうした環境では、ネットワーク機器からのエラーページがそれぞれの国の言葉になっていれば、情報システム部の運用負荷を減らせる可能性が高いでしょう。 しかしながら、たとえばPAN-OSやPrisma AccessのURLフィルタリング機能で提供されるブロックページはデフォルトでは英語のみです。PAN-OSでURLフィルタリングなどによるブロック画面を実際に複数言語に対応しようとしても、設定でアップロード可能なHTMLファイルは1つに制限されていますから、それぞれの言語のHTMLファイルを作成して用意するわけにはいきません。「多言語に対応した単一のHTMLファイル」を用意する必要があります。 [![URLフィルタリング機能が生成したブロックページ。メッセージが日本語で表示されている。画面左上には言語切替のためのドロップダウンボックスが表示され、ユーザーのIPアドレスや、URI、カテゴリなども表示されている。](https://www.paloaltonetworks.com/blog/wp-content/uploads/2022/11/url.png)](https://www.paloaltonetworks.com/blog/wp-content/uploads/2022/11/url.png) 図1. URLフィルタリング機能が生成したブロックページ そこで本稿では、サンプルとして上図のようにURLフィルタリングのブロック画面をカスタマイズし、JavaScriptでブラウザの言語設定を取得して自動的にその言語でのメッセージを表示する方法を紹介します。この方法は後述するさまざまな応答ページに応用できますのでぜひ参考にしてください。 ## URLフィルタリングのブロックページをJavascriptで多言語化する まず、JavaScriptで言語設定を取得します。 JavaScript var currentLanguage = window.navigator.language.split('-')\[0\]; |---|------------------------------------------------------------------| | 1 | var currentLanguage = window.navigator.language.split('-')\[0\]; | ここでは、変数 currentLanguage に現在の言語設定を取得しています。ブラウザによっては「ja-JP」のようにハイフンが含まれている場合もあるので、ハイフンで split して最初の要素を取得します。 次に、言語ごとの文言を用意します。今回はこのサンプルのために機械翻訳で訳したものを使っていますが、実務で使う場合は内容が正しいか確認してください。 JavaScript var texts = { ja: { title: '禁止されました', description: 'あなたのアクセスしようとしたWebページはポリシーによりアクセスが禁止されました。', }, en: { title: 'Forbidden', description: 'The web page you attempted to access has been denied access by policy.', }, zh: { title: '禁忌', description: '你试图访问的网页已被政策禁止。', }, de: { title: 'Verboten', description: 'Die Webseite, auf die Sie zuzugreifen versucht haben, wurde durch eine Richtlinie gesperrt.', }, fr: { title: 'Interdite', description: 'La page web à laquelle vous avez essayé d'+"'"+'accéder a été interdite par la politique.', }, es: { title: 'Prohibido', description: 'La página web a la que ha intentado acceder ha sido bloqueada por política.', }, }; |----------------------------------------------------------------------|-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------| | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 | var texts = { ja: { title: '禁止されました', description: 'あなたのアクセスしようとしたWebページはポリシーによりアクセスが禁止されました。', }, en: { title: 'Forbidden', description: 'The web page you attempted to access has been denied access by policy.', }, zh: { title: '禁忌', description: '你试图访问的网页已被政策禁止。', }, de: { title: 'Verboten', description: 'Die Webseite, auf die Sie zuzugreifen versucht haben, wurde durch eine Richtlinie gesperrt.', }, fr: { title: 'Interdite', description: 'La page web à laquelle vous avez essayé d'+"'"+'accéder a été interdite par la politique.', }, es: { title: 'Prohibido', description: 'La página web a la que ha intentado acceder ha sido bloqueada por política.', }, }; | フランス語のようにシングルクオートを含むことがある言語は、赤字の部分のようにきちんとエスケープしましょう。 言語設定された部分はHTMLの下記のパートの変数 ${title} と ${description} に置き換えられるようになります。 JavaScript \${title}\ \ |-----|------------------------------------------------------------------------------------| | 1 2 | \${title}\ \ | 意図しない言語で表示されたときにプルダウンメニューで言語を選択できるようにするため、HTMLの select タグを使用して \ \