优化OnlyOffice文档加载逻辑,移除重复脚本加载检查,新增获取URL参数的功能,调整文档ID生成方式,确保用户ID唯一性。
This commit is contained in:
parent
579fed2e69
commit
91107e2f85
@ -3,18 +3,13 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
import { onMounted } from 'vue'
|
import { ref, onMounted } from 'vue'
|
||||||
import { useRoute } from 'vue-router'
|
|
||||||
|
|
||||||
const route = useRoute()
|
const placeholderRef = ref(null)
|
||||||
|
|
||||||
// 动态加载 OnlyOffice API 脚本(防止重复加载)
|
// 动态加载 OnlyOffice API 脚本
|
||||||
function loadScript(src) {
|
function loadScript(src) {
|
||||||
return new Promise((resolve, reject) => {
|
return new Promise((resolve, reject) => {
|
||||||
if (document.querySelector(`script[src="${src}"]`)) {
|
|
||||||
resolve()
|
|
||||||
return
|
|
||||||
}
|
|
||||||
const script = document.createElement('script')
|
const script = document.createElement('script')
|
||||||
script.type = 'text/javascript'
|
script.type = 'text/javascript'
|
||||||
script.src = src
|
script.src = src
|
||||||
@ -24,6 +19,14 @@ function loadScript(src) {
|
|||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 获取 URL 参数
|
||||||
|
function getUrlParameter(name) {
|
||||||
|
name = name.replace(/[\[]/, '\\[').replace(/[\]]/, '\\]')
|
||||||
|
const regex = new RegExp('[\\?&]' + name + '=([^&#]*)')
|
||||||
|
const results = regex.exec(window.location.search)
|
||||||
|
return results === null ? '' : decodeURIComponent(results[1].replace(/\+/g, ' '))
|
||||||
|
}
|
||||||
|
|
||||||
// 判断文件类型
|
// 判断文件类型
|
||||||
function getDocumentTypes(url) {
|
function getDocumentTypes(url) {
|
||||||
const extension = url.split('.').pop().toLowerCase()
|
const extension = url.split('.').pop().toLowerCase()
|
||||||
@ -39,20 +42,16 @@ function getDocumentTypes(url) {
|
|||||||
return types[extension] || { fileType: 'docx', documentType: 'word' }
|
return types[extension] || { fileType: 'docx', documentType: 'word' }
|
||||||
}
|
}
|
||||||
|
|
||||||
// 动态插入 CSP meta
|
onMounted(async () => {
|
||||||
function insertCSPMeta() {
|
// 动态插入 Content-Security-Policy meta 标签,只在本页面生效
|
||||||
if (!document.querySelector('meta[http-equiv="Content-Security-Policy"]')) {
|
if (!document.querySelector('meta[http-equiv="Content-Security-Policy"]')) {
|
||||||
const meta = document.createElement('meta')
|
const meta = document.createElement('meta')
|
||||||
meta.httpEquiv = 'Content-Security-Policy'
|
meta.httpEquiv = 'Content-Security-Policy'
|
||||||
meta.content = 'upgrade-insecure-requests'
|
meta.content = 'upgrade-insecure-requests'
|
||||||
document.head.appendChild(meta)
|
document.head.appendChild(meta)
|
||||||
}
|
}
|
||||||
}
|
|
||||||
|
|
||||||
onMounted(async () => {
|
|
||||||
insertCSPMeta()
|
|
||||||
await loadScript('https://onlyoffice.fontree.cn/web-apps/apps/api/documents/api.js')
|
await loadScript('https://onlyoffice.fontree.cn/web-apps/apps/api/documents/api.js')
|
||||||
const url = route.query.url
|
const url = getUrlParameter('url')
|
||||||
if (!url) {
|
if (!url) {
|
||||||
alert('请提供文档 URL 参数')
|
alert('请提供文档 URL 参数')
|
||||||
return
|
return
|
||||||
@ -63,7 +62,7 @@ onMounted(async () => {
|
|||||||
new window.DocsAPI.DocEditor('office-div', {
|
new window.DocsAPI.DocEditor('office-div', {
|
||||||
document: {
|
document: {
|
||||||
fileType,
|
fileType,
|
||||||
key: `doc_${fileName}_${Date.now()}`,
|
key: 'doc_' + Math.random().toString(36).substring(2, 15) + Math.random().toString(36).substring(2, 15),
|
||||||
title: fileName,
|
title: fileName,
|
||||||
url
|
url
|
||||||
},
|
},
|
||||||
@ -72,7 +71,7 @@ onMounted(async () => {
|
|||||||
mode: 'view',
|
mode: 'view',
|
||||||
lang: 'zh-CN',
|
lang: 'zh-CN',
|
||||||
user: {
|
user: {
|
||||||
id: 'user_' + Date.now(),
|
id: 'user_' + new Date().getTime(),
|
||||||
name: '访客用户'
|
name: '访客用户'
|
||||||
},
|
},
|
||||||
customization: {
|
customization: {
|
||||||
|
Loading…
Reference in New Issue
Block a user