JavaScriptでページを更新させる方法とは【メンターが回答】
「JavaScriptでページを更新（F５）させる方法とは。」という質問にTechAcademyの現役エンジニアが解決方法を回答しています。ぜひ理解しておきましょう。
TechAcademyマガジンはオンラインのプログラミングスクールTechAcademy [テックアカデミー]が運営する教育×テクノロジーのWebメディアです。初心者でもすぐ勉強できる記事が2,000以上あります。
※TechAcademyに実際に寄せられた質問に現役エンジニアのメンターが回答しました。
質問に対して現役のエンジニアが回答していくシリーズだね！
今回はどういう質問でしょうか？
JavaScriptでページを更新させる方法だね！実際に回答してもらった内容を紹介するね！
お願いします！
質問
対象ページにアクセスがあったら、「1度」だけ更新（リロード）させるような作りを実装させたいです。
調べて自分なりに作ったところ下記のコードになりましたが、更新され続けてしまいます。
「1度」だけ更新させるにはどう書けば良いのでしょうか？
該当のソースコード
<script>
window.onload = function() {
console.log('onload 2');
setTimeout("myfunc()",0);
}
function myfunc() {
window.location.reload(true);
}
</script>
[PR] JavaScript・jQueryで挫折しない学習方法を動画で公開中
メンターからの回答
リロード済みの時はリロード処理を実行しないようにしないと、永遠とループしてしまうので、それがうまく行かない原因です。
<script>
window.onload = function() {
console.log('onload');
setTimeout(myfunc,0);
}
function myfunc() {
var isReloaded = false; //リロード済みかどうかの確認フラグ用変数
//リロード済みでなければリロードを実行
if (isReloaded !== false) {
window.location.reload(true);
isReloaded = true; //リロード後にリロード履歴フラグをtrueにセット
}
}
</script> 以上、JavaScriptでページを更新させる方法について解説しました。
TechAcademyでは、現役JavaScriptエンジニアのメンターが質問にすぐ回答します。
回答してくれたメンター
| mentor-takeda 関数型プログラミング言語(HaskellやLispなど)を使用した数値計算システム開発業務に長年従事。 |
JavaScriptでページを更新させる方法について解説したよ。
ページの更新がずっと続くって何か怖いですね。
そうそう。迷惑行為にならないようにしっかりチェックしたいね。
わかりました。ありがとうございます！
他にもJavaScript内でdocument.writeを使わずにHTMLを書く方法についてメンターが回答しています。
TechAcademyではJavaScriptを使ってWebサービスを公開できるオンラインブートキャンプ フロントエンドコース（JavaScript・jQuery講座）を開催しています。プログラミングの初心者でも受講可能です。
現役エンジニアがパーソナルメンターとして受講生に1人ずつつき、マンツーマンのメンタリングで学習をサポートし、最短4週間でオリジナルWebサービスを開発することが可能です。
独学に限界を感じている場合はご検討ください。
