前言
ThinkPHP出于安全的考慮增加了表單令牌Token，由于通過Ajax異步更新數(shù)據(jù)僅僅部分頁面刷新數(shù)據(jù)，就導(dǎo)致了令牌Token不能得到更新，緊接著的第二次新建或更新數(shù)據(jù)（提交表單時(shí)）失敗——不能通過令牌的驗(yàn)證。
當(dāng)然了，最簡(jiǎn)單的辦法就是刷新整個(gè)頁面，就導(dǎo)致了異步刷新的無意義！在網(wǎng)上搜尋了很多，有好幾種方法；看完覺得有一個(gè)最好：
Ajax異步動(dòng)態(tài)請(qǐng)求創(chuàng)建新令牌并更新到本地
主要思路：在每次發(fā)送表單結(jié)束后（不管成功與否）通過Ajax異步請(qǐng)求一個(gè)新的表單令牌并保存到表單隱藏域中，下次提交表單就使用新的表單令牌去通過。
最終的效果如下：
V2.5.0.png
主要分成三步：
第一步：在Index控制器下創(chuàng)建生成Token的方法
之所以選擇在Index控制器下創(chuàng)建，主要考慮在整個(gè)admin（后臺(tái)）可以方便的引用該方法，不需要每次都根據(jù)控制器找尋相應(yīng)的方法。也就是說，該方法其他控制器都可以引用！
?php
namespace app\admin\controller;
use think\Controller;
class Index extends Valid {
// 生成token函數(shù)
public function getToken() {
$request = \think\facade\Request::instance();
echo $request->token();
}
}
第二步：在Javascript中創(chuàng)建Ajax獲取新令牌
由于后臺(tái)生成新令牌的地址已經(jīng)固定了，也就是：
/admin/Index/，因此通過jQuery的Get方法容易獲取該令牌！
// 獲取新Token并更新
function getNewToken() {
$.get("/admin/Index/getToken", function(data) {
document.getElementById("__token__").value = data;
});
}
第三步：在Html頁面中創(chuàng)建隱藏域保存令牌
其實(shí)在ThinkPHP的表單示例代碼中已經(jīng)有了該代碼。頁面第一次加載時(shí)的令牌Token是隨著頁面分配的，后面的令牌就是通過Ajax獲取的！
!-- 隱藏區(qū)域 -->
input type="hidden" id="__token__" name="__token__" value="{$Request.token}" />
最后，我們就可以在javascript的相應(yīng)提交表單的地方增加語句申請(qǐng)新令牌了！舉例，下面的示例代碼在提交后不管成功與否都申請(qǐng)了新的令牌。
/**
* Ajax動(dòng)態(tài)更新數(shù)據(jù)并異步刷新頁面
* @Author DuDongHua
* @DateTime 2018-04-28T21:21:23+0800
* @param {對(duì)象} Button 表單按鈕對(duì)象
* @param {文本} Modal 模塊
* @param {文本} Controller 控制器
* @param {文本} Action 方法
* @param {文本} Location Ajax加載頁面的位置id
* 使用方法：表單對(duì)象不用提交的任何設(shè)置，提交假按鈕a>設(shè)置onclick即可
* 注意：
* 1. 在javascript中拼接Thinkphp5的URL地址，不需要"{:url('" + Modal + "/" + Controller + "/" + Page + "')}方法
* 只需要直接拼接地址即可，如：var MeURL = '/'+Modal+'/'+Controller+'/'+Page;
*/
function EditData(Button,Modal,Controller,Action,Location,Page){
// 設(shè)置默認(rèn)參數(shù)
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); //打開加載圖標(biāo)
// 異步請(qǐng)求數(shù)據(jù)
$.ajax({
url: '/'+Modal+'/'+Controller+'/'+Action,
type: 'POST',
data: $(Button).closest("form").serialize(), //表單序列化
dataType: 'json',
success: function(data){
// 更新頁面并提示
// window.location.reload(); //當(dāng)加載整個(gè)頁面時(shí)有效但ajax更新時(shí)加載到主頁
loadAjaxHTML(MeURL,Location);
showMsg(data.msg);
setLoaderIn(false); //關(guān)閉加載圖標(biāo)
getNewToken(); // 獲取新Token
},
error:function(XMLHttpRequest, textStatus, errorThrown){
showMsg(XMLHttpRequest.status+" "+XMLHttpRequest.readyState,textStatus,"red","#f60");
getNewToken(); // 獲取新Token
}
});
}
總結(jié)
以上就是這篇文章的全部?jī)?nèi)容了，希望本文的內(nèi)容對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，謝謝大家對(duì)腳本之家的支持。
您可能感興趣的文章:- thinkphp框架使用JWTtoken的方法詳解
- PHP token驗(yàn)證生成原理實(shí)例分析
- thinkphp5框架API token身份驗(yàn)證功能示例
- php獲取微信基礎(chǔ)接口憑證Access_token
- PHP實(shí)現(xiàn)防止表單重復(fù)提交功能【基于token驗(yàn)證】
- PHP中token的生成案例
