JWT 解码工具页面index.html脚本运行效果如下页面index.html!DOCTYPE htmlhtmllangzh-CNheadmetacharsetUTF-8metanameviewportcontentwidthdevice-width, initial-scale1.0titleKeycloak JWT 解码工具/titlescriptsrchttps://cdn.tailwindcss.com/scriptlinkrelstylesheethrefhttps://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.cssscriptsrchttps://cdnjs.cloudflare.com/ajax/libs/jsrsasign/8.0.20/jsrsasign-all-min.js/script/headbodyclassbg-gradient-to-br from-blue-50 to-indigo-100 min-h-screendivclasscontainer mx-auto px-4 py-8 max-w-4xlheaderclasstext-center mb-12h1classtext-4xl font-bold text-gray-800 mb-2Keycloak JWT 解码工具/h1pclasstext-gray-600解码和验证 Keycloak 生成的 JWT 令牌/p/headermaindivclassbg-white rounded-xl shadow-lg p-6 mb-8divclassmb-6labelforjwt-tokenclassblock text-sm font-medium text-gray-700 mb-2iclassfas fa-key mr-2/iJWT 令牌/labeltextareaidjwt-tokenrows4classw-full px-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 transitionplaceholder请输入完整的 JWT 令牌.../textarea/divdivclassflex flex-wrap gap-4 mb-6buttononclickdecodeJWT()classflex-1 bg-blue-600 hover:bg-blue-700 text-white font-semibold py-3 px-6 rounded-lg transition transform hover:scale-105iclassfas fa-unlock-alt mr-2/i解码令牌/buttonbuttononclickclearFields()classflex-1 bg-gray-500 hover:bg-gray-600 text-white font-semibold py-3 px-6 rounded-lg transitioniclassfas fa-trash-alt mr-2/i清空/button/div/divdividresult-sectionclasshiddendivclassgrid grid-cols-1 md:grid-cols-2 gap-6 mb-8divclassbg-white rounded-xl shadow-lg p-6h2classtext-xl font-bold text-gray-800 mb-4 flex items-centericlassfas fa-id-card mr-2 text-blue-600/i头部信息(Header)/h2preidheader-outputclassbg-gray-50 p-4 rounded-lg overflow-x-auto text-sm/pre/divdivclassbg-white rounded-xl shadow-lg p-6h2classtext-xl font-bold text-gray-800 mb-4 flex items-centericlassfas fa-user-circle mr-2 text-green-600/i负载信息(Payload)/h2preidpayload-outputclassbg-gray-50 p-4 rounded-lg overflow-x-auto text-sm/pre/div/divdivclassbg-white rounded-xl shadow-lg p-6 mb-8h2classtext-xl font-bold text-gray-800 mb-4 flex items-centericlassfas fa-shield-alt mr-2 text-purple-600/i令牌信息/h2divclassgrid grid-cols-1 md:grid-cols-3 gap-4divclassbg-blue-50 p-4 rounded-lgpclasstext-sm text-gray-600颁发者(iss)/ppidissuerclassfont-semibold text-gray-800 truncate/p/divdivclassbg-green-50 p-4 rounded-lgpclasstext-sm text-gray-600受众(aud)/ppidaudienceclassfont-semibold text-gray-800 truncate/p/divdivclassbg-yellow-50 p-4 rounded-lgpclasstext-sm text-gray-600过期时间(exp)/ppidexpires-atclassfont-semibold text-gray-800/p/div/div/divdivclassbg-white rounded-xl shadow-lg p-6h2classtext-xl font-bold text-gray-800 mb-4 flex items-centericlassfas fa-check-circle mr-2 text-red-600/i验证状态/h2dividvalidation-resultclassp-4 rounded-lgpclasstext-center text-gray-600请先解码令牌以查看验证结果/p/div/div/div/mainfooterclassmt-12 text-center text-gray-600 text-smp©2026Keycloak JWT 解码工具 - 专为 Keycloak 令牌调试而设计/p/footer/divscriptsrcscript.js/script/body/html脚本/** * JWT 解码工具 JavaScript 实现 */// 解码 JWT 令牌functiondecodeJWT(){constjwtTokendocument.getElementById(jwt-token).value.trim();if(!jwtToken){alert(请输入有效的 JWT 令牌);return;}try{// 分割 JWT 令牌constpartsjwtToken.split(.);if(parts.length!3){thrownewError(无效的 JWT 令牌格式);}// 解码头部和负载constheaderJSON.parse(atob(parts[0]));constpayloadJSON.parse(atob(parts[1].replace(/-/g,).replace(/_/g,/)));// 显示解码结果displayDecodedJWT(header,payload);// 验证令牌validateToken(payload);// 显示结果区域document.getElementById(result-section).classList.remove(hidden);}catch(error){alert(解码失败:${error.message});}}// 显示解码后的 JWT 信息functiondisplayDecodedJWT(header,payload){// 显示头部信息document.getElementById(header-output).textContentJSON.stringify(header,null,2);// 显示负载信息document.getElementById(payload-output).textContentJSON.stringify(payload,null,2);// 显示令牌信息document.getElementById(issuer).textContentpayload.iss||N/A;document.getElementById(audience).textContentArray.isArray(payload.aud)?payload.aud.join(, ):(payload.aud||N/A);// 格式化过期时间if(payload.exp){constexpDatenewDate(payload.exp*1000);document.getElementById(expires-at).textContentexpDate.toLocaleString(zh-CN);}else{document.getElementById(expires-at).textContentN/A;}}// 验证令牌functionvalidateToken(payload){constnowMath.floor(Date.now()/1000);constresultElementdocument.getElementById(validation-result);// 检查是否过期if(payload.exppayload.expnow){resultElement.innerHTMLdiv classtext-center i classfas fa-times-circle text-red-500 text-3xl mb-2/i p classfont-semibold text-red-600令牌已过期/p p classtext-sm text-gray-600 mt-1过期时间:${newDate(payload.exp*1000).toLocaleString(zh-CN)}/p /div;resultElement.classNamebg-red-50 border-l-4 border-red-500 p-4 rounded-lg;return;}// 检查是否生效if(payload.nbfpayload.nbfnow){resultElement.innerHTMLdiv classtext-center i classfas fa-clock text-yellow-500 text-3xl mb-2/i p classfont-semibold text-yellow-600令牌尚未生效/p p classtext-sm text-gray-600 mt-1生效时间:${newDate(payload.nbf*1000).toLocaleString(zh-CN)}/p /div;resultElement.classNamebg-yellow-50 border-l-4 border-yellow-500 p-4 rounded-lg;return;}// 令牌有效resultElement.innerHTMLdiv classtext-center i classfas fa-check-circle text-green-500 text-3xl mb-2/i p classfont-semibold text-green-600令牌有效/p p classtext-sm text-gray-600 mt-1${payload.exp?将在${Math.floor((payload.exp-now)/60)}分钟后过期:无过期时间}/p /div;resultElement.classNamebg-green-50 border-l-4 border-green-500 p-4 rounded-lg;}// 清空输入和结果functionclearFields(){document.getElementById(jwt-token).value;document.getElementById(result-section).classList.add(hidden);document.getElementById(validation-result).innerHTMLp classtext-center text-gray-600请先解码令牌以查看验证结果/p;document.getElementById(validation-result).className;}运行效果如下运行效果如下测试TOKENtoken如下:eyJhbGciOiJSUzI1NiIsInR5cCIgOiAiSldUIiwia2lkIiA6ICJNVWNPLWJ1QVY4SWxrWUJNSUlwM3pldUIxYU9iUl94Nm9FZ256NmwyYlowIn0.eyJleHAiOjE3NjkzMDUxMDEsImlhdCI6MTc2OTMwNDgwMCwianRpIjoiNDVhNjBhYjQtOTU1OS00Yjg4LWEzMTAtNDZmODM2YWJiN2Y0IiwiaXNzIjoiaHR0cDovL2tleWNsb2FrLmRlbW9mb3IuY29tLmNuL2F1dGgvcmVhbG1zL2tleWNsb2FrLWxlYXJuIiwiYXVkIjoiYWNjb3VudCIsInN1YiI6ImEwODhlMjcyLThhNGUtNGI2Yi1hMjI0LWM3NjlhODYzNjRjYyIsInR5cCI6IkJlYXJlciIsImF6cCI6ImNoYXB0ZXItMSIsInNlc3Npb25fc3RhdGUiOiJlMDI5YzhkMy03YzA2LTRhMjItOGQyMC1jMjZmY2E2ZjU0MTEiLCJhY3IiOiIxIiwicmVhbG1fYWNjZXNzIjp7InJvbGVzIjpbIm9mZmxpbmVfYWNjZXNzIiwidW1hX2F1dGhvcml6YXRpb24iXX0sInJlc291cmNlX2FjY2VzcyI6eyJhY2NvdW50Ijp7InJvbGVzIjpbIm1hbmFnZS1hY2NvdW50IiwibWFuYWdlLWFjY291bnQtbGlua3MiLCJ2aWV3LXByb2ZpbGUiXX0sImNoYXB0ZXItMSI6eyJyb2xlcyI6WyJ1c2VyIl19fSwic2NvcGUiOiJvcGVuaWQgZW1haWwgcHJvZmlsZSIsImVtYWlsX3ZlcmlmaWVkIjpmYWxzZSwicHJlZmVycmVkX3VzZXJuYW1lIjoidXNlciJ9.XTN-kpc2nGjv6u91M6ONXpk8Nn1VYltaN5MhNOGZn-tXJd4DoCo-ZdpteHGznFF3Vfl3ivMMPeLVZl-Jd6kZNDK4q5WuM1sqCO8F3HM8MRS5iGOQdRhMR2rAb4FWYsonl4mE7w1Znbvr5OsLUoxec3AUEXChnp_2c36xlAPsDwXPdVqR_5SX3CKPqFLI7Ixy90RiMpc8S72wc2ves6XkIX9lLtzOjtKmRsVAv4RKmkkTT-h9_ifMTZNp9jVhf33LjgEjn17JiTVKVEiJj8Xr_48_2ClRrxf7jZ4dfwBmldiZqyzOst9Ww_DLxZHNcJxIFIOFxMIIW3bU0nXiOGZXQg最终解码效果如下