更新 @kevisual/api 版本至 0.0.12,并在 RouterViewApi、RouterViewContext 和 RouterViewWorker 中添加 id 属性,重命名相关变量以提高代码可读性
This commit is contained in:
@@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@kevisual/api",
|
"name": "@kevisual/api",
|
||||||
"version": "0.0.11",
|
"version": "0.0.12",
|
||||||
"description": "",
|
"description": "",
|
||||||
"main": "mod.ts",
|
"main": "mod.ts",
|
||||||
"scripts": {
|
"scripts": {
|
||||||
|
|||||||
@@ -5,6 +5,7 @@ import { EventEmitter } from 'eventemitter3';
|
|||||||
|
|
||||||
export type RouterViewItem = RouterViewApi | RouterViewContext | RouterViewWorker;
|
export type RouterViewItem = RouterViewApi | RouterViewContext | RouterViewWorker;
|
||||||
export type RouterViewApi = {
|
export type RouterViewApi = {
|
||||||
|
id: string;
|
||||||
title: string;
|
title: string;
|
||||||
description: string;
|
description: string;
|
||||||
type: 'api',
|
type: 'api',
|
||||||
@@ -16,6 +17,7 @@ export type RouterViewApi = {
|
|||||||
}
|
}
|
||||||
|
|
||||||
export type RouterViewContext = {
|
export type RouterViewContext = {
|
||||||
|
id: string;
|
||||||
title: string;
|
title: string;
|
||||||
description: string;
|
description: string;
|
||||||
type: 'context',
|
type: 'context',
|
||||||
@@ -26,6 +28,7 @@ export type RouterViewContext = {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
export type RouterViewWorker = {
|
export type RouterViewWorker = {
|
||||||
|
id: string;
|
||||||
title: string;
|
title: string;
|
||||||
description: string;
|
description: string;
|
||||||
type: 'worker',
|
type: 'worker',
|
||||||
@@ -33,7 +36,14 @@ export type RouterViewWorker = {
|
|||||||
type: 'Worker' | 'SharedWorker' | 'serviceWorker',
|
type: 'Worker' | 'SharedWorker' | 'serviceWorker',
|
||||||
url: string,
|
url: string,
|
||||||
// 已初始化的worker实例
|
// 已初始化的worker实例
|
||||||
worker?: Worker | SharedWorker | ServiceWorker
|
worker?: Worker | SharedWorker | ServiceWorker,
|
||||||
|
/**
|
||||||
|
* worker选项
|
||||||
|
* default: { type: 'module' }
|
||||||
|
*/
|
||||||
|
workerOptions?: {
|
||||||
|
type: 'module' | 'classic'
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
export type RouterViewQuery = {
|
export type RouterViewQuery = {
|
||||||
@@ -51,15 +61,15 @@ export type RouterViewData = {
|
|||||||
export class QueryProxy {
|
export class QueryProxy {
|
||||||
router: QueryRouterServer;
|
router: QueryRouterServer;
|
||||||
token?: string;
|
token?: string;
|
||||||
routeViewItems: RouterViewItem[];
|
routerViewItems: RouterViewItem[];
|
||||||
views: RouterViewQuery[];
|
views: RouterViewQuery[];
|
||||||
emitter: EventEmitter;
|
emitter: EventEmitter;
|
||||||
constructor(opts?: { query: Query, router?: QueryRouterServer, token?: string, routeViewData?: RouterViewData }) {
|
constructor(opts?: { router?: QueryRouterServer, token?: string, routerViewData?: RouterViewData }) {
|
||||||
this.router = opts?.router || new QueryRouterServer();
|
this.router = opts?.router || new QueryRouterServer();
|
||||||
this.token = opts?.token || this.getDefulatToken();
|
this.token = opts?.token || this.getDefulatToken();
|
||||||
this.routeViewItems = opts?.routeViewData?.data?.items || [];
|
this.routerViewItems = opts?.routerViewData?.data?.items || [];
|
||||||
this.views = opts?.routeViewData?.views || [];
|
this.views = opts?.routerViewData?.views || [];
|
||||||
this.initRouteViewQuery();
|
this.initRouterViewQuery();
|
||||||
this.emitter = new EventEmitter();
|
this.emitter = new EventEmitter();
|
||||||
}
|
}
|
||||||
getDefulatToken() {
|
getDefulatToken() {
|
||||||
@@ -71,21 +81,28 @@ export class QueryProxy {
|
|||||||
return undefined;
|
return undefined;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
async initRouteViewQuery() {
|
async initRouterViewQuery() {
|
||||||
this.routeViewItems = this.routeViewItems?.map(item => {
|
this.routerViewItems = this.routerViewItems?.map(item => {
|
||||||
if (item.type === 'api' && item.api?.url) {
|
if (item.type === 'api' && item.api?.url) {
|
||||||
const url = item.api.url;
|
const url = item.api.url;
|
||||||
|
if (item?.api?.query) return item;
|
||||||
item['api'] = { url: url, query: new Query({ url: url }) };
|
item['api'] = { url: url, query: new Query({ url: url }) };
|
||||||
}
|
}
|
||||||
if (item.type === 'worker' && item.worker?.url) {
|
if (item.type === 'worker' && item.worker?.url) {
|
||||||
let viewItem = item as RouterViewWorker;
|
let viewItem = item as RouterViewWorker;
|
||||||
|
if (!item.worker?.workerOptions?.type) {
|
||||||
|
item.worker.workerOptions = { ...item.worker.workerOptions, type: 'module' };
|
||||||
|
}
|
||||||
|
if (item.worker.worker) {
|
||||||
|
return item;
|
||||||
|
}
|
||||||
let worker: Worker | SharedWorker | ServiceWorker | undefined = undefined;
|
let worker: Worker | SharedWorker | ServiceWorker | undefined = undefined;
|
||||||
if (item.worker.type === 'SharedWorker') {
|
if (item.worker.type === 'SharedWorker') {
|
||||||
worker = new SharedWorker(item.worker.url);
|
worker = new SharedWorker(item.worker.url, item.worker.workerOptions);
|
||||||
worker.port.start();
|
worker.port.start();
|
||||||
} else if (viewItem.worker.type === 'serviceWorker') {
|
} else if (viewItem.worker.type === 'serviceWorker') {
|
||||||
if ('serviceWorker' in navigator) {
|
if ('serviceWorker' in navigator) {
|
||||||
navigator.serviceWorker.register(viewItem.worker.url).then(function (registration) {
|
navigator.serviceWorker.register(viewItem.worker.url, item.worker.workerOptions).then(function (registration) {
|
||||||
console.debug('注册serviceWorker成功 ', registration.scope);
|
console.debug('注册serviceWorker成功 ', registration.scope);
|
||||||
}, function (err) {
|
}, function (err) {
|
||||||
console.debug('注册 serviceWorker 失败: ', err);
|
console.debug('注册 serviceWorker 失败: ', err);
|
||||||
@@ -94,11 +111,14 @@ export class QueryProxy {
|
|||||||
console.warn('当前浏览器不支持serviceWorker');
|
console.warn('当前浏览器不支持serviceWorker');
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
worker = new Worker(viewItem.worker.url);
|
worker = new Worker(viewItem.worker.url, item.worker.workerOptions);
|
||||||
}
|
}
|
||||||
viewItem['worker']['worker'] = worker;
|
viewItem['worker']['worker'] = worker;
|
||||||
}
|
}
|
||||||
if (item.type === 'context' && item.context?.key) {
|
if (item.type === 'context' && item.context?.key) {
|
||||||
|
if (item.context?.router) {
|
||||||
|
return item;
|
||||||
|
}
|
||||||
// @ts-ignore
|
// @ts-ignore
|
||||||
const context = globalThis['context'] || {}
|
const context = globalThis['context'] || {}
|
||||||
const router = context[item.context.key] as QueryRouterServer;
|
const router = context[item.context.key] as QueryRouterServer;
|
||||||
@@ -114,13 +134,13 @@ export class QueryProxy {
|
|||||||
* 初始化路由
|
* 初始化路由
|
||||||
* @returns
|
* @returns
|
||||||
*/
|
*/
|
||||||
async init(routeViewData?: RouterViewData) {
|
async init() {
|
||||||
const routes = routeViewData?.data?.items || [];
|
const routerViewItems = this.routerViewItems || [];
|
||||||
if (routes.length === 0) {
|
if (routerViewItems.length === 0) {
|
||||||
await this.initApi();
|
await this.initApi();
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
for (const item of routes) {
|
for (const item of routerViewItems) {
|
||||||
switch (item.type) {
|
switch (item.type) {
|
||||||
case 'api':
|
case 'api':
|
||||||
this.initApi(item);
|
this.initApi(item);
|
||||||
@@ -145,12 +165,14 @@ export class QueryProxy {
|
|||||||
for (const r of _list) {
|
for (const r of _list) {
|
||||||
if (r.path || r.id) {
|
if (r.path || r.id) {
|
||||||
console.debug(`注册路由: [${r.path}] ${r?.key}`, 'API');
|
console.debug(`注册路由: [${r.path}] ${r?.key}`, 'API');
|
||||||
|
let metadata = r.metadata || {};
|
||||||
|
metadata.viewItem = item;
|
||||||
this.router.route({
|
this.router.route({
|
||||||
path: r.path,
|
path: r.path,
|
||||||
key: r.key || '',
|
key: r.key || '',
|
||||||
id: r.id,
|
id: r.id,
|
||||||
description: r.description,
|
description: r.description,
|
||||||
metadata: r.metadata,
|
metadata: metadata,
|
||||||
}).define(async (ctx) => {
|
}).define(async (ctx) => {
|
||||||
const msg = { ...ctx.query };
|
const msg = { ...ctx.query };
|
||||||
if (msg.token === undefined && that.token !== undefined) {
|
if (msg.token === undefined && that.token !== undefined) {
|
||||||
@@ -173,12 +195,14 @@ export class QueryProxy {
|
|||||||
const routes = router.getList();
|
const routes = router.getList();
|
||||||
for (const r of routes) {
|
for (const r of routes) {
|
||||||
console.debug(`注册路由: [${r.path}] ${r?.key}`, 'Context');
|
console.debug(`注册路由: [${r.path}] ${r?.key}`, 'Context');
|
||||||
|
let metadata = r.metadata || {};
|
||||||
|
metadata.viewItem = item;
|
||||||
this.router.route({
|
this.router.route({
|
||||||
path: r.path,
|
path: r.path,
|
||||||
key: r.key || '',
|
key: r.key || '',
|
||||||
id: r.id,
|
id: r.id,
|
||||||
description: r.description,
|
description: r.description,
|
||||||
metadata: r.metadata,
|
metadata: metadata,
|
||||||
}).define(async (ctx) => {
|
}).define(async (ctx) => {
|
||||||
const res = await router.run({ path: r.path, key: r.key, ...ctx.query });
|
const res = await router.run({ path: r.path, key: r.key, ...ctx.query });
|
||||||
ctx.forward(res)
|
ctx.forward(res)
|
||||||
@@ -200,14 +224,23 @@ export class QueryProxy {
|
|||||||
console.warn('Worker not initialized');
|
console.warn('Worker not initialized');
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
if (item.worker.type === 'SharedWorker') {
|
const callResponse = (e: MessageEvent) => {
|
||||||
const port = (worker as SharedWorker).port;
|
|
||||||
port.onmessage = function (e) {
|
|
||||||
const msg = e.data;
|
const msg = e.data;
|
||||||
|
if (msg.requestId) {
|
||||||
const requestId = msg.requestId;
|
const requestId = msg.requestId;
|
||||||
that.emitter.emit(requestId, msg);
|
that.emitter.emit(requestId, msg);
|
||||||
};
|
} else {
|
||||||
|
that.router.run(msg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
if (item.worker.type === 'SharedWorker') {
|
||||||
|
const port = (worker as SharedWorker).port;
|
||||||
|
port.onmessage = callResponse;
|
||||||
port.start();
|
port.start();
|
||||||
|
} else if (item.worker.type === 'serviceWorker') {
|
||||||
|
navigator.serviceWorker.addEventListener('message', callResponse);
|
||||||
|
} else {
|
||||||
|
(worker as Worker).onmessage = callResponse;
|
||||||
}
|
}
|
||||||
const callWorker = async (msg: any, viewItem: RouterViewWorker['worker']): Promise<Result> => {
|
const callWorker = async (msg: any, viewItem: RouterViewWorker['worker']): Promise<Result> => {
|
||||||
const requestId = this.generateId();
|
const requestId = this.generateId();
|
||||||
@@ -236,6 +269,7 @@ export class QueryProxy {
|
|||||||
});
|
});
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
const res = await callWorker({
|
const res = await callWorker({
|
||||||
path: "router",
|
path: "router",
|
||||||
key: 'list',
|
key: 'list',
|
||||||
@@ -250,12 +284,14 @@ export class QueryProxy {
|
|||||||
for (const r of _list) {
|
for (const r of _list) {
|
||||||
if (r.path || r.id) {
|
if (r.path || r.id) {
|
||||||
console.debug(`注册路由: [${r.path}] ${r?.key}`, 'API');
|
console.debug(`注册路由: [${r.path}] ${r?.key}`, 'API');
|
||||||
|
let metadata = r.metadata || {};
|
||||||
|
metadata.viewItem = item;
|
||||||
this.router.route({
|
this.router.route({
|
||||||
path: r.path,
|
path: r.path,
|
||||||
key: r.key || '',
|
key: r.key || '',
|
||||||
id: r.id,
|
id: r.id,
|
||||||
description: r.description,
|
description: r.description,
|
||||||
metadata: r.metadata,
|
metadata: metadata,
|
||||||
}).define(async (ctx) => {
|
}).define(async (ctx) => {
|
||||||
const msg = { ...ctx.query };
|
const msg = { ...ctx.query };
|
||||||
if (msg.token === undefined && that.token !== undefined) {
|
if (msg.token === undefined && that.token !== undefined) {
|
||||||
|
|||||||
Reference in New Issue
Block a user