diff --git a/core/core-frontend/config/base.ts b/core/core-frontend/config/base.ts index ddb203e13c..61513f83d1 100644 --- a/core/core-frontend/config/base.ts +++ b/core/core-frontend/config/base.ts @@ -26,6 +26,6 @@ export default { } } }, - sourcemap: true + sourcemap: false } } diff --git a/core/core-frontend/src/pages/panel/main.ts b/core/core-frontend/src/pages/panel/main.ts index 8d1a392fb4..12e82edd70 100644 --- a/core/core-frontend/src/pages/panel/main.ts +++ b/core/core-frontend/src/pages/panel/main.ts @@ -36,7 +36,10 @@ const getPrefix = (): string => { url = ele.src } if (url.includes(suffix)) { - prefix = new URL(url).origin + const { origin, pathname } = new URL(url) + const splitArr = pathname.split('/') + splitArr.pop() + prefix = `${origin}${splitArr.join('/')}` return true } } diff --git a/core/core-frontend/src/permission.ts b/core/core-frontend/src/permission.ts index c514b93ac5..0268984fe1 100644 --- a/core/core-frontend/src/permission.ts +++ b/core/core-frontend/src/permission.ts @@ -23,15 +23,18 @@ const { start, done } = useNProgress() const { loadStart, loadDone } = usePageLoading() const whiteList = ['/login', '/de-link', '/chart-view'] // 不重定向白名单 - +const embeddedWhiteList = ['/dvCanvas', '/dashboard'] router.beforeEach(async (to, from, next) => { start() loadStart() - - if (isMobile() && to.name !== 'link') { + if (isMobile()) { done() loadDone() - window.location.href = window.origin + '/mobile.html#/index' + if (to.name === 'link') { + window.location.href = window.origin + '/mobile.html#' + to.path + } else { + window.location.href = window.origin + '/mobile.html#/index' + } } let isDesktop = wsCache.get('app.desktop') if (isDesktop === null) { @@ -96,7 +99,11 @@ router.beforeEach(async (to, from, next) => { next(nextData) } } else { - if (whiteList.indexOf(to.path) !== -1 || to.path.startsWith('/de-link/')) { + if ( + embeddedWhiteList.includes(to.path) || + whiteList.indexOf(to.path) !== -1 || + to.path.startsWith('/de-link/') + ) { permissionStore.setCurrentPath(to.path) next() } else { diff --git a/core/core-frontend/src/permissionMobile.ts b/core/core-frontend/src/permissionMobile.ts index 23c3b718f6..eae649f924 100644 --- a/core/core-frontend/src/permissionMobile.ts +++ b/core/core-frontend/src/permissionMobile.ts @@ -39,7 +39,7 @@ router.beforeEach(async (to, _, next) => { next() } } else { - if (whiteList.includes(to.path)) { + if (whiteList.includes(to.path) || to.path.includes('/de-link')) { next() } else { next('/login') // 否则全部重定向到登录页 diff --git a/core/core-frontend/src/router/mobile.ts b/core/core-frontend/src/router/mobile.ts index 29ded300f0..7d2e5981a1 100644 --- a/core/core-frontend/src/router/mobile.ts +++ b/core/core-frontend/src/router/mobile.ts @@ -31,6 +31,13 @@ export const routes: AppRouteRecordRaw[] = [ meta: {}, component: () => import('@/views/mobile/panel/index.vue') }, + { + path: '/de-link/:uuid', + name: 'link', + hidden: true, + meta: {}, + component: () => import('@/views/share/link/mobile.vue') + }, { path: '/panel/mobile', name: 'mobile', diff --git a/core/core-frontend/src/store/modules/embedded.ts b/core/core-frontend/src/store/modules/embedded.ts index ab490b8745..65f1bc56a3 100644 --- a/core/core-frontend/src/store/modules/embedded.ts +++ b/core/core-frontend/src/store/modules/embedded.ts @@ -48,6 +48,16 @@ export const userStore = defineStore('embedded', { }, getResourceId(): string { return this.resourceId + }, + getIframeData(): any { + return { + embeddedToken: this.token, + busiFlag: this.busiFlag, + type: this.type, + dvId: this.dvId, + chartId: this.chartId, + pid: this.pid + } } }, actions: { @@ -74,6 +84,14 @@ export const userStore = defineStore('embedded', { }, setResourceId(resourceId: string) { this.resourceId = resourceId + }, + setIframeData(data: any) { + this.type = data['type'] + this.token = data['embeddedToken'] + this.busiFlag = data['busiFlag'] + this.dvId = data['dvId'] + this.chartId = data['chartId'] + this.pid = data['pid'] } } }) diff --git a/core/core-frontend/src/utils/communication.ts b/core/core-frontend/src/utils/communication.ts new file mode 100644 index 0000000000..1a0e32db1a --- /dev/null +++ b/core/core-frontend/src/utils/communication.ts @@ -0,0 +1,77 @@ +export interface EmbeddedData { + 'de-embedded': boolean + embeddedToken?: string + busiFlag?: string + type?: string + dvId?: string + chartId?: string + pid: string +} + +export const communicationInit = cb => { + window.addEventListener('message', event => { + if (!event.data['de-embedded']) { + return + } + const origin = event.origin + console.log(origin) + const embeddedData: EmbeddedData = event.data + // validate origin + if (cb) { + cb(embeddedData) + } + }) + const readyData = { + ready: true, + msgOrigin: 'de-fit2cloud' + } + window.parent.postMessage(readyData, '*') +} + +export const initOpenHandler = (newWindow, data) => { + if (!data.embeddedToken) { + return + } + window['uuid'] = new Date().getTime() + newWindow['uuid'] = window['uuid'] + 1 + newWindow['name'] = 'de-new-resource-window' + window.addEventListener('message', event => { + if ( + event.data?.msgOrigin !== 'de-inner-fit2cloud' || + event.origin !== window.origin || + event.source['uuid'] !== newWindow['uuid'] + ) { + return + } + data['de-inner-embedded'] = true + if (event.data.ready) { + newWindow.postMessage(data, '/') + } + }) +} + +export const newWindowReady = async cb => { + return new Promise((resolve, reject) => { + if (!window.opener || window['name'] !== 'de-new-resource-window') { + return resolve(null) + } + window.addEventListener('message', event => { + if ( + !event.data['de-inner-embedded'] || + event.origin !== window.origin || + window['uuid'] !== event.source['uuid'] - 1 + ) { + return + } + if (cb) { + cb(event.data) + resolve(true) + } + }) + const readyData = { + ready: true, + msgOrigin: 'de-inner-fit2cloud' + } + window.opener.postMessage(readyData, '/') + }) +} diff --git a/core/core-frontend/src/views/chart/ChartView.vue b/core/core-frontend/src/views/chart/ChartView.vue index 61a94f3c44..72bea1e486 100644 --- a/core/core-frontend/src/views/chart/ChartView.vue +++ b/core/core-frontend/src/views/chart/ChartView.vue @@ -3,9 +3,8 @@ import { shallowRef, defineAsyncComponent, ref, onBeforeUnmount } from 'vue' import { debounce } from 'lodash-es' import { useEmbedded } from '@/store/modules/embedded' import { useAppStoreWithOut } from '@/store/modules/app' -import { useRoute } from 'vue-router' import { onBeforeMount } from 'vue' -const route = useRoute() +import { communicationInit, EmbeddedData } from '@/utils/communication' const embeddedStore = useEmbedded() const appStore = useAppStoreWithOut() @@ -37,21 +36,6 @@ const componentMap = { ScreenPanel, DashboardPanel } -const init = () => { - appStore.setIsIframe(true) - const busiFlag = route.query.busiFlag as string - const dvId = route.query.dvId as string - const chartId = route.query.chartId as string - const type = route.query.type as string - const embeddedToken = route.query.embeddedToken as string - embeddedStore.setBusiFlag(busiFlag) - embeddedStore.setToken(embeddedToken) - embeddedStore.setChartId(chartId) - embeddedStore.setDvId(dvId) - embeddedStore.setType(type) - currentComponent.value = componentMap[type || 'ViewWrapper'] -} - const iframeStyle = ref(null) const setStyle = debounce(() => { iframeStyle.value = { @@ -60,9 +44,13 @@ const setStyle = debounce(() => { } }, 300) onBeforeMount(() => { + communicationInit((data: EmbeddedData) => { + embeddedStore.setIframeData(data) + appStore.setIsIframe(true) + currentComponent.value = componentMap[data.type || 'ViewWrapper'] + }) window.addEventListener('resize', setStyle) setStyle() - init() }) onBeforeUnmount(() => { diff --git a/core/core-frontend/src/views/common/DeResourceTree.vue b/core/core-frontend/src/views/common/DeResourceTree.vue index 03b1e86e0a..7a616be3e1 100644 --- a/core/core-frontend/src/views/common/DeResourceTree.vue +++ b/core/core-frontend/src/views/common/DeResourceTree.vue @@ -20,6 +20,7 @@ import DeResourceCreateOptV2 from '@/views/common/DeResourceCreateOptV2.vue' import { useCache } from '@/hooks/web/useCache' import { findParentIdByChildIdRecursive } from '@/utils/canvasUtils' import treeSort from '@/utils/treeSortUtils' +import { initOpenHandler } from '@/utils/communication' const { wsCache } = useCache() const dvMainStore = dvMainStoreWithOut() @@ -294,7 +295,8 @@ const operation = (cmd: string, data: BusiTreeNode, nodeType: string) => { curCanvasType.value === 'dataV' ? `#/dvCanvas?opt=copy&pid=${params.pid}&dvId=${data.data}` : `#/dashboard?opt=copy&pid=${params.pid}&resourceId=${data.data}` - window.open(baseUrl, '_blank') + const newWindow = window.open(baseUrl, '_blank') + initOpenHandler(newWindow, embeddedStore.getIframeData) }) } else { resourceGroupOpt.value.optInit(nodeType, data, cmd, ['copy'].includes(cmd)) @@ -311,11 +313,13 @@ const addOperation = ( if (cmd === 'newLeaf') { const baseUrl = curCanvasType.value === 'dataV' ? '#/dvCanvas?opt=create' : '#/dashboard?opt=create' + let newWindow = null if (data?.id) { - window.open(baseUrl + `&pid=${data.id}`, '_blank') + newWindow = window.open(baseUrl + `&pid=${data.id}`, '_blank') } else { - window.open(baseUrl, '_blank') + newWindow = window.open(baseUrl, '_blank') } + initOpenHandler(newWindow, embeddedStore.getIframeData) } else if (cmd === 'newFromTemplate') { // state.templateCreatePid = data?.id // // newFromTemplate @@ -337,7 +341,8 @@ function createNewObject() { const resourceEdit = resourceId => { const baseUrl = curCanvasType.value === 'dataV' ? '#/dvCanvas?dvId=' : '#/dashboard?resourceId=' - window.open(baseUrl + resourceId, '_blank') + const newWindow = window.open(baseUrl + resourceId, '_blank') + initOpenHandler(newWindow, embeddedStore.getIframeData) } const resourceOptFinish = () => { @@ -351,11 +356,13 @@ const resourceCreateFinish = templateData => { curCanvasType.value === 'dataV' ? '#/dvCanvas?opt=create&createType=template' : '#/dashboard?opt=create&createType=template' + let newWindow = null if (state.templateCreatePid) { - window.open(baseUrl + `&pid=${state.templateCreatePid}`, '_blank') + newWindow = window.open(baseUrl + `&pid=${state.templateCreatePid}`, '_blank') } else { - window.open(baseUrl, '_blank') + newWindow = window.open(baseUrl, '_blank') } + initOpenHandler(newWindow, embeddedStore.getIframeData) } const getParentKeys = (tree, targetKey, parentKeys = []) => { diff --git a/core/core-frontend/src/views/dashboard/index.vue b/core/core-frontend/src/views/dashboard/index.vue index 815be1b116..cb93a23e82 100644 --- a/core/core-frontend/src/views/dashboard/index.vue +++ b/core/core-frontend/src/views/dashboard/index.vue @@ -1,5 +1,5 @@