wordpress 中的 CSP 和脚本本地化

Question

我想在我的 Wordpress 网站上正确使用内容安全策略，但也不想硬编码 URI。

我正在将我所有的内联脚本移动到一个文件中，并将散列添加到所有脚本标签以用于子资源完整性。

ajax 本地化让我很难受；它运行s PHP 获取 JS 文件名，并将其内联输出到一个对象（被 ajax 调用使用）。

为了使 admin-ajax 可用，我

global $wp_query;
wp_localize_script('project-js', 'ajax_object', array(
    'ajaxurl' => admin_url('admin-ajax.php'),
    'some_vars' => json_encode($wp_query->query)
));

输出：

<script type="text/javascript" id="project-js-js-extra">
/* <![CDATA[ */
var ajax_object = {"ajaxurl":"http:\/\/domain.tld\/wp\/wp-admin\/admin-ajax.php","some_vars":"[]"};
/* ]]> */
</script>

我需要能够向此标签添加哈希，但我找不到正确的方法。

我可以在 PHP 中生成它，例如：

global $wp_scripts;
$l10n_candidate = array(
    'ajaxurl' => admin_url( 'admin-ajax.php' ),
    'some_vars' => json_encode( $wp_query->query )
);

$script_content = "/* <![CDATA[ */
var ajaxpagination = " . wp_json_encode( $l10n_candidate ) . ';
/* ]]> */';
$script_hash = hash('sha256', $script_content);

但我不知道如何正确地将它添加到页面中，而且，这感觉太 hacky 了。

如果不输出此散列，或将此对象创建移动到我的主 JavaScript 文件，该页面将不会通过我的 CSP，脚本也不会运行。

我该如何完成？

Answer 1

到目前为止，我唯一能解决的方法是使用 [wp_enqueue_scripts][1]，这是 [wp_enqueue_script][2] 在使用 [wp_localize_script][3]

感觉不是最好的解决方案，但确实有效。

function abr_ajax_pagi_obj(){
    global $wp_query;

    $l10n_candidate = array(
      'ajaxurl' => admin_url( 'admin-ajax.php' ),
      'some_vars' => json_encode( $wp_query->query ),
    );

    $script_content = "/* <![CDATA[ */
var ajaxpagination = " . wp_json_encode( $l10n_candidate ) . ';
/* ]]> */';
$script_hash = 'sha256-' . base64_encode(hash('sha256', $script_content,true));
?><script integrity="<?php echo $script_hash?>"><?php
echo $script_content;?></script><?php 
    }

add_action( 'wp_enqueue_scripts', 'abr_ajax_pagi_obj', 5, 5 );


  [1]: https://developer.wordpress.org/reference/hooks/wp_enqueue_scripts/
  [2]: https://developer.wordpress.org/reference/functions/wp_enqueue_script/
  [3]: https://developer.wordpress.org/reference/functions/wp_localize_script/

wordpress 中的 CSP 和脚本本地化

CSP and script localization in wordpress

javascript

php

wordpress

content-security-policy

custom-wordpress-pages