Включая переменные PHP во внешний JS-файл?

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

Да, отдельный PHP от JS

Прежде всего: да, вы должны отделить свой JS от PHP. Вы можете поместить его в отдельный файл, но вам нужно внести некоторые изменения в свой текущий код. Не делайте JS-файл динамически сгенерированным – на самом деле он убивает преимущества разделения JS-кода на отдельный файл (вы не можете кэшировать его и т. Д.).

Общие переменные как глобальные переменные / аргументы функции

Затем сохраните свои общие переменные в виде глобальных переменных в заголовке HTML-файла (у вас действительно нет большого выбора, хотя есть и другие альтернативы), желательно сгруппированные в один объект:

 var Globals = <?php echo json_encode(array( 'active_user_id' => $active_user->id, 'token' => $token, 'hash' => $hash, )); ?>; 

В качестве альтернативы вы можете передать все из них в качестве аргумента (ов) к функции, которую вы вызовете, но я предположил, что вы используете их также в других местах вашего скрипта.

Контейнер-зависимые данные, хранящиеся в атрибутах data-

Затем используйте атрибуты data- для хранения реальных данных, связанных с контейнерами. Вам не понадобятся post1 / post2 / post3 -like и отдельные обработчики событий для них:

 <div data-post-id="10">here is something</div> 

вместо, например:

 <div class="post10">here is something</div> 

Как читать глобалы и атрибуты data- из внешнего JS-файла

И тогда ваш JavaScript может выглядеть так:

 $(document).ready(function(){ $('[data-post-id]').click(function() { var el = $(this); var data = { 'post_id': el.data('post-id'), 'user_id': Globals.active_user_id }; data[Globals.token] = Globals.hash; $.ajax({ 'type': 'POST', 'url': 'http://domain.com/ajax/add_love', 'data': data, 'dataType': 'json', 'success': function(response) { el.html(response.total_loves).toggleClass('loved'); } }); return false; }); }); 

И этого должно быть достаточно (хотя я не проверял его).

Вы всегда можете вызвать функцию с параметрами из PHP:

somefile.js:

 function func(params) { //params is now from PHP //params.foo == "bar" } 

somefile.php:

 <?php $params = array('foo' => 'bar'); ?> <script type="text/javascript"> $(function() { func(<?php echo json_encode($params); ?>); }); </script> 

Я склоняюсь к этому подходу, потому что он избегает глобальных переменных, позволяя легко переносить переменные.

Мне нравится использовать json_encode также потому, что действительный JSON действителен. JS означает, что вам не нужно беспокоиться об экранировании «или», если вы используете внутри него строку и echo PHP.

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

На главной странице:

 var post_id=<?php echo $post->id; ?>; 

Затем в вашем включенном файле JS:

 data: { post_id: post_id, 

Вы не можете поместить его во внешний файл .js, если хотите включить переменные PHP. Но вы можете поместить код в отдельный PHP-файл, который генерирует допустимый вывод Javascript (включая тип содержимого в заголовке, установленном на «text / javascript»!).

В вашем первом файле PHP вы можете обратиться ко второму файлу PHP, генерирующему код Javascript, с помощью

 <script src="path/to/generateJS.php" type="text/javascript"></script> 

Я не знаю, существует ли способ. Но если вам удастся включить переменные во внешние js-файлы, это означает, что эти файлы должны обрабатываться как скрипты php, отображая эти переменные, а не просто отображая их как статические файлы. Это отрицательно скажется на производительности.

Один из способов, по-прежнему использующий внешний JS-файл, – объявить функцию и передать ей параметры из встроенного javascript. Код будет выглядеть так:

 <script> bindPost(<?php echo $post->id; ?>,<?php echo $active_user->id; ?>,'<?php echo $hash; ?>'); </script> 

где ваш bindPost объявляется во внешнем JS-файле и хорошо обрабатывает параметры.

Не добавляя намного большей сложности, самый простой способ сделать это – заставить сервер обрабатывать Javascript-файл как файл PHP, чтобы вы могли определять переменные PHP в этом файле, а затем эхо их точно так же, как вы делаете в кода в вашем вопросе.

В apache это означает создание файла .htaccess и добавление к нему следующей строки:

 AddType x-httpd-php .js 

(Обратите внимание, что это обработает все ваши файлы javascript как PHP. Если вы хотите обработать только некоторые из ваших файлов Javascript в виде PHP, вам нужно будет сделать более узкое правило .htaccess.)