質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

Q&A

5回答

7811閲覧

JavaScriptでブラウザ言語を取得したい

raisinchan

総合スコア14

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

0グッド

3クリップ

投稿2019/05/06 23:17

編集2022/01/12 10:55

###実現したいこと
この条件分岐の形式で、JavaScriptでブラウザ言語を取得したいです。
(jQueyrでも構いません。)

js

1if( language == 'ja' ){ 2 alert('日本語'); 3}else if( language == 'en' ){ 4 alert('English') 5}

下記のソースコードが悪いのか、それとも添付画像の設定が悪いのでしょうか。
###ソースコード1
こちらを書いてみましたが、「日本語」と出てしまします。

js

1var language = (window.navigator.languages && window.navigator.languages[0]) || 2 window.navigator.language || 3 window.navigator.userLanguage || 4 window.navigator.browserLanguage;

###ソースコード2
次にこちらで試したみたのですがやはり「日本語」です。

js

1var language = function() { 2 var ua = window.navigator.userAgent.toLowerCase(); 3 try { 4 // chrome 5 if( ua.indexOf( 'chrome' ) != -1 ){ 6 return ( navigator.languages[0] || navigator.browserLanguage || navigator.language || navigator.userLanguage).substr(0,2); 7 } 8 // それ以外 9 else{ 10 return ( navigator.browserLanguage || navigator.language || navigator.userLanguage).substr(0,2); 11 } 12 } 13 catch( e ) { 14 return undefined; 15 } 16}

###設定画面
自分のブラウザ設定画面はこのように「English」になっているのですが、この設定がおかしいのでしょうか?
それともやはり上のソースコードがおかしいでしょうか?

イメージ説明

###追記
下図のようにPC言語設定も変えたのですが、相変わらず「ja」でした。

イメージ説明

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

otn

2019/05/07 01:02

設定は間違って無さそうなので、language に代入した直後に、その値を表示してみては?
miyabi_takatsuk

2019/05/07 01:09

ブラウザ自体もそうなのですが、 PCの言語設定も変えてみて、試されるといいかもしれません。 Qiitaの記事にて、 >navigator.languagesはAccept-Language HTTPヘッダと同じ値を返す とありますので、この場合は、サーバー側でPCの元の設定から取得するような仕組みに思います。 また、 >Chromeの場合、「言語と入力の設定」から言語の優先順位を変えてもnavigator.languageは変わりません。 とあるので、ブラウザの言語設定だけでは、質問者さんの意向に沿わない結果になる可能性があるでしょう。
raisinchan

2019/05/07 01:20 編集

otnさん firefoxでふつうにこれだけでも「ja」です。 var language = window.navigator.language; alert(language); miyabi_takatsukさん やってみます。ありがとうございます。
m.ts10806

2019/05/07 01:17

miyabi_takatsukさんの懸念事項が当たってそうに思います。navigator自体がネットワーク接続の有無(online)のチェックに使われたりもするのでブラウザの言語設定いじるくらいでは確認できなさそうに思います。
coco_bauer

2019/05/07 01:23

window.navigator.languages で返される値は言語のリストです(例えば、["en-US", "zh-CN", "ja-JP"])。 それを論理積(&&)や論理和(||)で演算しようとしているのは間違いです(&&や||で演算されるのは論理値(TRUE,FALSE)であるべきです)。 &&や||で演算すると、とりあえずFALSE(0)でなければTRUEと判断して演算をしますから、エラーは出ないですが、意味のある値にはなりません。
raisinchan

2019/05/07 01:31

みなさんお世話になってます。ブラウザとPCの言語設定を両方変えた上で、firefoxで下記をやっても「ja」でした。果たして正解は… var language = window.navigator.language; alert(language);
guest

回答5

0

Firefoxwindow.navigator.language(s)jaが取得できない原因

分かりました!! 恐らくこれでOKな気が。。違いましたらごめなさい(。•ㅅ•。)????

設定画面
『言語設定(O)...』をクリック
言語設定

ちなみに、『代替言語を設定(L)...』も関係あるのか、試してみました。先に結果を言うと、無関係でした????
代替言語

file:///..., http://... でファイル取得

ローカルファイルを読み込む方法が、2通りあることに気づき、両方で試してみました。

明示されてなかったと思うのですが(見落としていたらすみません(。•ㅅ•。)????)、「質問者さんの実行環境はローカルだった」いう前提で、以下話を進めています。

file:///... でファイル取得

file.devConsole
file.network

http://... でファイル取得

http.console
http.network


その他わかった事 まとめ

window.navigator.languagesの値は、HTTPヘッダーのAccept-Language域の値

とW3C等の仕様書には記述してありました(小生の、上記にある前回答より)。

ただ、file:///...スキームを使ってファイルを取得・表示する場合場合は、直接ファイルを参照する仕組みらしく、リクエストという処理はありません。

HTTPリクエストが必要ない場合でも、ブラウザ設定の「ウェブページの(優先)言語設定」は利用され、window.navigator.languages の値として取得出来るようですね????

参照仕様書

投稿2019/05/08 16:25

退会済みユーザー

退会済みユーザー

総合スコア0

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

miyabi_takatsuk

2019/05/09 00:57

これビンゴな気がしますね。 ブラウザによって、言語の設定箇所いくつか存在するようですしね。
退会済みユーザー

退会済みユーザー

2019/05/09 03:15

そうであれば良いのですが…(´????๑›ω‹๑)????
think49

2019/05/10 03:50

質問者さんが掲示したスクリーンショットを見る限りでは、これが正解ですね。 "Firefox will display the first language as your default and will display alternate languages if necessary in the order they appear." を日本語訳すれば、AzumaOさんが無関係とされたSSの日本語文と一致します。 https://support.mozilla.org/en-US/kb/use-firefox-another-language
guest

0

回答欄で書いた方がよさそうなので、自信のない案ですが書いておきます。
・Chromeでは期待通り
・Firefoxでは常にja
ということですよね。

Firefoxでアドオンオフでも起こるということで、望み薄ですが、
プロファイルを新規に作成してみて試してみてください。
Multiple Firefox profiles - Mozilla | MDN

投稿2019/05/08 01:20

otn

総合スコア84423

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

0

[間違いが多く含まれる回答になってしまい、大部分を削除しました。質問者様、すみません(。•ㅅ•。)????
以下、質問内容に関連のある、参照した仕様書のリンクはそのまま置いておきます。]

参考文献

window.navigator,language(s)に関する MDN, W3C, IETF の使用書・仕様書のリンク、抜粋。
。参照順。

MDN

window . navigator . language
Returns a language tag representing the user’s preferred language.

window . navigator . languages
Returns an array of language tags representing the user’s preferred languages, with the most preferred language first. The most preferred language is the one returned by navigator.language.

language, of type DOMString, readonly, nullable
Must return a valid BCP 47 language tag representing either a plausible language or the user’s most preferred language. [BCP47]
languages, of type DOMString[], readonly
Must return a read only array of valid BCP 47 language tags representing either one or more plausible languages, or the user’s preferred languages, ordered by preference with the most preferred language first. The same object must be returned until the user agent needs to return different values, or values in a different order. [BCP47]

To determine a plausible language, the user agent should bear in mind the following:

...

To avoid introducing any more fingerprinting vectors, user agents should use the same list for the APIs defined in this function as for the HTTP Accept-Language header.

5.3.5. Accept-Language

The "Accept-Language" header field can be used by user agents to
indicate the set of natural languages that are preferred in the
response. Language tags are defined in Section 3.1.3.1.

The Accept-Language header is information about the user's language preferences that
is passed via HTTP when a document is requested. Mainstream browsers allow these language preferences to be modified by the user.

投稿2019/05/07 15:21

編集2019/05/09 07:33
退会済みユーザー

退会済みユーザー

総合スコア0

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

otn

2019/05/07 15:50

いやそれは、そうなんですが、質問者さんの環境で何故そうならないかが謎なんです。
miyabi_takatsuk

2019/05/07 16:31

otnさん>そこなんですよね・・・。
退会済みユーザー

退会済みユーザー

2019/05/07 17:14

本当に「原理」を理解していましたか、ontさん? ってか誰ですか?? 上記の会話のやり取りでは原理まで言及されておらず、小生の上記回答で、少なくとも「HTMLのlang属性が無関係である」事が分かりました。(miyabiさんのやり取りから私の上記回答が生まれました。貴殿を巻き込みご容赦下さい(。•ㅅ•。)????) 相手の回答に横槍を入れる時間が余っているのなら、 考えられる原因→解決を提示する方が生産的では? - firefoxの消去・再インストールで治るのではないか(chromeは◯の様なので) - レジストリ関連を触ってはいないか - firefoxは最新か 等、何か解決に繋がりそうな案は無かったのでしょうか。。いや、てゆーか、一つくらい提案せんかいごるぁぁあああ!!!(急にキレてすみませんw) 余計なコメントをする時間があるとは余程優秀なのでしょう。otnさんの解決策(ベストアンサー)期待しております。<(_ _)> かしこ
退会済みユーザー

退会済みユーザー

2019/05/07 17:16

raisinchanさんとmiyabiさん、迷惑かけてすみません_o⊇ ????
otn

2019/05/08 00:16 編集

> ってか誰ですか?? 質問に対するコメントでやりとりしていました。 最初から設定は間違いないことは分かっていたので、最初はスクリプトの質問に書かれていない部分のバグを疑ったのですが、そうでもないようで、遠隔での調査に行き詰まっていたところです。
guest

0

navigator.languages (HTML Standard)

https://momdo.github.io/html/system-state.html#language-preferences
https://html.spec.whatwg.org/multipage/system-state.html#language-preferences

To avoid introducing any more fingerprinting vectors, user agents should use the same list for the APIs defined in this function as for the HTTP Accept-Language header.

意訳「これ以上の"fingerprinting vectors"の導入を避けるために、ユーザーエージェントはHTTPの Accept-Languageヘッダと同じようにこの関数で定義されたAPIのために同じリストを使うべきです。」

ブラウザの言語設定

https://www.w3.org/International/questions/qa-lang-priorities

確認手段

(A) navigator.languages の値を見る

JavaScript

1console.log(navigator.languages)

(B) 開発者ツールの [ネットワーク] タブでリクエストヘッダ Accept-Language を確認する。

Re: raisinchan さん

投稿2019/05/07 03:59

think49

総合スコア18156

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

think49

2019/05/08 03:46

個人的にはあれこれ試すよりも、しっかりと状況把握するのが先決だと思います。 質問者さんはずっと、navigator.language値のみを見ており、navigator.languagesは確認していません。 navigator.languagesに ja があるなら、優先順位設定の問題と想定出来ます。 Accept-Languageヘッダにjaがないなら、言語設定そのものが出来ていないのでしょう。 ヘッダはPHPで確認しているそうですが、ここまで改善しないなら確実な方法を私ならとります。 ヘッダが期待通りでないなら、Proxy設定とか、あたりをつけるポイントが変わってくると思います。
guest

0

結論が出たので、回答させていただきます。
javascriptにて、言語を取得するには(特定)二つ条件が必要になります。
一つは、質問者さんが実践した、
ブラウザにての、言語設定。
もう一つは、HTML自体の言語設定になります。

html

1<html lang="en"> 2</html>

といったものです。
この条件では、en-USを取得できたので、間違い無いかと。
そのまま自然に、lang属性を設定しないと、
もちろん日本で購入されたマシンでは、デフォルトは、jaに設定されてしまいます。
また、マシン自体の言語設定を英語にしても、jaデフォルトになりました。
(Macbook Pro、最新OSにて確認)
なので、
ブラウザの設定+HTMLの言語設定をされると、
質問者さんのご意向に沿った結果を得られるでしょう。

投稿2019/05/07 01:35

miyabi_takatsuk

総合スコア9528

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

raisinchan

2019/05/07 02:14 編集

ありがとうございます。 ➀ブラウザ設定 ➁PC設定 ➂<html lang="en">になったことを出力後のHTMLで確認 ↓ var language = window.navigator.language; alert(language); ↓ やはり「ja」でした。…手ごわいw 確認した環境はこちらです。macだとうまくいくんですね。 ・firefox ・win10
raisinchan

2019/05/07 02:00

ちなみに上の➀➁の状態でPHPでこうしても <html lang="<?= substr($_SERVER['HTTP_ACCEPT_LANGUAGE'], 0, 2); ?>"> HTMLの出力はこうでした。 <html lang="ja"> つまりどうやらPHPでも取得できてないみたいです。
miyabi_takatsuk

2019/05/07 02:00

く、windowsだとダメでしたか。 もう少しこちらでも検証してまいります。
raisinchan

2019/05/07 02:02

お手数おかけします。自分でも検索してわかったらご報告させて頂きます。 それにしてもよくある操作だろうと思ったのですが、ネットに的確な情報がないのも不思議ですよね。
raisinchan

2019/05/07 02:22

「winとchrome」だと仰る方法でできていました。 「winとfirefox」のときだけできないみたいですね。 5月4日以降、firefoxで言語系のバグがあるみたいですから、それが原因でしょうか。
miyabi_takatsuk

2019/05/07 02:28

最近は、Googleの検索の精度が微妙なのも影響しているかと思います。 (音声検索機能の充実のために試験しているのかと思われます) さて、当方の環境で、細かく調査いたしましたが、下記のような結果が得られました。 いずれも、Windows 10にて、window.navigator.languageの取得結果です。 FireFox 66.0.4:ブラウザの言語優先を変えるだけで、言語変化取得 Google Chrome:ブラウザの言語優先、HTMLのlang属性、両方設定で言語変化 ふむ、FireFox、一応、当方の環境でも最新バージョンのはずですが、 バグがあるのであれば、その可能性はありますね・・・。 入れているアドオンとかも影響あるかもしれません。
raisinchan

2019/05/07 02:44

firefoxいけちゃいましたか??バージョンも一緒で、再インストールして、アドオンを切ってもダメでしたので、うーん、ですね。こちらの環境のことでご迷惑おかけしてしまい申し訳ございません。 ひとまず言語での条件分岐がテストしたかったので、chromeでやっていきます。 また何かわかりましたらご返信いたします。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだベストアンサーが選ばれていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問