WordPress中Bootstrap Table仅登录可见的问题排查求助

这个问题大概率是未登录用户无法获取数据源或者插件资源加载异常导致的，结合你的代码和场景，我整理了几个优先级最高的排查方向和解决方案：

1. 先确认JSON数据源的访问权限 #

这是最常见的原因：你的file.json文件可能被WordPress的权限规则或服务器设置限制了，只有登录用户能访问，未登录访客无法获取数据。

你可以直接在退出登录状态下，把JSON的完整URL复制到浏览器地址栏打开：

• 如果打不开（返回403/404），说明文件所在目录的权限或.htaccess规则阻止了访客访问。
• 解决办法：
  • 把JSON文件移到网站根目录下的公开目录（比如新建public-data文件夹），确保文件夹权限设为755，文件权限设为644；
  • 或者修改.htaccess，添加规则允许该文件被所有用户访问。

2. 修正插件资源的加载逻辑 #

你当前用$post->ID == 1174判断加载资源，但在未登录状态下，$post对象可能因为缓存、主题查询逻辑等原因没有被正确初始化，导致资源根本没加载，表格自然无法渲染样式和数据。

建议换成WordPress官方的条件判断函数is_page(1174)，它更稳定可靠：

<?php if (is_page(1174)) { ?>
  <!-- 先加载CSS，避免样式延迟 -->
  <link rel="stylesheet" type="text/css" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
  <link rel="stylesheet" type="text/css" href="https://example.com/assets/bootstrap-table/bootstrap-table.css">
  <!-- 再加载JS，确保依赖顺序正确 -->
  <script type="text/javascript" src="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
  <script type="text/javascript" src="https://example.com/assets/bootstrap-table/bootstrap-table.js"></script>
<?php } ?>

3. 排查缓存插件的影响 #

很多WordPress缓存插件（比如WP Rocket、W3 Total Cache）会给登录用户和未登录用户生成不同的缓存版本。如果你的缓存插件没有正确排除这个页面，可能导致未登录版本的页面丢失了插件资源。

解决办法：

• 进入缓存插件设置，把页面ID 1174加入「不缓存页面」列表；
• 清空所有缓存，退出登录后重新测试页面。

4. 用WordPress官方函数管理资源（更稳妥的方案） #

手动写资源标签容易出现依赖顺序问题（比如jQuery加载在Bootstrap之后），建议用wp_enqueue_script和wp_enqueue_style函数来管理，WordPress会自动处理依赖关系，避免加载顺序错误：

function enqueue_bootstrap_table_assets() {
  if (is_page(1174)) {
    // 加载Bootstrap CSS
    wp_enqueue_style('bootstrap-css', '//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css');
    // 加载Bootstrap Table CSS
    wp_enqueue_style('bootstrap-table-css', 'https://example.com/assets/bootstrap-table/bootstrap-table.css');
    
    // 加载Bootstrap JS，依赖jQuery（WordPress会自动确保jQuery先加载）
    wp_enqueue_script('bootstrap-js', '//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js', array('jquery'), '3.2.0', true);
    // 加载Bootstrap Table JS，依赖jQuery和Bootstrap JS
    wp_enqueue_script('bootstrap-table-js', 'https://example.com/assets/bootstrap-table/bootstrap-table.js', array('jquery', 'bootstrap-js'), '', true);
  }
}
add_action('wp_enqueue_scripts', 'enqueue_bootstrap_table_assets');

把这段代码加到主题的functions.php里，代替原来的头部资源引入代码即可。

内容的提问来源于stack exchange，提问作者user3088202