ThinkPHP5.1表单令牌Token失效问题的解决

前言

thinkphp出于安全的考虑增加了表单令牌token，由于通过ajax异步更新数据仅仅部分页面刷新数据，就导致了令牌token不能得到更新，紧接着的第二次新建或更新数据（提交表单时）失败——不能通过令牌的验证。

当然了，最简单的办法就是刷新整个页面，就导致了异步刷新的无意义！在网上搜寻了很多，有好几种方法；看完觉得有一个最好：

ajax异步动态请求创建新令牌并更新到本地
主要思路：在每次发送表单结束后（不管成功与否）通过ajax异步请求一个新的表单令牌并保存到表单隐藏域中，下次提交表单就使用新的表单令牌去通过。

最终的效果如下：

v2.5.0.png

主要分成三步：

第一步：在index控制器下创建生成token的方法

之所以选择在index控制器下创建，主要考虑在整个admin（后台）可以方便的引用该方法，不需要每次都根据控制器找寻相应的方法。也就是说，该方法其他控制器都可以引用！

<?php
namespace app\admin\controller;
use think\controller;

class index extends valid {
 // 生成token函数
 public function gettoken() {
  $request = \think\facade\request::instance();
  echo $request->token();
 }
}

第二步：在javascript中创建ajax获取新令牌

由于后台生成新令牌的地址已经固定了，也就是：
/admin/index/，因此通过jquery的get方法容易获取该令牌！

// 获取新token并更新
function getnewtoken() {
 $.get("/admin/index/gettoken", function(data) {
  document.getelementbyid("__token__").value = data;
 });
}

第三步：在html页面中创建隐藏域保存令牌

其实在thinkphp的表单示例代码中已经有了该代码。页面第一次加载时的令牌token是随着页面分配的，后面的令牌就是通过ajax获取的！

<!-- 隐藏区域 -->
<input type="hidden" id="__token__" name="__token__" value="{$request.token}" />

最后，我们就可以在javascript的相应提交表单的地方增加语句申请新令牌了！举例，下面的示例代码在提交后不管成功与否都申请了新的令牌。

/**
 * ajax动态更新数据并异步刷新页面
 * @author dudonghua
 * @datetime 2018-04-28t21:21:23+0800
 * @param {对象} button  表单按钮对象
 * @param {文本} modal  模块
 * @param {文本} controller 控制器
 * @param {文本} action  方法
 * @param {文本} location ajax加载页面的位置id
 * 使用方法：表单对象不用提交的任何设置，提交假按钮<a>设置onclick即可
 * 注意：
 *  1. 在javascript中拼接thinkphp5的url地址，不需要"{:url('" + modal + "/" + controller + "/" + page + "')}方法
 *   只需要直接拼接地址即可，如：var meurl = '/'+modal+'/'+controller+'/'+page;
 */
function editdata(button,modal,controller,action,location,page){
 // 设置默认参数
 var modal  = arguments[1] ? arguments[1] : "admin";  // 模块名
 var controller = arguments[2] ? arguments[2] : "index";  // 控制器
 var action  = arguments[3] ? arguments[3] : "editdata"; // 方法名
 var location = arguments[4] ? arguments[4] : "content"; // ajax加载页面的位置id
 var page  = arguments[5] ? arguments[5] : "index";  // ajax加载页面控制器中的方法
 // 生成本页面的url用于更新后异步刷新
 var meurl = '/'+modal+'/'+controller+'/'+page;
 setloaderin(true); //打开加载图标
 // 异步请求数据
 $.ajax({
  url: '/'+modal+'/'+controller+'/'+action,
  type: 'post',
  data: $(button).closest("form").serialize(), //表单序列化
  datatype: 'json',
  success: function(data){
   // 更新页面并提示
   // window.location.reload(); //当加载整个页面时有效但ajax更新时加载到主页
   loadajaxhtml(meurl,location);
   showmsg(data.msg);
   setloaderin(false); //关闭加载图标
   getnewtoken();  // 获取新token
  },
  error:function(xmlhttprequest, textstatus, errorthrown){
   showmsg(xmlhttprequest.status+" "+xmlhttprequest.readystate,textstatus,"red","#f60");
   getnewtoken(); // 获取新token
  }
 });
}

总结

以上就是这篇文章的全部内容了，希望本文的内容对大家的学习或者工作具有一定的参考学习价值，谢谢大家对的支持。