word.html 2.0 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586
  1. <!DOCTYPE html>
  2. <html dir="ltr" mozdisallowselectionprint>
  3. <head>
  4. <meta charset="utf-8">
  5. <title>预览word</title>
  6. <script src="./utils/flexible.js"></script>
  7. <script src="./utils/ui.js"></script>
  8. <script src="./word/jszip.min.js"></script>
  9. <script src="./word/docx-preview.min.js"></script>
  10. <script src="./utils/getQueryVariable.js"></script>
  11. <link rel="stylesheet" href="./style/ui.css" />
  12. </head>
  13. <style type="text/css">
  14. * {
  15. padding: 0;
  16. margin: 0
  17. }
  18. body {
  19. height: 100vh
  20. }
  21. #container {
  22. width: 100%;
  23. height: 100%
  24. }
  25. .office-docx {
  26. height: 100%;
  27. overflow-y: auto
  28. }
  29. .office-docx .docx-wrapper>section.docx {
  30. margin-bottom: 5px
  31. }
  32. @media screen and (max-width:800px) {
  33. .office-docx .docx-wrapper {
  34. padding: 10px
  35. }
  36. .office-docx .docx-wrapper>section.docx {
  37. padding: 10px !important;
  38. width: 100% !important
  39. }
  40. }
  41. </style>
  42. <script>
  43. function fetchBlobFromUrl(r) {
  44. return new Promise((e, o) => {
  45. let n = new XMLHttpRequest;
  46. n.open("GET", r, !0), n.responseType = "blob", n.onload = function() {
  47. 200 === n.status ? e(n.response) : o(new Error("Failed to fetch blob: " + n.statusText))
  48. }, n.onerror = function(e) {
  49. o(new Error(e))
  50. }, n.send()
  51. })
  52. }(async () => {
  53. const loading = createLoading();
  54. loading.show();
  55. var e = await fetchBlobFromUrl(decodeURIComponent(getQueryVariable("file") || ""));
  56. docx.renderAsync(e, document.getElementById("body"), document.getElementById("container"), {
  57. className: "office-docx",
  58. inWrapper: !0,
  59. ignoreWidth: !0,
  60. ignoreHeight: !1,
  61. ignoreFonts: !1,
  62. breakPages: !0,
  63. ignoreLastRenderedPageBreak: !0,
  64. experimental: !1,
  65. trimXmlDeclaration: !0,
  66. useBase64URL: !1,
  67. useMathMLPolyfill: !1,
  68. showChanges: !1,
  69. debug: !1
  70. }).then(e => console.log("docx: finished")).finally(() => {
  71. loading.hide();
  72. });
  73. })()
  74. </script>
  75. <body id="body">
  76. <div id="container"></div>
  77. </body>
  78. </html>