token.html 3.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127
  1. {extend name="../../base/view/common/base" /}
  2. <!-- 主体 -->
  3. {block name="body"}
  4. <form class="layui-form p-4">
  5. <h3 class="pb-3">TOKEN配置</h3>
  6. <table class="layui-table layui-table-form">
  7. <tr>
  8. <td class="layui-td-gray-2">Token签发组织</td>
  9. <td>
  10. <input type="hidden" value="{$id}" name="id">
  11. <input type="text" name="iss" autocomplete="off" placeholder="请输入签发组织" lay-reqText="请输入签发组织" class="layui-input" value="{$config.iss|default=''}">
  12. </td>
  13. <td class="layui-td-gray-2">Token签发作者</td>
  14. <td>
  15. <input type="text" name="aud" autocomplete="off" placeholder="请输入签发作者" lay-reqText="请输入签发作者" class="layui-input" value="{$config.aud|default=''}">
  16. </td>
  17. </tr>
  18. <tr>
  19. <td class="layui-td-gray">Token Secrect</td>
  20. <td>
  21. <input type="text" name="secrect" autocomplete="off" placeholder="请输入secrect" lay-reqText="请输入secrect" class="layui-input" value="{$config.secrect|default=''}">
  22. </td>
  23. <td class="layui-td-gray">Token过期时间</td>
  24. <td>
  25. <input type="text" name="exptime" autocomplete="off" placeholder="请输入过期时间" lay-reqText="请输入过期时间" class="layui-input" value="{$config.exptime|default=''}">
  26. </td>
  27. </tr>
  28. </table>
  29. <div class="pt-4">
  30. <button class="layui-btn layui-btn-normal" lay-submit="" lay-filter="webform">立即提交</button>
  31. <button type="reset" class="layui-btn layui-btn-primary">重置</button>
  32. </div>
  33. <div style="padding:30px 0;">
  34. <span class="layui-btn layui-btn-sm" onclick="testLogin();">Api测试登录</span>
  35. <span class="layui-btn layui-btn-sm" onclick="testToken();">Token测试</span>
  36. </div>
  37. <div style="padding:12px 0;word-wrap:break-word">
  38. <p class="red">先点击登录,在点击测试,会有好的结果哦!</p>
  39. 测试结果:
  40. <div id="res"></div>
  41. </div>
  42. </form>
  43. {/block}
  44. <!-- /主体 -->
  45. <!-- 脚本 -->
  46. {block name="script"}
  47. <script>
  48. const moduleInit = ['tool'];
  49. function gouguInit() {
  50. var form = layui.form, tool = layui.tool;
  51. //监听提交
  52. form.on('submit(webform)', function (data) {
  53. let callback = function (e) {
  54. layer.msg(e.msg);
  55. if (e.code == 0) {
  56. tool.sideClose(1000);
  57. }
  58. }
  59. tool.post("/home/conf/edit", data.field, callback);
  60. return false;
  61. });
  62. }
  63. var token = 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpc3MiOiJhcGkuZ291Z3VjbXMuY29tIiwiYXVkIjoiZ291Z3VjbXMiLCJpYXQiOjE2MjczMTY1MTgsImV4cCI6MTYyNzMyMDExOCwidWlkIjoxfQ.3soLDbwrEqn4EZtpD4h05FmvmMtJEh1LtE1vZ_ANcnI';
  64. function testToken() {
  65. $.ajax({
  66. headers: {
  67. Token: token
  68. },
  69. url: "/api/demo/test",
  70. type: "get",
  71. success: function (res) {
  72. $('#res').html(JSON.stringify(res));
  73. if (res.code == 111) {
  74. layer.msg(res.msg);
  75. }
  76. }
  77. });
  78. }
  79. function testLogin() {
  80. var content = '<form class="layui-form" style="width:400px"><div style="padding:10px 15px">\
  81. <p style="padding:10px 0">用户名:</p>\
  82. <p><input name="username" type="text" class="layui-input" value="admin"/></p>\
  83. <p style="padding:10px 0">密 码:</p>\
  84. <p><input name="password" type="password" class="layui-input" value="123456"/></p>\
  85. </div>\
  86. </form>';
  87. layer.open({
  88. type: 1,
  89. title: 'API测试用户登录',
  90. area: ['432px', '300px'],
  91. content: content,
  92. btnAlign: 'c',
  93. btn: ['登录'],
  94. yes: function (idx) {
  95. var username = $('[name="username"]').val();
  96. var password = $('[name="password"]').val();
  97. if (username == '') {
  98. layer.msg('请填写用户名');
  99. return;
  100. }
  101. if (password == '') {
  102. layer.msg('请填写密码');
  103. return;
  104. }
  105. $.ajax({
  106. url: "/api/demo/login",
  107. type: 'post',
  108. data: { username: username, password: password },
  109. success: function (res) {
  110. $('#res').html(JSON.stringify(res));
  111. layer.msg(res.msg);
  112. if (res.code == 0) {
  113. token = res.data.token;
  114. layer.close(idx);
  115. }
  116. }
  117. })
  118. }
  119. })
  120. }
  121. </script>
  122. {/block}
  123. <!-- /脚本 -->