
概要
あるWEBページ(ページAとします)にアクセスした瞬間に別のページ(ページBとします)にジャンプさせたくて、META、Javascriptなどを使ってみました。
しかしどうしても最初のページAが画面上に見えてしまいます。
瞬時にジャンプさせるにはどうしたらいいでしょうか?
詳細
ページAにアクセスしたときに、
瞬時にページBにジャンプさせたくて、
WEBサイトで情報を得て、以下の2種類をページAに記載してみました
3秒後にジャンプする手法 META方式
<META http-equiv="Refresh" content="3;URL=jump.html">
3秒後にジャンプする手法 Javascript方式
<BODY onLoad=setTimeout("location.href='jump.html'",3000)>
上記の2種の方法は「3秒後にジャンプ」なので、秒数の引数を
0秒に変更してみました。
しかし、どちらの手法を用いても一秒ほど、最初にアクセスするページAが表示されたのちに
ページBが表示されます。
出来うることならば(いや、絶対に)ページAにアクセスした瞬間にページBが表示され、
操作者に
「あ、今、ページAにアクセスしてから自動的にページBに飛んだな」
ということを察知してほしくありません。
どうしたらページAにアクセスした瞬間にページBが表示されるでしょうか?
<細かい話をします>
こういう質問をすると、そもそもの
「ページAアクセス時に瞬時にページBにジャンプする方法」
に回答せずに、
「なぜAからBにジャンプさせねばならんの? だったら最初からページBのURLを提示して
”ページBにアクセスしてください”
というようにWEB閲覧者にお願いすればいいじゃないの?
それを、Aにアクセスしたと見せかけて、Bにアクセスさせる、というのは何か悪意が感じられなあ!
質問の背景が怪しいですね!!!!!」
などとカラんでくる方がいらっしゃいます。
まあ、別にこちらは悪いことをしているわけでもなければ、WEB閲覧者をだまそうとしているわけでもないのでお答えします。
ページAは自分(質問者)が用意したサイト内のページです。
そしてページBは外部のWEBサービスを使って作ったページです。
最初から外部のページBのURLを提示してもいいのです。
しかし、そのページのアクセス解析(アクセス日時、IPアドレス、回数など)をしたいのです。
多分、回答されるご貴兄は
「じゃあ、ページBのアクセス解析をすりゃあいいじゃんか!
なんでジャンプなんかさせるんだ?
おかしいじゃないか!」
と思われることでしょう。
ところがページBは外部のWEBサービスですので、アクセス解析タグが置けません。
そこで、自分の作ったサイト内のページAにアクセス解析タグを置いて、ページAを経由させて自動的にページBに進ませることでアクセス解析を可能にしたい、ということです。
こういうと多分回答されるご貴兄は
「外部のWEBサービスだってやりようによってはアクセス解析できるよ
わざわざジャンプなんかさせなくてもいいんだよ!」
とおっしゃるかもしれません。
しかし、自分の作ったサイトで使っているアクセス解析になれているので、その方法でアクセス解析をしたいのです。
というわけで、ページAのURLをクリックしたあと、ページAは表示されずに、瞬時にページBを表示させたいです。
妥協できる点があるとすれば以下のやり方かな? と思います。
1 ページAにアクセスした後にページBにジャンプするさい、「ページAを経由している」ということを察知されたくないので、ページAの画像は極力(いや、絶対に)表示したくない
そのためならばページAのURLクリック後、ページBが表示されるまでの時間が「瞬時」ではなくて「1,2秒経過後」であってもそれは容認する
2 最初にアクセスするページAがどうしても見えてしまう、というならば
「ページAの表示内容、画像、テキストを白紙にする」
「ページAの表示内容、画像、テキストをページBと同一(もしくは極力似させる)」
という手法でごまかす方法もあるかもしれません。
これは
「ページAを表示させずに瞬時にページBにジャンプ」
がどんな手法をもってしても不可能である場合は容認しますが、できればやりたくありません
詳しい方、お願いします。
A 回答 (7件)
- 最新から表示
- 回答順に表示
No.7
- 回答日時:
ホームページ作成ソフトで出来ることに限定すると、
ご提示の <meta> と onload しか手段はありません。
目的は以下の二点と仮定して、代案を考えてみました。
* 自身のサイトにアクセスログを残す
* リンク元ページから、透過的に pageB を表示する
お勧めは案1ですが、案2/案3も実績がある方式です。
### 案1. HTTP 302 転送設定をする
サーバーに pageA を pageB へ転送(リダイレクト)する設定を行います。
転送にはいくつか種類がありますが、ご質問の内容ならば HTTP 302 が適しています。
簡易的な操作で実現できるサーバもあるようですが、
一般的には .htaccess という設定ファイルで行います。
例) .htaccess の記載内容
RewriteEngine On
ReawriteRule ^/xxx/pageA\.html hxxx://xxx/pageB.html [R,L]
よく使われる設定ですので、ご契約しているレンタルサーバーに説明が用意されていないか探してみましょう。
可能であれば有料サポートを頼むのもよいでしょう。
参考) レンタルサーバーによる説明例
https://www.onamae-server.com/guide/rs/p/56
https://help.sakura.ad.jp/206054622/
### 案2. pageB にビーコン画像を埋め込む
pageB に以下のような記述を行います。
<img src="//自身のサイト/beaconA.png" width=1 height=1>
利用者が pageB を表示すると
ブラウザが beaconA 取得のために通信が生まれるので、
自身のサイトでアクセスログ取得ができます。
beaconA は画面表示させないために 1x1 の透明画像とでもしてください。
この案では pageA が不要になるので、
pageA へのリンクをすべて pageB にする手間が発生します。
### 案3. リンク元からビーコン URL を呼ぶ
案2 のようにビーコンを使いますが
pageB へのリンクとなる <a> すべてにスクリプトを組み込み、
ビーコン URL への通信が完了してからリンクを行います。
<script>
// ビーコンURL との通信が成功した後で目的の URL へリンクする
function jump(a){
_ fetch('//自身のサイト/beacon.jon').then(res=>window.location = a.href);
_ return false;
}
</script>
<a href="/xxx/pageB.html" onclick="return jump(this)">
No.6
- 回答日時:
>それはホームページビルダーなどのホームページ作成ソフトでも、
>実現できる手法でしょうか?
出来ないですね。
つまりWebアプリの話じゃなくて、コンテンツの中のHTMLとJSだけで
なんとかしたいという話?
とするとここまで殆ど噛み合って無いと思う。
iframeに次の画面を嵌め込むとかいろいろ考えられるけど
その後の操作が不自然になるからやめた方が良さそう。
ご回答ありがとうございます。
>出来ないですね。
出来ないんですね
>つまりWebアプリの話じゃなくて、コンテンツの中のHTMLとJSだけで
なんとかしたいという話?
この意味がよくわかりませんが、当方は
「ホームページ作成ソフト(ホームページビルダーに類するような)で出来ることでこの問題を解決したい」
と思っています。
>とするとここまで殆ど噛み合って無いと思う。
かみ合ってないんですね。
ここまで、というのはどこからどこまででしょうか?
回答1から回答6までの話でしょうか?
それとも貴殿が回答した回答5と6だけの話でしょうか?
No.4
- 回答日時:
こんにちは
いずれの方法にしろ、直接ページBを表示するときに比べて、時間はかかるようになります。
(一旦、ページAにアクセスしているため)
方法はいろいろありますけれど、htaccessが使えるなら、htaccessでのリダイレクトを。
https://www.profuture.co.jp/mk/column/20177
https://dejima.s-cubism.com/know-how/22128
使えない場合は、phpなどサーバサイドの言語で。
それも使えなければ、ご質問に挙げられているrefreshやスクリプトによる方法になりますが、こちらの場合はユーザの通信環境によって(次のURLを表示するまでに)若干のタイムラグを生じます。
>最初にアクセスするページAが表示されたのちに
>ページBが表示されます。
ページBを読みに行って解釈を終えるまでの時間は、ページAが表示されることになります。
ユーザの通信環境がものすごく良ければ、ほとんどチラつき程度にはなるでしょうけれど・・・
そんなに良い環境ばかりを期待はできないので、この方法の場合は、ご質問のように「白紙のページ」にしておくのが良いのではないでしょうか?
あるいは「リダイレクトしています」という旨の表示にしておくとか。
ご回答ありがとうございます。
>https://www.profuture.co.jp/mk/column/20177
こちら、アクセスできませんでした
>https://dejima.s-cubism.com/know-how/22128
難しそうですね、勉強してみます。
>そんなに良い環境ばかりを期待はできないので、この方法の場合は、ご質問のように「白紙のページ」にしておくのが良いのではないでしょうか?
当座はこの方法でしのごうと思います。
>あるいは「リダイレクトしています」という旨の表示にしておくとか。
質問文に書いた通り、この方法は容認できない方法です。
No.3
- 回答日時:
そもそも、htmlとjavascriptだけで実現したいということでしょうか?
phpとか、サーバーサイドの言語は使えない環境という前提でしょうか?
ご回答ありがとうございます。
>そもそも、htmlとjavascriptだけで実現したいということでしょうか?
>phpとか、サーバーサイドの言語は使えない環境という前提でしょうか?
質問者が
「ページAは自分(質問者)が用意したサイト内のページです。」
云々としているWEBページは、自前のサーバを用意しているわけではありません。
WEBサイト無料レンタルサービスに申し込んで、借りたサーバ容量に対して、、いわゆるホームページ作成ソフト(ホームページビルダーなどに類するソフト)で作成したWEBページをFTPでアップロードしている、という形態です。
こういう状態です。
>WEBサイトで情報を得て、以下の2種類をページAに記載してみました
も、WEBサイトで検索したプログラム文を見よう見まねで打ち込んだだけなので、たとえそれなりにジャンプ機能が実行できているとしても、それが
「正しいやり方で間違いなくできている」なのか
「本当は正しいやり方ではなく、やっとこさ出来ている」なのかは
判別しかねます。
といったところです。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
jsonテキストデータの並び替え...
-
jsで質問です。 ボタンが二つ存...
-
スマホ上で、左右スワイプで次...
-
ラジオボタンを複数選択したと...
-
Outlookのアカウントがあるとメ...
-
変数宣言と初期値代入の場所に...
-
Adobe acrobat proでフォームを...
-
初心者です。gulpでコンパイル...
-
階層別の組織図の自動作成について
-
ボタンを押したあとに画像を表...
-
Cookieに保存されない
-
画面遷移を行わずに同一ページ...
-
インスタグラムのapiを利用して...
-
タグを教えてください。
-
jsで質問です。 formをsubmitし...
-
2025年相性がいい人のサイトの...
-
CookieをWebStoeageに変える
-
jqueryのselect2で検索欄の文字...
-
<tr>指定した表の行要素をボ...
-
食材の期限を管理するためにGAS...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
javascriptのプラグインBookBlock
-
Webサイト内に埋め込んだmp4動...
-
jquery loadでページを読み込...
-
excel VBA でjava のボタンを押...
-
HTMLのリンクの色をクリックす...
-
外部リンクについて
-
SEOの初歩的質問で恐縮です
-
携帯の戻るボタンを無効化
-
マイクロソフトやアドビなど企...
-
画面のどこかをクリックすると
-
リンク線の色を変える
-
同画面の下方へリンクしたい。
-
相互リンクのみを目的としてパ...
-
a:hoverで設定した内容をクリッ...
-
検索結果について
-
携帯ホームページですごかった...
-
リロードした時にページの一番...
-
リンク先を新しいタブで開けな...
-
Java Script
-
ツリー型リンクのタグ
おすすめ情報