You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

208 lines
6.5KB

  1. <!DOCTYPE html>
  2. <html>
  3. <meta charset="utf-8">
  4. <script>
  5. var isServerOk = false
  6. var isSetupOk = false
  7. function gotoDemo()
  8. {
  9. if (!isServerOk || !isSetupOk){
  10. alert("环境检测失败,请启动本地服务端")
  11. return
  12. }
  13. window.location.href="http://127.0.0.1:3888/index.html"
  14. }
  15. function envReTest(){
  16. window.document.getElementById("serverTest").innerHTML = ""
  17. window.document.getElementById("setupTest").innerHTML = ""
  18. setTimeout(envTest, 1000);
  19. }
  20. function envTest(){
  21. //1.服务端检测
  22. var xhr =getHttpObj()
  23. xhr.onload=function(e){
  24. isServerOk = true
  25. var result = "1.检测本地服务端(http://127.0.0.1:3888)是否连通:"
  26. window.document.getElementById("serverTest").innerHTML = result + "检测成功,服务端地址为http://127.0.0.1:3888"
  27. }
  28. xhr.onerror=function(e){
  29. isServerOk = false
  30. var result = "1.检测本地服务端(http://127.0.0.1:3888)是否连通:"
  31. window.document.getElementById("serverTest").innerHTML = result + "检测失败, 请先通过node启动StartupServer.js"
  32. }
  33. xhr.open('get', 'http://127.0.0.1:3888/FileList', true)
  34. xhr.send()
  35. //2.安装包检测
  36. var xhr1 =getHttpObj()
  37. xhr1.onload=function(e){
  38. isSetupOk = true
  39. var result = "2.检测wps安装是否正确:"
  40. window.document.getElementById("setupTest").innerHTML = result + xhr1.responseText
  41. }
  42. xhr1.open('get', 'http://127.0.0.1:3888/WpsSetupTest', true)
  43. xhr1.send()
  44. }
  45. function IEVersion() {
  46. var userAgent = navigator.userAgent; //取得浏览器的userAgent字符串
  47. var isIE = userAgent.indexOf("compatible") > -1 && userAgent.indexOf("MSIE") > -1; //判断是否IE<11浏览器
  48. var isEdge = userAgent.indexOf("Edge") > -1 && !isIE; //判断是否IE的Edge浏览器
  49. var isIE11 = userAgent.indexOf('Trident') > -1 && userAgent.indexOf("rv:11.0") > -1;
  50. if (isIE) {
  51. var reIE = new RegExp("MSIE (\\d+\\.\\d+);");
  52. reIE.test(userAgent);
  53. var fIEVersion = parseFloat(RegExp["$1"]);
  54. if (fIEVersion == 7) {
  55. return 7;
  56. } else if (fIEVersion == 8) {
  57. return 8;
  58. } else if (fIEVersion == 9) {
  59. return 9;
  60. } else if (fIEVersion == 10) {
  61. return 10;
  62. } else {
  63. return 6; //IE版本<=7
  64. }
  65. } else if (isEdge) {
  66. return 20; //edge
  67. } else if (isIE11) {
  68. return 11; //IE11
  69. } else {
  70. return 30; //不是ie浏览器
  71. }
  72. }
  73. function getHttpObj() {
  74. var httpobj = null;
  75. if (IEVersion() < 10) {
  76. try {
  77. httpobj = new XDomainRequest();
  78. } catch (e1) {
  79. httpobj = new createXHR();
  80. }
  81. } else {
  82. httpobj = new createXHR();
  83. }
  84. return httpobj;
  85. }
  86. //兼容IE低版本的创建xmlhttprequest对象的方法
  87. function createXHR() {
  88. if (typeof XMLHttpRequest != 'undefined') { //兼容高版本浏览器
  89. return new XMLHttpRequest();
  90. } else if (typeof ActiveXObject != 'undefined') { //IE6 采用 ActiveXObject, 兼容IE6
  91. var versions = [ //由于MSXML库有3个版本,因此都要考虑
  92. 'MSXML2.XMLHttp.6.0',
  93. 'MSXML2.XMLHttp.3.0',
  94. 'MSXML2.XMLHttp'
  95. ];
  96. for (var i = 0; i < versions.length; i++) {
  97. try {
  98. return new ActiveXObject(versions[i]);
  99. } catch (e) {
  100. //跳过
  101. }
  102. }
  103. } else {
  104. throw new Error('您的浏览器不支持XHR对象');
  105. }
  106. }
  107. </script>
  108. <body onload="envTest()">
  109. <div style="display: flex;"><span style="color: #1890ff; margin: 30px auto; font-size: 50px; font-weight: bolder;">OA助手演示Demo</span></div>
  110. <div class="divstyle0" id="envTest">
  111. <span>开始境检测:</span><br>
  112. <span id="serverTest"></span><br>
  113. <span id="setupTest"></span><br>
  114. </div>
  115. <div class="divstyle">
  116. <span class="arrow">&rarr;</span>
  117. <button class="ant-btn" onclick="gotoDemo()">点击开始体验</button>
  118. </div>
  119. <br>
  120. <div><button id="btnEnvTest" onclick="envReTest()">重新开始环境检测</button></div>
  121. <style>
  122. .divstyle0{
  123. border:1px solid black;
  124. height: 300px;
  125. width: 40%;
  126. float: left;
  127. font-size: 15px;
  128. color: dimgray;
  129. }
  130. .divstyle{
  131. height: 300px;
  132. width: 40%;
  133. vertical-align: middle;
  134. display:flex;
  135. align-items:center;
  136. }
  137. .arrow{
  138. font-size: 50px;
  139. color: #1890ff;
  140. font-weight: bolder;
  141. vertical-align: middle;
  142. }
  143. .ant-btn {
  144. vertical-align: middle;
  145. line-height: 1.499;
  146. position: relative;
  147. display: inline-block;
  148. font-weight: 500;
  149. white-space: nowrap;
  150. text-align: center;
  151. background-image: none;
  152. border: 1px solid transparent;
  153. -webkit-box-shadow: 0 2px 0 rgba(0,0,0,0.015);
  154. box-shadow: 0 2px 0 rgba(0,0,0,0.015);
  155. -webkit-transition: all .3s cubic-bezier(.645, .045, .355, 1);
  156. transition: all .3s cubic-bezier(.645, .045, .355, 1);
  157. -webkit-user-select: none;
  158. -moz-user-select: none;
  159. -ms-user-select: none;
  160. user-select: none;
  161. -ms-touch-action: manipulation;
  162. touch-action: manipulation;
  163. height: 50px;
  164. padding: 0 15px;
  165. font-size: 20px;
  166. border-radius: 4px;
  167. color: #fff;
  168. background-color: #1890ff;
  169. border-color: #1890ff;
  170. }
  171. #btnEnvTest {
  172. vertical-align: middle;
  173. margin: 5px;
  174. line-height: 1.499;
  175. position: relative;
  176. display: inline-block;
  177. font-weight: 200;
  178. white-space: nowrap;
  179. text-align: center;
  180. background-image: none;
  181. border: 1px solid transparent;
  182. -webkit-box-shadow: 0 2px 0 rgba(0,0,0,0.015);
  183. box-shadow: 0 2px 0 rgba(0,0,0,0.015);
  184. -webkit-transition: all .3s cubic-bezier(.645, .045, .355, 1);
  185. transition: all .3s cubic-bezier(.645, .045, .355, 1);
  186. -webkit-user-select: none;
  187. -moz-user-select: none;
  188. -ms-user-select: none;
  189. user-select: none;
  190. -ms-touch-action: manipulation;
  191. touch-action: manipulation;
  192. height: 30px;
  193. padding: 0 15px;
  194. font-size: 20px;
  195. border-radius: 4px;
  196. color: #fff;
  197. background-color: #1890ff;
  198. border-color: #1890ff;
  199. }
  200. </style>
  201. </html>