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

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

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

Javaは、1995年にサン・マイクロシステムズが開発したプログラミング言語です。表記法はC言語に似ていますが、既存のプログラミング言語の短所を踏まえていちから設計されており、最初からオブジェクト指向性を備えてデザインされています。セキュリティ面が強力であることや、ネットワーク環境での利用に向いていることが特徴です。Javaで作られたソフトウェアは基本的にいかなるプラットフォームでも作動します。

WordPress

WordPressは、PHPで開発されているオープンソースのブログソフトウェアです。データベース管理システムにはMySQLを用いています。フリーのブログソフトウェアの中では最も人気が高く、PHPとHTMLを使って簡単にテンプレートをカスタマイズすることができます。

Q&A

解決済

1回答

1887閲覧

wordpressで外部javascriptを毎回読み込ませたい(google map)

koiitirou3

総合スコア35

Java

Javaは、1995年にサン・マイクロシステムズが開発したプログラミング言語です。表記法はC言語に似ていますが、既存のプログラミング言語の短所を踏まえていちから設計されており、最初からオブジェクト指向性を備えてデザインされています。セキュリティ面が強力であることや、ネットワーク環境での利用に向いていることが特徴です。Javaで作られたソフトウェアは基本的にいかなるプラットフォームでも作動します。

WordPress

WordPressは、PHPで開発されているオープンソースのブログソフトウェアです。データベース管理システムにはMySQLを用いています。フリーのブログソフトウェアの中では最も人気が高く、PHPとHTMLを使って簡単にテンプレートをカスタマイズすることができます。

0グッド

0クリップ

投稿2016/11/30 14:14

実装したいこと
1, 外部jsファイルを定期的に書き換える(id="sample" でgoogle mapを描画)
2, html内で読み込ませる

<div id="sample"></div> <script src="http://***/sample.js"></script> <script async defer src="https://maps.googleapis.com/maps/api/js?key=*****&callback=initMap"></script>

このまま実装すると、一度履歴を削除しない限りsample.jsがブラウザで亢進されず、書き換えた外部jsが反映されません。

どうしたらよいでしょうか?

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

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

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

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

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

guest

回答1

0

ベストアンサー

ブラウザキャッシュを更新するようにすればよいと思います。WordPress 関係なく、基本的な考え方は以下のサイトをご覧ください。

キャッシュを有効にしつつ、cssやjsファイルの変更を確実に反映させる

WordPress の場合、wp_enqueue_script() 関数で外部ファイルを読み込むようにし、第四引数に外部ファイルのバージョンを指定できるようになっているので、その値を指定すればよいです。

関数リファレンス/wp enqueue script - WordPress Codex 日本語版

以下に基本的な例を示します。

php

1function teratail57184_enqueue_scripts() { 2 $googlemap_script = add_query_arg( array( 3 'key' => '000000', 4 'callback' => 'initMap', 5 ), 'https://maps.googleapis.com/maps/api/js' ); 6 7 wp_enqueue_style( 'teratail57184-theme', get_stylesheet_uri(), array(), '1.0.0' ); 8 9 wp_enqueue_script( 'teratail57184-googlemap', esc_url_raw( $googlemap_script ), array( 'jquery' ), null, true ); 10 wp_enqueue_script( 'teratail57184-sample', get_template_directory_uri() . '/sample.js', array( 'jquery', 'teratail57184-googlemap' ), '1.0.0', true ); 11} 12add_action( 'wp_enqueue_scripts', 'teratail57184_enqueue_scripts' );

このようにした場合、HTML の出力は以下のようになります。

html

1<!DOCTYPE html> 2<html lang="ja" class="no-js no-svg"> 3<head> 4 5<!-- 〜 中略 〜 --> 6 7<link rel='stylesheet' id='teratail57184-theme-css' href='http://example.com/wp-content/themes/twentyseventeen/style.css?ver=1.0.0' type='text/css' media='all' /> 8 9<!-- 〜 中略 〜 --> 10 11<script type='text/javascript' src='http://example.com/wp-includes/js/jquery/jquery.js?ver=1.12.4'></script> 12<script type='text/javascript' src='http://example.com/wp-includes/js/jquery/jquery-migrate.min.js?ver=1.4.1'></script> 13</head> 14<body> 15 16<!-- 〜 中略 〜 --> 17 18<script type='text/javascript' src='https://maps.googleapis.com/maps/api/js?key=000000&#038;callback=initMap'></script> 19<script type='text/javascript' src='http://example.com/wp-content/themes/twentyseventeen/sample.js?ver=1.0.0'></script> 20</body> 21</html>

※ header.php に wp_head() 関数、footer.php に wp_footer() 関数が書かれていれば出力されます。WordPress では、HTML で直接外部ファイルを記述することはしません。

上記の例では、外部ファイルのバージョンを直接指定していますが、WP_DEBUG 定数の値をみて、乱数または日時秒(数字のみ)と、直接外部ファイルのバージョンを指定とで切り替えるような仕様にするとよいと思います。

Nginx や Varnish など、サーバー側のキャッシュを利用している場合は、別途サーバー側の対応が必要です。WordPress の場合、プラグインをインストールすれば、管理画面側から、Nginx や Varnish のキャッシュを削除することも可能です。

投稿2016/11/30 14:41

編集2016/11/30 15:24
退会済みユーザー

退会済みユーザー

総合スコア0

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

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

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.50%

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

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

質問する

関連した質問