передайте об'єкт / JSON в wp_localize_script

У мене є робочий фрагмент javascript, який містить літеральний об'єкт. Але мені потрібно локалізувати це, і я намагаюся зрозуміти, як його переписати, щоб я міг отримати wp_localize_script (), щоб отримати доступ до нього та вивести правильний формат.

Не локалізована (нединамічна) версія виглядає так:

var layoyt_config = {
    'header'        : 1 
,   'footer'        : 1
,   'ls'            : {'sb1':1}
,   'rs'            : {'sb1':1,'sb2':1}
,   'align'         : 'center'
};  

Тепер, щоб ці значення були породжені php (на основі деяких wp_settings), я хочу використовувати wp_localize_script, тому я можу взяти його звідти:

var layoyt_config = my_localized_data.layoyt_config;

І щоб отримати ці дані до цього об'єктного властивості, я "подумав", що можу це зробити, але очевидно, що ні:

$data = array(
    'layout_config' => {
        'header' : 1
    ,   'footer' : 1
    ,   'ls' : {'sb1': 1}
    ,    'rs' : {'sb1': 1,'sb2': 1}
    ,    'align' : 'center'
    }
);
wp_localize_script('my-script-handle', 'my_localized_data', $data);

Оскільки це призведе до помилки розбору PHP, я намагався переписати синтаксис масиву json, оскільки wp_localize_script перетворить це назад у нотацію об'єкта, але це також не працює для мене:

$data = array(
    'layout_config' => array(
        'header' => 1
    ,   'footer' => 1
    ,   'ls' => array('sb1'=>1)
    ,    'rs' => array('sb1'=>1,'sb2'=>1)
    ,    'align' => 'center'
    )
);
wp_localize_script('my-script-handle', 'my_localized_data', $data);

І хоча це працює безперебійно за допомогою аналізатора php, я не отримую очікуваного виводу у своєму джерелі сторінки, оскільки my_localized_data.layout_config стає рядковим "масивом", ось вихід:

<script type='text/javascript'>
    /* <![CDATA[ */
    var wpkit_localized_data = {
    layout_config: "Array"
    };
    /* ]]> */
</script>

Отже .. Як я можу це зробити (чи я просто повинен прийняти, що я повинен «сплюстити» мій об’єкт на дискретні зміни типу:

lc_header = '1';
ls_ls_sb1 = '1';
etc...

Дійсно, wp_localize_script()це просто , він просто додає цитати навколо значень і уникає вмісту, очікуючи, що всі вони будуть рядками.

Однак є l10n_print_afterключ масиву, який буде надрукований без будь-яких втручань. Він може бути використаний для виконання довільного коду після передачі рядків. Ви можете використовувати його для передачі додаткових даних.

$data = array(
    'layout_config' => {
      'ls' : {'sb1': 1}
    }
);
$reshuffled_data = array(
    'l10n_print_after' => 'my_localized_data = ' . json_encode( $data ) . ';'
);
wp_localize_script('my-script-handle', 'my_localized_data', $reshuffled_data);

Ви отримаєте такий код:

var my_localized_data = {}; // What is left of your array
my_localized_data = {'layout_config': {'ls': {'sb1': 1}}}; // From l10n_print_after

Відмова від відповідальності - я вже не в своїй глибині щодо безпеки JS.

По-перше, щоб відповідати бажаному результату, ви вимкнені за рівнем вкладеності. Ім'я об'єкта йде як параметр локалізації виклику (замість ключа масиву):

$data = array(
        'header' => 1
    ,   'footer' => 1
    ,   'ls' => array('sb1'=>1)
    ,    'rs' => array('sb1'=>1,'sb2'=>1)
    ,    'align' => 'center'
);
wp_localize_script('my-script-handle', 'layout_config', $data);

Але lsі rsдосі порушується , тому що WP_Scripts->print_scripts_l10n()метод не обробляє випадок , коли змінна масиву.

Найкраще, що я міг би придумати, щоб виправити наступний фільтр (як зазначено вище - не впевнений, наскільки безпечним буде його використання у виробництві, але загальну думку):

add_filter('js_escape','js_escape_nested', 10, 2);

function js_escape_nested($safe_text, $text) {

     if(is_array($text) )
         return str_replace( '"', "'", json_encode ($text) );

     return $safe_text;
}