index.html 1.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657
  1. <!DOCTYPE html>
  2. <html>
  3. <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
  4. <body>
  5. <div class="custom-mount" style="height: 100%"></div>
  6. </body>
  7. <script src="https://qn.cache.wpscdn.cn/js/jquery-1.9.1.min.js"></script>
  8. <script src="web-office-sdk-v1.1.2.umd.js"></script>
  9. <script src="./jwps.js"></script>
  10. <script>
  11. var wps;
  12. function openFile() {
  13. ;
  14. $.get("/weboffice/url?_w_fname=" + filename, function (result) {
  15. console.log(result);
  16. // url这个样子 : https://wwo.wps.cn/office/w/471eba5030?_w_fname=会议纪要.docx&_w_userid=33&_w_appid=d8f99da
  17. wps = WebOfficeSDK.config({
  18. wpsUrl: result.wpsUrl,
  19. mount: document.querySelector('.custom-mount')
  20. });
  21. wps.setToken({token: result.token});
  22. })
  23. }
  24. async
  25. function exportPdf() {
  26. var result = await
  27. wps.WordApplication().ActiveDocument.ExportAsFixedFormat();
  28. alert(result.url);
  29. }
  30. </script>
  31. <style>
  32. * {
  33. box-sizing: border-box;
  34. }
  35. html,
  36. body {
  37. display: flex;
  38. flex-direction: column;
  39. padding: 0;
  40. margin: 0;
  41. height: 100%;
  42. /* 防止双击缩放 */
  43. touch-action: manipulation;
  44. }
  45. iframe {
  46. flex: 1;
  47. }
  48. </style>
  49. </html>