token.html 5.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182
  1. {extend name="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="请输入签发组织"
  12. class="layui-input" {notempty name="$config.iss" } value="{$config.iss}" {/notempty}>
  13. </td>
  14. <td class="layui-td-gray-2">Token签发作者
  15. </td>
  16. <td>
  17. <input type="text" name="aud" autocomplete="off" placeholder="请输入签发作者" lay-reqText="请输入签发作者"
  18. class="layui-input" {notempty name="$config.aud" } value="{$config.aud}" {/notempty}>
  19. </td>
  20. </tr>
  21. <tr>
  22. <td class="layui-td-gray">Token Secrect</td>
  23. <td>
  24. <input type="text" name="secrect" autocomplete="off" placeholder="请输入secrect" lay-reqText="请输入secrect"
  25. class="layui-input" {notempty name="$config.secrect" } value="{$config.secrect}" {/notempty}>
  26. </td>
  27. <td class="layui-td-gray">Token过期时间
  28. </td>
  29. <td>
  30. <input type="text" name="exptime" autocomplete="off" placeholder="请输入过期时间" lay-reqText="请输入过期时间"
  31. class="layui-input" {notempty name="$config.exptime" } value="{$config.exptime}" {/notempty}>
  32. </td>
  33. </tr>
  34. </table>
  35. <div style="padding:20px 0;">
  36. <span class="layui-btn layui-btn-sm" onclick="testReg();">Api测试注册</span>
  37. <span class="layui-btn layui-btn-sm" onclick="testLogin();">Api测试登录</span>
  38. <span class="layui-btn layui-btn-sm" onclick="testToken();">Token测试</span>
  39. </div>
  40. <div style="padding:12px 0;word-wrap:break-word">
  41. 测试结果:
  42. <div id="res"></div>
  43. </div>
  44. <div class="p-y3">
  45. <button class="layui-btn layui-btn-normal" lay-submit="" lay-filter="webform">立即提交</button>
  46. <button type="reset" class="layui-btn layui-btn-primary">重置</button>
  47. </div>
  48. </form>
  49. {/block}
  50. <!-- /主体 -->
  51. <!-- 脚本 -->
  52. {block name="script"}
  53. <script>
  54. const moduleInit = ['tool'];
  55. function gouguInit() {
  56. var form = layui.form, tool = layui.tool;
  57. //监听提交
  58. form.on('submit(webform)', function (data) {
  59. let callback = function (e) {
  60. layer.msg(e.msg);
  61. if (e.code == 0) {
  62. parent.layui.tool.close(1000);
  63. }
  64. }
  65. tool.post("/admin/conf/edit", data.field, callback);
  66. return false;
  67. });
  68. }
  69. var token = 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpc3MiOiJhcGkuZ291Z3VjbXMuY29tIiwiYXVkIjoiZ291Z3VjbXMiLCJpYXQiOjE2MjczMTY1MTgsImV4cCI6MTYyNzMyMDExOCwidWlkIjoxfQ.3soLDbwrEqn4EZtpD4h05FmvmMtJEh1LtE1vZ_ANcnI';
  70. function testToken() {
  71. $.ajax({
  72. headers: {
  73. Token: token
  74. },
  75. url: "/api/index/demo",
  76. type: "get",
  77. success: function (res) {
  78. $('#res').html(JSON.stringify(res));
  79. if (res.code == 111) {
  80. layer.msg(res.msg);
  81. }
  82. }
  83. });
  84. }
  85. function testReg() {
  86. var content = '<form class="layui-form" style="width:400px"><div style="padding:10px 15px">\
  87. <p style="padding:10px 0">用户名:</p>\
  88. <p><input name="username" type="text" class="layui-input" value=""/></p>\
  89. <p style="padding:10px 0">密 码:</p>\
  90. <p><input name="password" type="password" class="layui-input" value=""/></p>\
  91. <p style="padding:10px 0">重复密码:</p>\
  92. <p><input name="newpassword" type="password" class="layui-input" value=""/></p>\
  93. </div>\
  94. </form>';
  95. layer.open({
  96. type: 1,
  97. title: 'API测试用户注册',
  98. area: ['432px', '360px'],
  99. content: content,
  100. btnAlign: 'c',
  101. btn: ['注册'],
  102. yes: function (idx) {
  103. var username = $('[name="username"]').val();
  104. var password = $('[name="password"]').val();
  105. var newpassword = $('[name="newpassword"]').val();
  106. if (username == '') {
  107. layer.msg('请填写用户名');
  108. return;
  109. }
  110. if (password == '') {
  111. layer.msg('请填写密码');
  112. return;
  113. }
  114. if (password != newpassword) {
  115. layer.msg('两次密码填写不一致');
  116. return;
  117. }
  118. $.ajax({
  119. url: "/api/index/reg",
  120. type: 'post',
  121. data: { username: username, pwd: password },
  122. success: function (res) {
  123. $('#res').html(JSON.stringify(res));
  124. layer.msg(res.msg);
  125. if (res.code == 0) {
  126. layer.close(idx);
  127. }
  128. }
  129. })
  130. }
  131. })
  132. }
  133. function testLogin() {
  134. var content = '<form class="layui-form" style="width:400px"><div style="padding:10px 15px">\
  135. <p style="padding:10px 0">用户名:</p>\
  136. <p><input name="username" type="text" class="layui-input" value="hdm58"/></p>\
  137. <p style="padding:10px 0">密 码:</p>\
  138. <p><input name="password" type="password" class="layui-input" value="123456"/></p>\
  139. </div>\
  140. </form>';
  141. layer.open({
  142. type: 1,
  143. title: 'API测试用户登录',
  144. area: ['432px', '300px'],
  145. content: content,
  146. btnAlign: 'c',
  147. btn: ['登录'],
  148. yes: function (idx) {
  149. var username = $('[name="username"]').val();
  150. var password = $('[name="password"]').val();
  151. if (username == '') {
  152. layer.msg('请填写用户名');
  153. return;
  154. }
  155. if (password == '') {
  156. layer.msg('请填写密码');
  157. return;
  158. }
  159. $.ajax({
  160. url: "/api/index/login",
  161. type: 'post',
  162. data: { username: username, password: password },
  163. success: function (res) {
  164. $('#res').html(JSON.stringify(res));
  165. layer.msg(res.msg);
  166. if (res.code == 0) {
  167. token = res.data.token;
  168. layer.close(idx);
  169. }
  170. }
  171. })
  172. }
  173. })
  174. }
  175. </script>
  176. {/block}
  177. <!-- /脚本 -->