大佬问个问题 The browser doesn't support the File System Access API about trzsz.js HOT 40 CLOSED

<template>
    <div ref="termRef" @dragover.prevent @drop.prevent="drag" @contextmenu.prevent="pasteFromClip($event)" @mouseup.middle="copy2clip(term.getSelection())"</div>
</template>

<script setup lang="ts">

let ws: WebSocket
let trzsz: TrzszFilter
let term: Terminal
const termRef = ref<HTMLElement>()

const fitAddon = new FitAddon()
const searchAddon = new SearchAddon()
let canvasAddon = new CanvasAddon();
const webglAddon = new WebglAddon();
webglAddon.onContextLoss(e => {
  webglAddon.dispose();
  if (term) {
    term.loadAddon(canvasAddon)
  }
});


function createWs() {
  if (prop.cfg.port == "") {
    throw "port is null"
  }

  ws = new WebSocket("ws://localhost:" + prop.cfg.port + "/ssh?clientId=" + prop.clientId);
  ws.onopen = ev => {
    createTerm()
    resize()
    init_trzsz()
  }
  ws.onerror = e => {
    console.error("ws onError:", e)
    closeAll()
  }
  ws.onclose = e => {
    closeAll()
  }
  ws.onmessage = e => {
    if (typeof e.data === "string") {
      trzsz.processServerOutput(e.data)
    } else if (e.data instanceof Blob) {
      // let reader = new FileReader();
      // reader.readAsText(data, "utf-8")
      // reader.onloadend = ev => {
      //   // let msg = JSON.parse(reader.result as string)
      // }
    }
  }

}

function init_trzsz() {
  trzsz = new TrzszFilter({
    sendToServer: (data) => ws.send(data),
    writeToTerminal: (data) => {
      if (typeof data === "string") {
        term.write(data)
      }
    },
  });
}


function createTerm() {
  let {theme, fontSize, fontFamily} = mergeTheme();

  term = new Terminal({
    cols: tcols.value,
    disableStdin: false,
    letterSpacing: 0, // 字符间距
    lineHeight: 1.2,
    fontSize: fontSize,
    fontFamily: fontFamily,
    fontWeight: 500,
    cursorBlink: true,
    cursorStyle: 'block',
    convertEol: true, //启用时，光标将设置为下一行的开头
    scrollback: 10000,   //终端中的回滚量
    windowsMode: false,
    allowProposedApi: true,
    theme: theme,
  });

  term.onData((data) => {
    if (ws) {
      if (prop.sendAll) {
        SSHApi.SendAll(data as string)
      } else {
        trzsz.processTerminalInput(data)
      }
    }
  })

  term.onBinary((data) => trzsz.processBinaryInput(data))
 

  term.loadAddon(fitAddon)
  term.loadAddon(searchAddon)
  term.loadAddon(webglAddon)

  term.open(termRef.value as HTMLElement)
  term.focus()
 
  window.addEventListener('resize', resize)

  return term
}

function drag(e: DragEvent) {
  if (!e.dataTransfer) {
    return
  }
  trzsz.uploadFiles(e.dataTransfer.items).then(() => success()).catch((err) => console.log(err));
}

function sendBinaryData(obj: BinaryData) {
  try {
    ws.send(new Blob([JSON.stringify(obj)], {type : 'application/json'}))
  } catch (e: unknown) {
    console.error(e)
    LogError("js ws sendBinaryData exception: " + String(e))
  }
}

function setTermVh100() {
  let ele = term.element as HTMLElement;
  let attribute = ele.getAttribute("class") as string
  let ss = attribute.split(" ");
  if (!ss.includes("vh100")) {
    ss.push("vh100")
    ele.setAttribute("class", ss.join(" "))
  }
}

const resize = useDebounceFn(() => {
  const termResize = () => {
    try {
      fitAddon.fit()
      term.resize(tcols.value, trows.value)
      trzsz.setTerminalColumns(tcols.value)
      sendBinaryData({type: "windowSize", high: term.rows, width: term.cols} as WindowSize)
      setTermVh100()
      calcSuspPos()
    }catch (e) {
      console.error(e)
    }
  }

  let count = 0
  let result: number[] = []
  let timer = setInterval(function () {
    if (count > 180) {
      clearInterval(timer)
      closeAll()
      return
    }
    if (result.length != 0 && result.pop() == 1) {
      clearInterval(timer)
      termResize()
      count = 0
      return
    }

    count++

    let cw = Number(term.textarea?.style.width?.replace("px", ""))
    if (cw != 0) {
      let ch = term.textarea?.offsetHeight as number
      tcols.value = Math.floor(prop.w as number / cw)
      trows.value = Math.floor(prop.h as number / ch)
      result.push(1)
    } else {
      result.push(0)
    }
  }, 10)

}, 50)


function pasteFromClip(e: any) {
  ClipboardGetText().then(v => {
    term.paste(v)
  })
}



onMounted(() => {
  createWs()
})

watch([prop], (value: any, oldValue: any, onCleanup: any) => {
  if (prop.dragging) {
    setTermVh100()
    return
  }
  resize()
})


</script>





// ======================================================================================
// ======================================================================================go

func WsServer() {
	gin.SetMode(gin.ReleaseMode)
	router := gin.New()
	router.RedirectTrailingSlash = true
	router.Use(cors.Default())

	router.GET("/ssh", func(c *gin.Context) {
		cli, b := GetConnector(c.Query("clientId"))
		if !b {
			return
		}

		conn, err := upgrade.Upgrade(c.Writer, c.Request, nil)
		if err != nil {
				return
		}
		conn.EnableWriteCompression(true)
		err = conn.SetCompressionLevel(5)
		if err != nil {
			return
		}

		go cli.BridgeWS(conn)
	})

	server := &http.Server{
		Addr:              fmt.Sprintf("127.0.0.1:%s", "8888"),
		Handler:           router,
		ReadHeaderTimeout: 0,
	}
	go server.ListenAndServe()
}


func (c *SshConnector) BridgeWS(conn *websocket.Conn) {
	c.Ws.Conn = conn

	_ = c.Ws.Conn.SetReadDeadline(time.Now().Add(messageWait))
	msgType, msg, err := c.Ws.Conn.ReadMessage()
	if err != nil {
		return
	}
	if msgType != websocket.BinaryMessage {
		return
	}

	wdSize := new(windowSize)
	if err = json.Unmarshal(msg, wdSize); err != nil {
		return
	}

	c.Ws.Session, err = c.NativeSsh.NewSession()
	if err != nil {
		return
	}
	c.Ws.Session.Stderr = os.Stderr

	inPipe, err := c.Ws.Session.StdinPipe()
	if err != nil {
		return
	}
	outPipe, err := c.Ws.Session.StdoutPipe()
	if err != nil {
		return
	}
	c.Ws.InPipe = inPipe
	c.Ws.OutPipe = outPipe

	if err := c.Ws.Session.RequestPty("xterm-256color", wdSize.High, wdSize.Width, terminalModes); err != nil {
		g.Log.Error(fmt.Sprintf("ssh session RequestPty error: %+v", err))
		return
	}
	if err := c.Ws.Session.Shell(); err != nil {
		g.Log.Error(fmt.Sprintf("ssh session Shell error: %+v", err))
		return
	}

	go func() {
		wsRead(c)
	}()

	go func() {
		wsWrite(c)
	}()
}

func wsWrite(c *SshConnector) {
	for {
		bytes := bufPool.Get().([]byte)
		n, err := c.Ws.OutPipe.Read(bytes)
		if err != nil {
			return
		}

		if n > 0 {
			_ = c.Ws.Conn.SetWriteDeadline(time.Now().Add(messageWait))
			if err := c.Ws.Conn.WriteMessage(websocket.TextMessage, c.Decode(bytes[:n])); err != nil {
				return
			}
		}

		bufPool.Put(bytes)
		time.Sleep(200 * time.Microsecond)
	}
}

func wsRead(c *SshConnector) {
	var infiniteWait time.Time
	_ = c.Ws.Conn.SetReadDeadline(infiniteWait)

	go func() {
		time.Sleep(100 * time.Millisecond)
		_, _ = c.Ws.InPipe.Write([]byte("export PS1='[\\u@\\h \\W]\\$ ' \r"))
	}()

	for {
		msgType, data, err := c.Ws.Conn.ReadMessage()
		if err != nil {
			return
		}
		if msgType != websocket.BinaryMessage {
			_, err = c.Ws.InPipe.Write(data)
			if err != nil {
				return
			}
			continue
		}

		p := make(map[string]any, 0)
		if err = json.Unmarshal(data, &p); err != nil {
			g.Log.Error(fmt.Sprintf("ws read binarymessage decode error %v", err))
			return
		}

		//fmt.Printf("%v\n", p)
		v, ok := p["type"]
		if !ok || v == "" {
			return
		}

		switch v {
		case HeartType:
			_ = c.Ws.Conn.SetWriteDeadline(time.Now().Add(messageWait))
			msg := ujson.ToBytes(PongMsg{Type: HeartType})
			if err := c.Ws.Conn.WriteMessage(websocket.BinaryMessage, msg); err != nil {
				return
			}
		case WindowSizeType:
			wdSize := &windowSize{}
			_ = maputil.MapTo(p, wdSize)
			if err := c.Ws.Session.WindowChange(wdSize.High, wdSize.Width); err != nil {
				break
			}
		}
	}

}