Использование кэширования браузеров для сторонних JS

Я установил Expiry на свой httpd.conf

ExpiresActive On ExpiresDefault "access plus 1 month" ExpiresByType image/gif "access plus 1 month" ExpiresByType image/jpeg "access plus 1 month" ExpiresByType image/png "access plus 1 month" ExpiresByType text/css "access plus 1 month" ExpiresByType text/javascript "access plus 1 month" ExpiresByType application/x-javascript "access plus 1 month" 

Это помогает с кешированием браузера для изображений, шрифтов, собственных CSS-файлов и js-файлов. Но у меня также есть внешний JS, включенный в мой сайт:

 http://connect.facebook.net/en_US/sdk.js (20 minutes) http://apis.google.com/js/client.js (30 minutes) https://apis.google.com/js/rpc:shindig_random.js?onload=init (30 minutes) https://platform.twitter.com/widgets.js (30 minutes) https://www.google-analytics.com/analytics.js (2 hours) 

Google Pagespeed Insights говорит о верхних файлах: установка даты истечения срока действия или максимального возраста в заголовках HTTP для статических ресурсов указывает браузеру на загрузку ранее загруженных ресурсов с локального диска, а не по сети.

Как использовать кеш браузера для этих внешних JS-файлов? Любая помощь ?

Действительно, раздражающая проблема. Я боюсь, что это не так легко устранить. Но вы можете использовать cron .

Во-первых, имейте в виду, что Google вряд ли будет наказывать вас за свои инструменты (например, Analytics). Однако, как упоминалось ранее, его можно исправить с помощью cron , что в основном означает, что вы загружаете JavaScript локально и извлекаете обновленные сценарии.

Как это сделать:

Прежде всего, вам нужно загрузить скрипт, который вы используете. Я буду использовать Google Analytics в качестве примера (это, кажется, самый проблемный сценарий, на который жалуются люди, но вы можете реплицировать его для любых внешних скриптов).

Посмотрите в свой код и найдите имя сценария, в нашем случае это: google-analytics.com/ga.js . Поместите этот URL-адрес в свой веб-браузер, и он откроет исходный код. Просто сделайте копию и сохраните его как ga.js Вы можете назвать его, что вам нравится, но я советую просто сохранить его с тем же именем.

Сохраните этот вновь созданный файл JavaScript на своем веб-сервере, в моем случае:

 - JS - ga.js 

Затем вам нужно будет обновить код на страницах, вызывающих ваш скрипт, и просто изменить каталог, вызывающий файл JavaScript. Еще раз в нашем случае мы будем менять эту строку:

 ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js'; 

в

 ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.yoursite.com/js/ga.js'; 

На этом этапе ваш сайт будет запускать скрипт с вашего сайта локально ! Однако это означает, что сценарий никогда не будет обновляться. Если вы не будете повторно запускать этот короткий процесс каждую неделю. Это зависит от вас. Но я слишком ленив для этого.

Это – то, где CRON вступает в игру:

Почти каждый хостинг-сервис будет иметь возможность настраивать задания cron . На Hostinger он находится на вашей панели хостинга, на GoDaddy вы найдете его в разделе «Контент».

Поместите следующий скрипт в ваш cron , и все, что вам нужно сделать, это изменить абсолютный путь к переменному $localfile . Что делает этот скрипт, это проверка обновлений от Google в файле ga.js Вы можете установить временные рамки того, как часто вы хотите проверить наличие обновлений. От одного раза в час до одного раза в месяц и далее.

Если вы также делаете это для внешних файлов, отличных от Google Analytics, вам также потребуется изменить переменную $remoteFile . Таким образом, $remoteFile является URL-адресом внешнего файла JavaScript, а переменная $localFile вы поместите путь к вашему новому локально сохраненному файлу, просто так!

 <? // script to update local version of Google analytics script // Remote file to download $remoteFile = 'http://www.google-analytics.com/ga.js'; $localfile = 'ENTER YOUR ABSOLUTE PATH TO THE FILE HERE'; //For Cpanel it will be /home/USERNAME/public_html/ga.js // Connection time out $connTimeout = 10; $url = parse_url($remoteFile); $host = $url['host']; $path = isset($url['path']) ? $url['path'] : '/'; if (isset($url['query'])) { $path .= '?' . $url['query']; } $port = isset($url['port']) ? $url['port'] : '80'; $fp = @fsockopen($host, '80', $errno, $errstr, $connTimeout ); if(!$fp){ // On connection failure return the cached file (if it exist) if(file_exists($localfile)){ readfile($localfile); } } else { // Send the header information $header = "GET $path HTTP/1.0\r\n"; $header .= "Host: $host\r\n"; $header .= "User-Agent: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8.1.6) Gecko/20070725 Firefox/2.0.0.6\r\n"; $header .= "Accept: */*\r\n"; $header .= "Accept-Language: en-us,en;q=0.5\r\n"; $header .= "Accept-Charset: ISO-8859-1,utf-8;q=0.7,*;q=0.7\r\n"; $header .= "Keep-Alive: 300\r\n"; $header .= "Connection: keep-alive\r\n"; $header .= "Referer: http://$host\r\n\r\n"; fputs($fp, $header); $response = ''; // Get the response from the remote server while($line = fread($fp, 4096)){ $response .= $line; } // Close the connection fclose( $fp ); // Remove the headers $pos = strpos($response, "\r\n\r\n"); $response = substr($response, $pos + 4); // Return the processed response echo $response; // Save the response to the local file if(!file_exists($localfile)){ // Try to create the file, if doesn't exist fopen($localfile, 'w'); } if(is_writable($localfile)) { if($fp = fopen($localfile, 'w')){ fwrite($fp, $response); fclose($fp); } } } ?> 

Именно это и должно исправить любые проблемы, которые возникают у вас с помощью кеш-кеширования сторонних производителей с использованием сторонних скриптов.

Источник: http://diywpblog.com/leverage-browser-cache-optimize-google-analytics/

ЗАМЕТКА:

По правде говоря, эти файлы не имеют большого влияния на вашу фактическую скорость страницы. Но я могу понять, что вы беспокоитесь о том, что Google наложил на вас штраф. Но это произойдет только в том случае, если у вас будет БОЛЬШЕ количество этих внешних скриптов. Все, что связано с Google, не будет против вас, как я сказал ранее.

Не уверен, что этот фрагмент кода поможет кому-то, но так или иначе я кэширую внешний файл js.

 <script> $.ajax({ type: "GET", url: "https://www.google-analytics.com/analytics.js", success: function(){}, dataType: "script", cache: true }); </script>