add

src/main/App copy.ts

@@ -5,7 +5,7 @@ import Api from "./modules/api"
 import WindowManager from "./modules/window-manager"
 import { app, nativeTheme, protocol, WebContentsView } from "electron"
 import { electronApp } from "@electron-toolkit/utils"
-import Tabs from "./modules/tabs/Tabs"
+// import Tabs from "./modules/tabs/Tabs"
 import { getFileUrl } from "./utils"
 import BaseClass from "./base/base"
 
@@ -39,21 +39,21 @@ class App extends BaseClass {
     // private _db: DB
     private _Api: Api
     private _windowManager: WindowManager
-    private _tabs: Tabs
+    // private _tabs: Tabs
 
     constructor(
         // @inject(Setting) setting: Setting,
         // @inject(DB) db: DB,
         @inject(Api) Api: Api,
         @inject(WindowManager) windowManager: WindowManager,
-        @inject(Tabs) tabs: Tabs,
+        // @inject(Tabs) tabs: Tabs,
     ) {
         super()
         // this._setting = setting
         // this._db = db
         this._Api = Api
         this._windowManager = windowManager
-        this._tabs = tabs
+        // this._tabs = tabs
     }
 
     async init() {
@@ -155,8 +155,8 @@ class App extends BaseClass {
         // listenResize()
         // mainWindow!.addListener("resize", listenResize)
 
-        this._tabs.add("https://baidu.com", true)
-        this._tabs.add("https://zhihu.com")
+        // this._tabs.add("https://baidu.com", true)
+        // this._tabs.add("https://zhihu.com")
         return mainWindow
     }
 }

src/main/App.ts

@@ -5,11 +5,11 @@ import Api from "./modules/api"
 import WindowManager from "./modules/window-manager"
 import { app, nativeTheme, protocol } from "electron"
 import { electronApp } from "@electron-toolkit/utils"
-import Tabs from "./modules/tabs"
 import Command from "./modules/commands"
 import BaseClass from "./base/base"
 import IOC from "./_ioc"
 import DB from "./modules/db"
+import Zephyr from "./modules/zephyr"
 
 protocol.registerSchemesAsPrivileged([
     // {
@@ -29,6 +29,14 @@ protocol.registerSchemesAsPrivileged([
             supportFetchAPI: true,
         },
     },
+    {
+        scheme: "zephyr",
+        privileges: {
+            standard: true,
+            secure: true,
+            supportFetchAPI: true,
+        },
+    },
 ])
 
 @injectable()
@@ -45,7 +53,7 @@ class App extends BaseClass {
         @inject(Command) private _Command: Command,
         @inject(DB) private _DB: DB,
         @inject(WindowManager) private _WindowManager: WindowManager,
-        @inject(Tabs) private _Tabs: Tabs,
+        @inject(Zephyr) private _Zephyr: Zephyr,
     ) {
         super()
     }
@@ -56,10 +64,10 @@ class App extends BaseClass {
         this._WindowManager.init()
         app.whenReady().then(() => {
             this._Api.init()
+            this._Zephyr.init()
             electronApp.setAppUserModelId("top.xieyaxin")
             this._WindowManager.showMainWindow()
             const mainWindow = this._WindowManager.getMainWindow()
-            this._Tabs.init(mainWindow)
             if (mainWindow) {
                 nativeTheme.themeSource = "light"
                 mainWindow.setTitleBarOverlay({

src/main/_iocClass.ts

@@ -3,6 +3,10 @@ import BaseClass from "./base/base"
 import { destroyAll, _ioc } from "./_ioc"
 
 class IOC extends BaseClass {
+    init() {
+        // TODO
+    }
+
     destroy() {
         destroyAll()
     }

src/main/commands/TabsCommand.ts

@@ -14,6 +14,15 @@ class TabsCommand {
         this._Tabs.events.addListener("update", this.listenerTabActive)
     }
 
+    init() {
+        const mainWindow = this._WindowManager.getMainWindow()
+        this._Tabs.init(mainWindow)
+    }
+
+    bindElement(rect) {
+        this._Tabs.updateRect(rect)
+    }
+
     reload() {
         this._WindowManager.getMainWindow()?.reload()
     }
@@ -31,8 +40,6 @@ class TabsCommand {
     }
 
     nagivate(index: number, url: string) {
-        console.log(`跳转${index}:${url}`)
-
         this._Tabs.navigate(+index, url)
     }
 

src/main/modules/_ioc.ts

@@ -5,9 +5,11 @@ import { Api } from "./api"
 import { WindowManager } from "./window-manager"
 import { Tabs } from "./tabs"
 import Commands from "./commands"
+import Zephyr from "./zephyr"
 
 const modules = new ContainerModule(bind => {
     bind(Setting).toConstantValue(new Setting())
+    bind(Zephyr).toSelf().inSingletonScope()
     bind(Api).toSelf().inSingletonScope()
     bind(WindowManager).toSelf().inSingletonScope()
     bind(Commands).toSelf().inSingletonScope()

src/main/modules/tabs/Tab.ts

@@ -2,7 +2,7 @@ import { BrowserWindow, WebContentsView, WebPreferences } from "electron"
 import { join } from "node:path"
 import BaseClass from "vc/base/base"
 import _debug from "debug"
-import { Layout } from "./Constant"
+// import { Layout } from "./Constant"
 import FuckHTML from "res/fuck.html?asset"
 import { fileURLToPath } from "node:url"
 
@@ -13,6 +13,13 @@ interface IOption {
     active: boolean
 }
 
+interface IRect {
+    x: number
+    y: number
+    width: number
+    height: number
+}
+
 class Tab extends BaseClass {
     init() {
         // TODO
@@ -28,6 +35,12 @@ class Tab extends BaseClass {
     public visible: boolean = false
     private webContentsView: WebContentsView | null = null
     private curWindow: BrowserWindow | null = null
+    private curRect: {
+        x: number
+        y: number
+        width: number
+        height: number
+    } | null = null
 
     private defaultOptions: IOption = {
         url: "",
@@ -44,7 +57,7 @@ class Tab extends BaseClass {
         return this._events
     }
 
-    constructor(options = {}, window: BrowserWindow) {
+    constructor(options = {}, window: BrowserWindow, curRect: IRect) {
         super()
         this.listenResize = this.listenResize.bind(this)
         this.options = {
@@ -54,6 +67,7 @@ class Tab extends BaseClass {
         this.url = this.getUrl(this.options.url)
         this.showUrl = this.options.url
         this.curWindow = window
+        this.curRect = curRect
         this.setActive(this.options.active)
     }
     destroyTimer: NodeJS.Timeout | null = null
@@ -225,8 +239,20 @@ class Tab extends BaseClass {
         if (!this.webContentsView) {
             return
         }
-        const size = this.curWindow.getContentSize()
-        this.webContentsView.setBounds(Layout(size[0], size[1]))
+        if (!this.curRect) {
+            return
+        }
+        this.webContentsView.setBounds(this.curRect)
+        // const size = this.curWindow.getContentSize()
+        // this.webContentsView.setBounds(Layout(size[0], size[1]))
+    }
+
+    updateRect(curRect: IRect) {
+        this.curRect = curRect
+        if (!this.webContentsView) {
+            return
+        }
+        this.webContentsView.setBounds(this.curRect)
     }
 
     navigate(url: string) {

src/main/modules/tabs/index.ts

@@ -4,6 +4,13 @@ import _debug from "debug"
 import { BrowserWindow } from "electron"
 import EventEmitter from "events"
 
+interface IRect {
+    x: number
+    y: number
+    width: number
+    height: number
+}
+
 const debug = _debug("app:tabs")
 
 class Tabs extends BaseClass {
@@ -14,6 +21,13 @@ class Tabs extends BaseClass {
 
     public events = new EventEmitter()
 
+    private curRect: {
+        x: number
+        y: number
+        width: number
+        height: number
+    } | null = null
+
     constructor() {
         super()
     }
@@ -24,8 +38,16 @@ class Tabs extends BaseClass {
         this.add("about:blank", true, mainWindow)
     }
 
+    updateRect(curRect: IRect) {
+        this.curRect = curRect
+        this._tabs.forEach(tab => {
+            tab.updateRect(curRect)
+        })
+    }
+
     add(url: string, active: boolean, win: BrowserWindow) {
-        const tab = new Tab({ url }, win)
+        if (!this.curRect) throw new Error("请绑定区域显示")
+        const tab = new Tab({ url }, win, this.curRect)
         tab.events.on("window-open", ev => {
             debug(ev)
             this.add(ev.url, true, win)

src/main/modules/zephyr/index.ts

@@ -0,0 +1,45 @@
+import { session, net } from "electron"
+import { inject, injectable } from "inversify"
+import IOC from "vc/_ioc"
+import BaseClass from "vc/base/base"
+
+@injectable()
+class Zephyr extends BaseClass {
+    constructor(@inject(IOC) private _IOC: IOC) {
+        super()
+        this.interceptHandlerZephyr = this.interceptHandlerZephyr.bind(this)
+    }
+
+    destroy() {
+        // TODO
+    }
+    init(partition?: string) {
+        const ses = partition ? session.fromPartition(partition) : session.defaultSession
+        ses.protocol.handle("zephyr", this.interceptHandlerZephyr)
+        console.log(32423)
+    }
+    async interceptHandlerZephyr(request: Request) {
+        if (request.url.startsWith("zephyr://")) {
+            let curPath = request.url.replace(/^zephyr:\/\//, "")
+            let isPathRead = false
+            if (curPath.startsWith("$path/")) {
+                isPathRead = true
+                curPath = curPath.replace(/^\$path\//, "")
+            }
+            if (isPathRead) {
+                console.log("安全读取本地目录")
+                // 检查文件的安全性
+                const headers: HeadersInit = {}
+                headers["content-type"] = "text/txt"
+                return new Response(curPath, {
+                    status: 200,
+                    headers: Object.keys(headers).length ? headers : undefined,
+                })
+            }
+        }
+        return net.fetch(request.url, request)
+    }
+}
+
+export default Zephyr
+export { Zephyr }

src/renderer/src/App.vue

@@ -1,16 +1,29 @@
 <script setup lang="ts">
 import NavBar from "@renderer/components/NavBar.vue"
-import { onBeforeMount, ref } from "vue"
+import { onBeforeMount, onBeforeUnmount, onMounted, ref } from "vue"
 import { PopupMenu } from "./bridge/PopupMenu"
 
+const PlaceHolder = ref<HTMLDivElement>()
+function OnResize() {
+    const el = PlaceHolder.value
+    if (el) {
+        const rect = el.getBoundingClientRect().toJSON()
+        console.log(rect)
+        api.call("TabsCommand.bindElement", rect)
+    }
+}
+onMounted(OnResize)
+window.addEventListener("resize", OnResize)
+onBeforeUnmount(() => {
+    window.removeEventListener("resize", OnResize)
+})
+
 const list = ref<any[]>([])
 const curUrl = ref<any>("")
 const curIndex = ref<any>(-1)
 const listener = (_, v) => {
     list.value = v
     const el = v.find(v => v.isActive)
-    console.log(el);
-
     curIndex.value = v.findIndex(v => v.isActive)
     if (el) {
         curUrl.value = el.showUrl
@@ -22,7 +35,10 @@ if (import.meta.hot) {
     api.off("TabsCommand.update", listener)
 }
 api.on("TabsCommand.update", listener)
-api.call("TabsCommand.sync")
+onMounted(() => {
+    api.call("TabsCommand.init")
+    api.call("TabsCommand.sync")
+})
 
 onBeforeMount(async () => {
     list.value = await fetch("api://fuck/TabsService/getAllTabs").then(async res => await res.json())
@@ -106,7 +122,7 @@ function onClickDevTool() {
 <template>
     <div h-full flex flex-col>
         <NavBar></NavBar>
-        <div flex-1 h-0 overflow-auto flex flex-col>
+        <div ml="200px" b-l="1px solid #E5E5E5" flex-1 h-0 overflow-auto flex flex-col>
             <div h="100px" flex flex-col b-b="1px solid #E5E5E5">
                 <div flex gap-1 my-1 px-1 w-full>
                     <div
@@ -157,7 +173,7 @@ function onClickDevTool() {
                     </div>
                 </div>
             </div>
-            <div flex-1 h-0 flex items-center justify-center>fuck</div>
+            <div ref="PlaceHolder" ml="1px" flex-1 h-0 flex items-center justify-center>fuck</div>
         </div>
     </div>
 </template>