当BootstrapTable使用POST请求时，如何添加CSRF Token？

给BootstrapTable的POST请求加CSRF Token有几种简单的实现方式，结合你的代码给你具体修改方案：

方法1：直接在表格HTML属性中配置请求头 #

修改你的<table>标签，新增data-headers属性，将CSRF Token注入到请求头中：

<table
          id="table"
          data-toolbar="#toolbar"
          data-search="true"
          data-search-class="rounded-0"
          data-buttons-class="secondary rounded-0"
          data-show-refresh="true"
          data-show-toggle="true"
          data-show-fullscreen="true"
          data-show-columns="true"
          data-show-columns-toggle-all="true"
          data-show-pagination-switch="true"
          data-pagination="true"
          data-page-size="5" 
          data-method="post"
          data-url="<?=base_url();?>/getdata"
          data-headers='{"X-CSRF-Token": "<?=csrf_token();?>"}'>
</table>

注：X-CSRF-Token是后端约定的请求头字段名，需根据你所用后端框架的要求调整（比如部分框架用X-XSRF-TOKEN）；如果后端要求将token放到POST参数中，也可以改用data-query-params属性传递。

方法2：在JS初始化配置中添加AJAX选项 #

如果更倾向于用JS控制配置，在initTable函数的BootstrapTable配置项里加入ajaxOptions，可选择设置请求头或直接传递POST参数：

function initTable() {
  $table.bootstrapTable('destroy').bootstrapTable({
    columns: [
      [{
        field: 'id',
        title: 'ID',
      },{
        field: 'name',
        title: 'Name',
      }]
    ],
    // 新增AJAX配置
    ajaxOptions: {
      headers: {
        // 两种获取token的方式二选一：
        'X-CSRF-Token': '<?=csrf_token();?>' // 直接从后端输出
        // 'X-CSRF-Token': $('meta[name="csrf-token"]').attr('content') // 从页面meta标签获取
      }
      // 若后端要求token放在POST参数里，替换为以下配置：
      // data: {
      //   csrf_token: '<?=csrf_token();?>'
      // }
    }
  })
}

方法3：全局配置所有BootstrapTable请求 #

如果项目中有多个表格需要添加CSRF Token，可以全局设置默认AJAX选项，避免重复配置：

$(function() {
  // 全局设置BootstrapTable的AJAX请求头
  $.fn.bootstrapTable.defaults.ajaxOptions = {
    headers: {
      'X-CSRF-Token': $('meta[name="csrf-token"]').attr('content') || '<?=csrf_token();?>'
    }
  };
  initTable();
})

注意事项 #

• 确保后端能正确识别并验证你传递的CSRF Token，字段名和验证逻辑需前后端保持一致；
• 若使用meta标签存储token，需在页面头部添加对应标签：<meta name="csrf-token" content="你的CSRF Token值">（可由后端渲染输出）。

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