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

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

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

Google Chromeは携帯、テレビ、デスクトップなどの様々なプラットフォームで利用できるウェブブラウザです。Googleが開発したもので、Blink (レンダリングエンジン) とアプリケーションフレームワークを使用しています。

Webサイト

一つのドメイン上に存在するWebページの集合体をWebサイトと呼びます。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

Q&A

解決済

3回答

1048閲覧

ネットがつながらないときのウェブページの表示をこちらで制御したい

mie0224

総合スコア34

Chrome

Google Chromeは携帯、テレビ、デスクトップなどの様々なプラットフォームで利用できるウェブブラウザです。Googleが開発したもので、Blink (レンダリングエンジン) とアプリケーションフレームワークを使用しています。

Webサイト

一つのドメイン上に存在するWebページの集合体をWebサイトと呼びます。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

0グッド

0クリップ

投稿2019/01/15 07:13

chromeを使ったウェブサービスを作成しているのですが、ときどきwifiの不調でネットが途切れてしまいます。
そのときに、「ウェブページへアクセスできません」というメッセージとともにお決まりのページがブラウザに表示されるのですが、このページをこちらで用意したもので使用することってできないのでしょうか?
404や503はhtaccessを使用して用意することができると勉強したのですが、この場合はサーバーまで行き着いていないので、ローカル側で制御??なのか・・・chromeの拡張機能とかで何かないのかな・・・?など調べてみたのですが行き着くことができませんでした(><
この問題なら、他の方も悩まれた経験があるのではないかと思い質問してみました。
もしご存知の方いらっしゃれば、どうかよろしくお願いいたしますm(_ _)m

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

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

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

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

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

guest

回答3

0

あくまで理論上の話で、対応したことがあるというわけではありません。
html,css,javascriptはクライアント側の言語で基本的にブラウザからアクセスしたときにクライアント側にダウンロードして表示させています。
ということはオンラインかオフラインかをJavaScriptで確認することができれば、一応、それに近いことはできるのではないか、と思います。

  • [window.navigator.onLine

](https://developer.mozilla.org/ja/docs/Web/API/NavigatorOnLine/onLine)

ただ上記解説にあるようにブラウザによって挙動やオフラインの解釈が違います。
100%全て対応しきるのは難しいように思います。

動きとしてはwindow.navigator.onLineがfalseを返したときにページ遷移させるわけではなく、body内を書き換える、形ですね。
遷移だとネットワークがつながっていない状態なので仰っているように「サーバーに行き着いていない」のでページ表示は無理ですしね。
ただ、「リンクなど画面遷移が発生した瞬間に切れた場合」が厄介に思います。

「ネットワークの不調」はあくまで外的要因なので、ネットワーク復旧してもらってから再開してもらうしかないように思います。

投稿2019/01/15 07:22

m.ts10806

総合スコア80765

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

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

m.ts10806

2019/01/15 07:40

「対応したことがない」というとちょっと嘘になりますね。 タブレット端末でオフライン作業が発生するとか、そういうのでオフライン判定をwindow.navigator.onLineでしたことがあります(あくまで作業継続なのでオフラインで画面内切り替えはやってませんが)
mie0224

2019/03/29 09:13

mts10806 様 回答ありがとうございます! 私も、実はこれができるならタブレットのwebviewでも利用してみたいなと思っています。 一度試してみようと思います。ご丁寧にありがとうございました!
guest

0

ベストアンサー

拡張機能に頼らずとも、Service Workerを使えば可能かと思います。それどころか、オフラインでも動作するサイトを作ることも可能です。

投稿2019/01/15 07:17

maisumakun

総合スコア145121

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

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

mie0224

2019/03/29 09:15

maisumakun 様 回答ありがとうございます! Service Workerというものがあるんですね、強力ですね! オフラインサイトまでは必要ないのですが、それくらいできるとあると非常に安心です! ありがとうございます!
guest

0

いろんなページを自作したいと思う気持ちは理解できますが、ユーザー側からみて、自作する事で未接続の原因が不明になるようでは却って困ります。

サイト管理者は404ページ作成ぐらいに留めて置けば、接続エラーが発生した場合に、ブラウザーや端末の表示をもとに、接続エラー以外の端末から検索し、対応策が検討出来るからです。

※あくまでも、個人的な意見です。

投稿2019/01/16 02:46

yoshinavi

総合スコア3521

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

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

mie0224

2019/03/29 08:16

yoshinavi 様 回答ありがとうございます! たしかに、これは404だよっていう表示もないオフラインページだと困惑してしまいますね! よく考えて作成してみます。ありがとうございます!
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.50%

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

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

質問する

関連した質問