index.html 9.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148
  1. <!DOCTYPE HTML>
  2. <html lang="zh-CN">
  3. <head>
  4. <title>信息编解码工具</title>
  5. <meta charset="UTF-8">
  6. <link rel="shortcut icon" href="../static/img/favicon.ico">
  7. <link rel="stylesheet" href="index.css" />
  8. <script type="text/javascript" src="../static/vendor/evalCore.min.js"></script>
  9. <script type="text/javascript" src="../static/vendor/vue/vue.js"></script>
  10. </head>
  11. <body>
  12. <div class="wrapper" id="pageContainer">
  13. <div class="panel panel-default" style="margin-bottom: 0px;">
  14. <div class="panel-heading">
  15. <h3 class="panel-title">
  16. <a href="https://fehelper.com" target="_blank" class="x-a-high">
  17. <img src="../static/img/fe-16.png" alt="fehelper"/> FeHelper</a>:信息编解码工具
  18. <a href="#" class="x-donate-link" @click="openDonateModal($event)"><i class="nav-icon">❤&nbsp;</i>打赏鼓励</a>
  19. <a class="x-other-tools" @click="openOptionsPage($event)"><i class="icon-plus-circle"></i> 探索更多实用工具 <span class="tool-market-badge">工具市场</span></a>
  20. </h3>
  21. </div>
  22. </div>
  23. <div class="panel-body mod-endecode">
  24. <div class="row">
  25. <textarea class="form-control mod-textarea ui-mb-10" id="srcText" ref="srcText" v-model="sourceContent" placeholder="粘贴需要进行转换的字符串"></textarea>
  26. </div>
  27. <div class="row">
  28. <table class="x-opts">
  29. <tr>
  30. <td class="td-label"><label>加密:</label></td>
  31. <td>
  32. <div class="radio ui-d-ib ui-mr-20">
  33. <label><input type="radio" name="codeType" value="uniEncode" v-model="selectedType" @click="convert()">Unicode编码<span class="x-ps">(\u开头)</span></label>
  34. </div>
  35. <div class="radio ui-d-ib ui-mr-20">
  36. <label><input type="radio" name="codeType" value="utf8Encode" v-model="selectedType" @click="convert()">URL编码<span class="x-ps">(%开头)</span></label>
  37. </div>
  38. <div class="radio ui-d-ib ui-mr-20">
  39. <label><input type="radio" name="codeType" value="utf16Encode" v-model="selectedType" @click="convert()">UTF16编码<span class="x-ps">(\x开头)</span></label>
  40. </div>
  41. <div class="radio ui-d-ib ui-mr-20">
  42. <label><input type="radio" name="codeType" value="base64Encode" v-model="selectedType" @click="convert()">Base64编码</label>
  43. </div>
  44. <div class="radio ui-d-ib ui-mr-20">
  45. <label><input type="radio" name="codeType" value="md5Encode" v-model="selectedType" @click="convert()">MD5计算</label>
  46. </div>
  47. <div class="radio ui-d-ib ui-mr-20">
  48. <label><input type="radio" name="codeType" value="hexEncode" v-model="selectedType" @click="convert()">十六进制编码</label>
  49. </div>
  50. <div class="radio ui-d-ib ui-mr-20">
  51. <label><input type="radio" name="codeType" value="sha1Encode" v-model="selectedType" @click="convert()">Sha1加密</label>
  52. </div>
  53. <div class="radio ui-d-ib ui-mr-20">
  54. <label><input type="radio" name="codeType" value="htmlEntityEncode" v-model="selectedType" @click="convert()">HTML普通编码</label>
  55. </div>
  56. <div class="radio ui-d-ib ui-mr-20">
  57. <label><input type="radio" name="codeType" value="htmlEntityFullEncode" v-model="selectedType" @click="convert()">HTML深度编码</label>
  58. </div>
  59. <div class="radio ui-d-ib ui-mr-20">
  60. <label><input type="radio" name="codeType" value="html2js" v-model="selectedType" @click="convert()">HTML转JS</label>
  61. </div>
  62. <div class="radio ui-d-ib ui-mr-20">
  63. <label><input type="radio" name="codeType" value="gzipEncode" v-model="selectedType" @click="convert()">Gzip压缩</label>
  64. </div>
  65. </td>
  66. </tr>
  67. <tr>
  68. <td class="td-label"><label>解密:</label></td>
  69. <td>
  70. <div class="radio ui-d-ib ui-mr-20">
  71. <label><input type="radio" name="codeType" value="uniDecode" v-model="selectedType" @click="convert()">Unicode解码<span class="x-ps">(\u开头)</span></label>
  72. </div>
  73. <div class="radio ui-d-ib ui-mr-20">
  74. <label><input type="radio" name="codeType" value="utf8Decode" v-model="selectedType" @click="convert()">URL解码<span class="x-ps">(%开头)</span></label>
  75. </div>
  76. <div class="radio ui-d-ib ui-mr-20">
  77. <label><input type="radio" name="codeType" value="utf16Decode" v-model="selectedType" @click="convert()">UTF16解码<span class="x-ps">(\x开头)</span></label>
  78. </div>
  79. <div class="radio ui-d-ib ui-mr-20">
  80. <label><input type="radio" name="codeType" value="base64Decode" v-model="selectedType" @click="convert()">Base64解码</label>
  81. </div>
  82. <div class="radio ui-d-ib ui-mr-20">
  83. <label><input type="radio" name="codeType" value="hexDecode" v-model="selectedType" @click="convert()">十六进制解码</label>
  84. </div>
  85. <div class="radio ui-d-ib ui-mr-20">
  86. <label><input type="radio" name="codeType" value="htmlEntityDecode" v-model="selectedType" @click="convert()">HTML实体解码</label>
  87. </div>
  88. <div class="radio ui-d-ib ui-mr-20">
  89. <label><input type="radio" name="codeType" value="urlParamsDecode" v-model="selectedType" @click="convert()">URL参数解析</label>
  90. </div>
  91. <div class="radio ui-d-ib ui-mr-20">
  92. <label><input type="radio" name="codeType" value="jwtDecode" v-model="selectedType" @click="convert()">JWT解码</label>
  93. </div>
  94. <div class="radio ui-d-ib ui-mr-20">
  95. <label><input type="radio" name="codeType" value="cookieDecode" v-model="selectedType" @click="convert()">Cookie格式化</label>
  96. </div>
  97. <div class="radio ui-d-ib ui-mr-20">
  98. <label><input type="radio" name="codeType" value="gzipDecode" v-model="selectedType" @click="convert()">Gzip解压</label>
  99. </div>
  100. </td>
  101. </tr>
  102. </table>
  103. </div>
  104. <div class="row">
  105. <span class="x-btns">
  106. <input id="btnCodeChange" class="btn btn-sm btn-success" type="button" value="转换" @click="convert()">
  107. <input id="btnCodeClear" class="btn btn-sm btn-warning ui-ml-10" type="button" value="清空" @click="clear()">
  108. </span>
  109. </div>
  110. <div id="rst" class="row ui-mt-20" v-show="resultContent.length || urlResult">
  111. <h5>当前数据解析结果如下:</h5>
  112. <textarea class="form-control mod-textarea" id="rstCode" ref="rstCode" v-model="resultContent" @mouseover="getResult()" v-if="!urlResult"></textarea>
  113. <div class="x-url-infos" v-if="urlResult">
  114. <ul>
  115. <li><b>协议</b>:<span>{{urlResult.protocol}}</span></li>
  116. <li><b>域名</b>:<span>{{urlResult.hostname}}</span></li>
  117. <li><b>路径</b>:<span>{{urlResult.pathname}}</span></li>
  118. <li>
  119. <table class="table table-bordered table-hover ui-mt-10">
  120. <tr>
  121. <thead>
  122. <th>参数Key</th>
  123. <th>参数Value</th>
  124. </thead>
  125. </tr>
  126. <tr v-for="item in urlResult.params">
  127. <td>{{item[0]}}</td>
  128. <td>{{item[1]}}</td>
  129. </tr>
  130. </table>
  131. </li>
  132. </ul>
  133. </div>
  134. </div>
  135. </div>
  136. </div>
  137. <script type="text/javascript" src="he.js"></script>
  138. <script src="../static/vendor/jquery/jquery-3.3.1.min.js"></script>
  139. <script type="module" src="index.js"></script>
  140. </body>
  141. </html>