diff options
Diffstat (limited to 'files/ja/orphaned/web/api/navigatoronline')
3 files changed, 223 insertions, 0 deletions
diff --git a/files/ja/orphaned/web/api/navigatoronline/index.html b/files/ja/orphaned/web/api/navigatoronline/index.html new file mode 100644 index 0000000000..35fed754da --- /dev/null +++ b/files/ja/orphaned/web/api/navigatoronline/index.html @@ -0,0 +1,60 @@ +--- +title: NavigatorOnLine +slug: orphaned/Web/API/NavigatorOnLine +tags: + - API +translation_of: Web/API/NavigatorOnLine +original_slug: Web/API/NavigatorOnLine +--- +<p>{{APIRef("HTML DOM")}}</p> + +<p>The <code><strong>NavigatorOnLine</strong></code> interface contains methods and properties related to the connectivity status of the browser.</p> + +<p>There is no object of type <code>NavigatorOnLine</code>, but other interfaces, like {{domxref("Navigator")}} or {{domxref("WorkerNavigator")}}, implement it.</p> + +<h2 id="Properties">Properties</h2> + +<p><em>The <code>NavigatorOnLine</code></em><em> interface doesn't inherit any property.</em></p> + +<dl> + <dt>{{domxref("NavigatorOnLine.onLine")}} {{readonlyInline}}</dt> + <dd>Returns a {{domxref("Boolean")}} indicating whether the browser is working online.</dd> +</dl> + +<h2 id="Methods">Methods</h2> + +<p><em>The </em><em><code>NavigatorOnLine</code></em><em> interface neither implements, nor inherit any method.</em></p> + +<h2 id="Specifications">Specifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('HTML WHATWG', '#navigatoronline', 'NavigatorOnLine')}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td>No change from the latest snapshot, {{SpecName('HTML5 W3C')}}</td> + </tr> + <tr> + <td>{{SpecName('HTML5 W3C', '#navigatoronline', 'NavigatorOnLine')}}</td> + <td>{{Spec2('HTML5 W3C')}}</td> + <td>Snapshot of {{SpecName('HTML WHATWG')}} with its initial specification.</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility">Browser compatibility</h2> + +<p>{{Compat("api.NavigatorOnLine")}}</p> + +<h2 id="See_also">See also</h2> + +<ul> + <li>The {{domxref("Navigator")}} interface that implements it.</li> +</ul> diff --git a/files/ja/orphaned/web/api/navigatoronline/online/index.html b/files/ja/orphaned/web/api/navigatoronline/online/index.html new file mode 100644 index 0000000000..162165986b --- /dev/null +++ b/files/ja/orphaned/web/api/navigatoronline/online/index.html @@ -0,0 +1,89 @@ +--- +title: window.navigator.onLine +slug: orphaned/Web/API/NavigatorOnLine/onLine +tags: + - API + - DOM Reference + - NavigatorOnLine + - Online + - Property + - Reference +translation_of: Web/API/NavigatorOnLine/onLine +original_slug: Web/API/NavigatorOnLine/onLine +--- +<div>{{ApiRef("HTML DOM")}}</div> + +<p>ブラウザの接続状態を返します。このプロパティは真偽値を返して <code>true</code> はオンライン、<code>false</code> はオフラインを表します。ブラウザのネットワーク接続状態が変化するたびに、プロパティを更新します。この更新はユーザがリンクをたどる、あるいはスクリプトがリモートページを要求するときに発生します。例えばインターネットへの接続が失われた後にユーザがリンクをクリックすると、このプロパティは <code>false</code> を返します。</p> + +<p>このプロパティの実装は、ブラウザにより異なります。</p> + +<p>Chrome および Safari は、ブラウザがローカルエリアネットワーク (LAN) またはルータに接続できないときにオフライン、それ以外の状況では <code>true</code> を返します。従って、<code>false</code> 値が返る場合はブラウザがオフラインであると考えることができますが、<code>true</code> 値は必ずインターネットにアクセスできると考えることはできません。仮想イーサネットアダプタを持つ仮想化ソフトウェアを実行しているコンピュータでは常に "接続中" になるなど、偽陽性になる可能性があります。よって、実際のブラウザのオンライン状態を検出したい場合は、付加的なチェック方法を開発するべきでしょう。詳しくは HTML5 Rocks の記事 <a href="http://www.html5rocks.com/en/mobile/workingoffthegrid.html"> Working Off the Grid</a> をご覧ください。</p> + +<p>Firefox および Internet Explorer は、ブラウザをオフラインモードに切り替えると <code>false</code> 値を送信します。Firefox 41 まで、他の状態では <code>true</code> 値を返していました。Firefox 41 より OS X および Windows で、実際のネットワーク接続状態に従って値を返します。</p> + +<p><a href="/ja/docs/Web/API/document.ononline"><code>window.ononline</code></a> および <a href="/ja/docs/Web/API/document.onoffline"><code>window.onoffline</code></a> イベントをリッスンすることにより、ネットワーク接続状態の変化を確認できます。</p> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox"><em>online</em> = <em>window</em>.navigator.onLine; +</pre> + +<h3 id="Value" name="Value">値</h3> + +<p><code>online</code> には <code>true</code> か <code>false</code> の真偽値が返されます。</p> + +<h2 id="Example" name="Example">例</h2> + +<p><a href="http://html5-demos.appspot.com/static/navigator.onLine.html">live example</a> をご覧ください。</p> + +<p>オンラインであるかを確認するには、以下のサンプルのように <code>window.navigator.onLine</code> を確認します:</p> + +<pre class="brush: js">if (navigator.onLine) { + console.log('online'); +} else { + console.log('offline'); +}</pre> + +<p>ブラウザが <code>navigator.onLine</code> をサポートしない場合は、上記のサンプルでは常に <code>false</code>/<code>undefined</code> が返ります。</p> + +<p>ネットワーク接続状態の変化を確認するには、以下のように <code>window.online</code> および <code>window.offline</code> をリッスンするため <code><a href="/ja/docs/DOM/element.addEventListener">addEventListener</a></code> を使用します:</p> + +<pre class="brush: js">window.addEventListener("offline", function(e) { console.log("offline"); }); + +window.addEventListener("online", function(e) { console.log("online"); }); +</pre> + +<h2 id="Specifications" name="Specifications">仕様</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">仕様書</th> + <th scope="col">策定状況</th> + <th scope="col">コメント</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName("HTML WHATWG", "browsers.html#navigator.online", "navigator.onLine")}}</td> + <td>{{Spec2("HTML WHATWG")}}</td> + <td>最初期の定義</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザ実装状況</h2> + +<div>{{Compat("api.NavigatorOnLine.onLine")}}</div> + +<h2 id="Notes" name="Notes">注記</h2> + +<p>Firefox 3 で導入された新しいオフライン関連イベントと、このプロパティの詳しい説明は、<a href="/ja/docs/Online_and_offline_events">Online/Offline Events</a> を参照してください。</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li><a href="http://www.html5rocks.com/en/mobile/workingoffthegrid.html">HTML5 Rocks: Working Off the Grid With HTML5 Offline</a></li> + <li><a href="http://www.html5rocks.com/en/tutorials/offline/whats-offline/">HTML5 Rocks: "Offline": What does it mean and why should I care?</a></li> + <li><a href="http://hacks.mozilla.org/2010/01/offline-web-applications/">Mozilla Blog: Offline Web Applications</a></li> +</ul> diff --git a/files/ja/orphaned/web/api/navigatoronline/online_and_offline_events/index.html b/files/ja/orphaned/web/api/navigatoronline/online_and_offline_events/index.html new file mode 100644 index 0000000000..4a136cde1c --- /dev/null +++ b/files/ja/orphaned/web/api/navigatoronline/online_and_offline_events/index.html @@ -0,0 +1,74 @@ +--- +title: Online and offline events +slug: orphaned/Web/API/NavigatorOnLine/Online_and_offline_events +translation_of: Web/API/NavigatorOnLine/Online_and_offline_events +original_slug: Web/API/NavigatorOnLine/Online_and_offline_events +--- +<div>{{outdated()}}</div> +<p><a href="ja/Firefox_3_for_developers">Firefox 3</a> は <a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/">WHATWG Web Applications 1.0 仕様</a>に従い <a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/#offline">Online/Offline イベント</a>を実装します。</p> +<h3 id=".E6.A6.82.E8.A6.B3" name=".E6.A6.82.E8.A6.B3">概観</h3> +<p>オフラインに対応する良い Web アプリケーションを構築するためには、アプリケーションが実際にいつオフラインなのか知る必要があります。ついでに言えば、アプリケーションが 'オンライン' の状態に再び戻ったのがいつかを知る必要もあります。効果的に、その要件は次のように分解されます。</p> +<ol> + <li>ユーザがいつオンラインに戻るか知らなければなりません。そうすることでサーバと再び同期を取ることができます。</li> + <li>ユーザがいつオフラインになるのかを知らなければなりません。そうすることでサーバへの要求を後で用いるようキューに貯めることができます。</li> +</ol> +<p>オンライン／オフラインイベントがこのプロセスを一般化することを手助けします。</p> +<p>あなたの Web アプリケーションは、オフラインリソースのキャッシュで確実に管理されるドキュメントを確立する必要があります。これを行うための方法を <a href="ja/Offline_resources_in_Firefox">Firefox のオフラインリソース</a>の記事で学んでください。</p> +<h3 id="API" name="API">API</h3> +<h4 id="navigator.onLine" name="navigator.onLine"><code>navigator.onLine</code></h4> +<p><code><a href="ja/DOM/window.navigator.onLine">navigator.onLine</a></code> は <code>true</code>/<code>false</code> の値を保持するプロパティで、<code>true</code> はオンラインを、<code>false</code> はオフラインを意味します。このプロパティはユーザが対応するメニューアイテム (ファイル→オフライン作業) を選択することによりオフラインモードに移行する度に更新されます。</p> +<p>加えて、このプロパティはブラウザがネットワークに接続することがそれ以降不可能になった時にもその度に更新される必要があります。次の仕様に従います。</p> +<blockquote cite="http://www.whatwg.org/specs/web-apps/current-work/#offline"> + <code>navigator.onLine</code> 属性はユーザがリンクを押した時やスクリプトが外部のページを要求したときに、ユーザエージェントがネットワークに連絡できない場合（またはそのような試みが失敗した場合）に必ず false を返す必要があります。</blockquote> +<p>Firefox 2 はこのプロパティをブラウザのオフラインモードが切り替わる度に更新していました。また Windows と Linux においてネットワークへの接続が失われたとき、復活したときにも更新していました。</p> +<p>このプロパティは Firefox と Internet Explorer の古いバージョンにも存在しました。(仕様はこれらの先の実装を基にしました。) 従って今すぐこのプロパティを使い始めることができます。ネットワーク状態の自動判断は Firefox 2 にて実装されました。</p> +<h4 id=".22online.22_.E3.81.8A.E3.82.88.E3.81.B3_.22offline.22_.E3.82.A4.E3.83.99.E3.83.B3.E3.83.88" name=".22online.22_.E3.81.8A.E3.82.88.E3.81.B3_.22offline.22_.E3.82.A4.E3.83.99.E3.83.B3.E3.83.88">"<code>online</code>" および "<code>offline</code>" イベント</h4> +<p><a href="ja/Firefox_3">Firefox 3</a>の 2 つの新しいイベントを紹介します。"<code>online</code>" と "<code>offline</code>" です。これらの 2 つのイベントは各ページの <code><body></code> にてブラウザがオンラインとオフラインのモードを切り替えるたびに発生します。加えてこのイベントは <code>document.body</code> から <code>document</code> へと浮上し、<code>window</code> までたどり着きます。これらのイベントはキャンセルできません (ユーザのオンラインモードやオフラインモードへの移行を防ぐことはできません)。</p> +<p>これらのイベントに対するリスナを登録することもいくつかの馴染みのある方法にて可能です。</p> +<ul> + <li><code>window</code>, <code>document</code>, <code>document.body</code> 上にて <code><a href="ja/DOM/element.addEventListener">addEventListener</a></code> を利用します。</li> + <li><code>document</code> または <code>document.body</code> の <code>.ononline</code> または <code>.onoffline</code> プロパティを JavaScript の <code>Function</code> オブジェクトに設定します。(<b>注意：</b><code>window.ononline</code> または <code>window.onoffline</code> を利用することは互換性が原因で動作しません)</li> + <li>HTML マークアップにて <code><body></code> タグの <code>ononline="..."</code> または <code>onoffline="..."</code> 属性を指定します。</li> +</ul> +<h3 id=".E5.AE.9F.E8.A1.8C.E4.BE.8B" name=".E5.AE.9F.E8.A1.8C.E4.BE.8B">実行例</h3> +<p><a class="link-https" href="https://bugzilla.mozilla.org/attachment.cgi?id=220609">簡単なテストケース</a>を実行してこれらのイベントの動作を確認することができます。 <span class="comment">XXX When mochitests for this are created, point to those instead and update this example -nickolay</span></p> +<pre class="eval"> <!doctype html> + <html> + <head> + <script> + function updateOnlineStatus(msg) { + var status = document.getElementById("status"); + var condition = navigator.onLine ? "ONLINE" : "OFFLINE"; + status.setAttribute("class", condition); + var state = document.getElementById("state"); + state.innerHTML = condition; + var log = document.getElementById("log"); + log.appendChild(document.createTextNode("Event: " + msg + "; status=" + condition + "\n")); + } + function loaded() { + updateOnlineStatus("load"); + document.body.addEventListener("offline", function () { + updateOnlineStatus("offline") + }, false); + document.body.addEventListener("online", function () { + updateOnlineStatus("online") + }, false); + } + </script> + <style>...</style> + </head> + <body onload="loaded()"> + <div id="status"><p id="state"></p></div> + <div id="log"></div> + </body> + </html> +</pre> +<h3 id=".E5.8F.82.E8.80.83" name=".E5.8F.82.E8.80.83">参考</h3> +<ul> + <li><a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/#offline">WHATWG Web Applications 1.0 仕様の 'Online/Offline イベント' セクション</a></li> + <li><a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=336359">Firefox に実装された online/offline イベントのバグ追跡</a>および<a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=336682">関連バグ</a></li> + <li><a class="link-https" href="https://bugzilla.mozilla.org/attachment.cgi?id=220609">簡単なテストケース</a></li> + <li><a class="external" href="http://ejohn.org/blog/offline-events/">Online/Offline イベントの解説</a></li> +</ul> +<div> + {{HTML5ArticleTOC()}}</div> |