fix(core): 优化跨域通信只在顶部页面刷新时删除临时监听变量，优化代码添加注释

ocsjs · Feb 26, 2024 · 0f07dc4 · 0f07dc4
1 parent b148232
commit 0f07dc4
Show file tree

Hide file tree

Showing 4 changed files with 40 additions and 7 deletions.
diff --git a/packages/core/src/interfaces/cors.ts b/packages/core/src/interfaces/cors.ts
@@ -126,7 +126,7 @@ export class CorsEventEmitter {
 	}
 }
 
-if (typeof GM_listValues !== 'undefined') {
+if (typeof GM_listValues !== 'undefined' && self === top) {
 	// 加载页面后
 	window.onload = () => {
 		// 删除全部未处理的模态框临时变量，以及监听队列

diff --git a/packages/core/src/interfaces/store.provider.ts b/packages/core/src/interfaces/store.provider.ts
@@ -8,15 +8,43 @@ import { $const } from '../utils/const';
  * 在油猴环境下 getTab 指的是获取当前标签页的唯一全局对象，如果在普通浏览器环境中， getTab 则为 localStorage 里的一个对象
  */
 export interface StoreProvider {
+	/**
+	 * 获取存储的值
+	 * @param key 			键
+	 * @param defaultValue	默认值
+	 */
 	get(key: string, defaultValue?: any): any;
+	/**
+	 * 设置存储的值
+	 * @param key 	键
+	 * @param value	值
+	 */
 	set(key: string, value: any): void;
+	/**
+	 * 删除存储的值
+	 * @param key 键
+	 */
 	delete(key: string): any;
+	/**
+	 * 获取所有存储的键
+	 */
 	list(): string[];
-	/** 在使用 OCS.start 后，每个页面会自动分配一个 uid */
+	/**
+	 * 获取当前标签页的存储数据
+	 * @param key 键
+	 */
 	getTab(key: string): Promise<any>;
+	/**
+	 * 设置当前标签页的存储数据
+	 * @param key	键
+	 * @param value	值
+	 */
 	setTab(key: string, value: any): Promise<any>;
 	addChangeListener(key: string, listener: (curr: any, pre: any, remote?: boolean) => void): number | void;
 	removeChangeListener(listener: number | void | EventListener): void;
+	/**
+	 * 原理：在使用 OCS.start 后，每个页面会自动分配一个 uid，存储监听器的Key到油猴的本地存储中，通过改变这个的值，可以触发监听
+	 */
 	addTabChangeListener(key: string, listener: (curr: any, pre: any) => void): void | Promise<number>;
 	removeTabChangeListener(key: string, listener: number | EventListener): void;
 }

diff --git a/packages/core/src/render/render.ts b/packages/core/src/render/render.ts
@@ -48,6 +48,8 @@ export type ModalAttrs = Pick<
 	duration?: number;
 };
 
+export type MessageAttrs = Pick<MessageElement, 'duration' | 'onClose' | 'content' | 'closeable'>;
+
 const minimizeSvg =
 	'<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 0 24 24" width="24"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M19 13H5v-2h14v2z"/></svg>';
 const expandSvg =
@@ -546,15 +548,16 @@ export function $modal(type: ModalElement['type'], attrs: ModalAttrs) {
 /**
  * 消息推送
  */
-export function $message(
-	type: MessageElement['type'],
-	attrs: Pick<MessageElement, 'duration' | 'onClose' | 'content' | 'closeable'>
-) {
+export function $message(type: MessageElement['type'], attrs: MessageAttrs) {
 	if (self === top) {
 		const message = el('message-element', { type, ...attrs });
 		$elements.messageContainer.append(message);
 		return message;
 	} else {
+		// 跨域无法传递 HTMLElement，所以这里需要将 HTMLElement 转换为字符串
+		if (typeof attrs.content !== 'string') {
+			attrs.content = (attrs.content as HTMLElement).innerHTML;
+		}
 		cors.emit('message', [type, attrs]);
 	}
 }

diff --git a/packages/scripts/src/utils/index.ts b/packages/scripts/src/utils/index.ts
@@ -49,7 +49,9 @@ export function workPreCheckMessage(
 							content: '已关闭此次的自动答题，请手动开启或者忽略此警告。',
 							duration: 0
 						});
-						onclose?.(opts, closedMessage);
+						if (closedMessage) {
+							onclose?.(opts, closedMessage);
+						}
 					}
 				})
 			])