Какова наилучшая практика для передачи многих серверных данных в JavaScript?

Question

Допустим, у меня есть много Javascript внутри страниц. На данный момент довольно легко инициализировать переменную, просто используя какой-либо оператор Print / Echo для инициализации значения JavaScript.

Example: var x = <?php echo('This is a value');?>

Сначала я подумал, что могу передать значение всех переменных параметром функции, НО это невозможно, потому что у нас много значений (у нас многоязычный веб-сайт и весь текст взят с сервера (BD)).

Example : initializeValues(<?php echo('Value1,Value2,Value3,Value...');?>);//JS Method that can be external of the page

Больше проблем возникает, когда мы хотим снять весь JavaScript со страниц, чтобы переместить все в внешний файл JavaScript. Каков был бы хороший способ инициализировать все эти переменные? Если я свяжу методы JavaScript с помощью OnLoad документа, я не смогу использовать метод Print / Echo для заполнения всех значений.

Есть хороший шаблон для решения этой задачи?

Answer 1

Очень популярный шаблон - это использование формата JSON. Есть библиотеки для его создания, и Javascript использует его напрямую.

Answer 2

С помощью php вы можете создать ассоциативный массив, затем с помощью json_encode вы можете сериализовать его для вывода на страницу между некоторыми тегами скрипта.

некоторые примеры того, как это сделать, вы можете посмотреть на http://www.php.net/manual/en/function.json-encode.php

Answer 3

Вот как я это делаю:

<?php

$foo = array('bar' => 'gork');

?>
<input id='foo' type='hidden' value='&lt?= json_encode($foo); ?>' />

Затем на стороне клиента (я использую Prototype):

var foo = $F('foo').jsonParse();
alert(foo.bar);

Answer 4

var x = <?php echo('This is a value');?>

Э-э, нет, это закончится как:

var x = This is a value

(синтаксическая ошибка.) Вы хотите:

var x = <?php echo json_encode('This is a value', JSON_HEX_TAG|JSON_HEX_AMP|JSON_HEX_QUOT);?>

HEX_TAG, экранирующий в PHP 5.3, позволяет избежать проблем с последовательностью </, появляющейся в блоке <script>. Кодирование AMP и QUOT необходимо, чтобы гарантировать отсутствие проблемных символов " и &, когда вы помещаете код в значение атрибута, ограниченное " или блоком сценариев не-CDATA XHTML. Если вы когда-либо используете только блок сценариев HTML (или блок сценариев XHTML CDATA), вы можете обойтись без них (хотя они также не причиняют вреда).

json_encode также с радостью закодирует массив значений для помещения в переменную JS, а не просто строку.

More problem come when we want to take off all JavaScript from pages to move everything on external JavaScript file.

Хорошей идеей будет поместить весь ваш статический код, включая код, привязанный к слушателям событий, во внешний файл JavaScript. Однако постраничные данные должны по-прежнему оставаться на странице либо в соответствующих атрибутах самого документа (например, имена классов для ненавязчивых сценариев), либо в простом блоке <script type="text/javascript">var data= ...;</script> без другого кода.

Answer 5

лучшая практика? Передача значений с сервера на клиентскую js слишком нестабильна для единственной передовой практики.

скажем, вы используете Smarty. тогда моя лучшая практика:

<script type="text/javascript">
var limit = Number("{$limit}");
var msg = "{$msg}";

{literal}
// code using the variables
{/literal}
</script>

но я также вижу в этом очень разумный подход:

function to_js_vars(arrray $jsvars)
{
    foreach ($jsvars as $name => $info) {
        printf(
            "var %s = %s("%s");\n"
          , $name
          , $info['type']
          , $info['val']
        );
    }
}

, где $info['type'] - это одно из Number, Boolean и '' (пустая строка) для всего остального