ChatGPT火了一年了,技术上的话也带动了SSE的使用。这里也总结下我对它的认识。

SSE的优势

  1. 使用标准的HTTP协议,并非WebSocket。相对比WebSocket全双工资源开销相对较小。
  2. SSE传输的文本数据,使用开销简单。

服务端实现

阅读全文 »

xterm.js中监听按键执行特殊处理需要用到attachCustomKeyEventHandler,这里说明下。

源码解读

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
/**
* Attaches a custom key event handler which is run before keys are
* processed, giving consumers of xterm.js ultimate control as to what keys
* should be processed by the terminal and what keys should not.
* @param customKeyEventHandler The custom KeyboardEvent handler to attach.
* This is a function that takes a KeyboardEvent, allowing consumers to stop
* propagation and/or prevent the default action. The function returns
* whether the event should be processed by xterm.js.
*
* @example A custom keymap that overrides the backspace key
* ```ts
* const keymap = [
* { "key": "Backspace", "shiftKey": false, "mapCode": 8 },
* { "key": "Backspace", "shiftKey": true, "mapCode": 127 }
* ];
* term.attachCustomKeyEventHandler(ev => {
* if (ev.type === 'keydown') {
* for (let i in keymap) {
* if (keymap[i].key == ev.key && keymap[i].shiftKey == ev.shiftKey) {
* socket.send(String.fromCharCode(keymap[i].mapCode));
* return false;
* }
* }
* }
* });
* ```
*/
attachCustomKeyEventHandler(customKeyEventHandler: (event: KeyboardEvent) => boolean): void;

源码位置

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
protected _keyDown(event: KeyboardEvent): boolean | undefined {
this._keyDownHandled = false;
this._keyDownSeen = true;

if (this._customKeyEventHandler && this._customKeyEventHandler(event) === false) {
return false;
}
...
}
protected _keyUp(ev: KeyboardEvent): void {
this._keyDownSeen = false;

if (this._customKeyEventHandler && this._customKeyEventHandler(ev) === false) {
return;
}
...
}
protected _keyPress(ev: KeyboardEvent): boolean {
let key;

this._keyPressHandled = false;

if (this._keyDownHandled) {
return false;
}

if (this._customKeyEventHandler && this._customKeyEventHandler(ev) === false) {
return false;
}
...
}

阅读全文 »

TinyMCE是个老牌的编辑器,查询发现TinyMCE使用的GNU-GPL开源协议,那我是否可商用,是否可以二次开发呢?带着这个疑问,了解下GPL。

解释

如下转自知乎的一个回答

GPL协议的目的就是强制代码开源和免费使用。

其最大的特点就是“开源的传染性”。也就是说,假设某公司使用了具有GPL协议的代码库,那么他理论上也必须把自己的代码库开源。

阅读全文 »

nodejs支持esmodule导入,通过import可以加载esmodule,但也有些条件,如果不满足仍然会报错。

注意:nodejs下import与浏览器侧有区别。

import本地JS模块

  1. js文件所在文件夹目录下package.json中声明type:module
  2. 文件后缀为mjs
阅读全文 »

经常会看到Shell文件首行有个#!/bin/sh. 有时没有私护也能运行,不清楚是干嘛的。直到最近在编写Alfred Workflow时才了解到这个叫做Shebang。这里就mark下。

Shebang

  1. Shebang即#!,如果存在的话一定是该文件第一行的前两个字符。
  2. 在文件中存在Shebang的情况下,类Unix操作系统程序加载器会分析Shebang后的内容,将这些内容作为解释器指令,并调用该指令,并将载有Shebang的文件路径作为该解释器的参数。
  3. 文件可以没有Shebang首行,但文件将不能直接被执行,但如果调用文件执行时直接使用解释器则可以运行。

例子

阅读全文 »

前端采用FileReader可以读取文件内容,但是在读取大文件,比如1-3GB文件时发现会有显著卡顿。这里Mark下优化办法。

卡顿原因

全量读取文件的话,文件内容会都存入浏览器内存中,因此会出现卡顿。

解决办法

阅读全文 »

最近WebShell需要支持PowerShell环境下的文件管理,为了实现文件相关操作需要了解下相关命令。这里总结下

压缩文件夹

1
Compress-Archive -Path '${formatted}' -DestinationPath '${zipTempPath')}'

复制文件/文件夹

阅读全文 »

登录终端总是会提示一段欢迎语,那么想改变这段欢迎语该如何做呢。最近在做WebShell时考虑如何解决该需求

服务器设置

最直接的方式即服务器配置,比如bashrc中增加echo 'hello world'。那么在登录WebShell后则会有该信息的打印。

但服务器端设置缺陷是

阅读全文 »

MacOS/Windows都自带了终端App,如果有URL Scheme支持的话,那么通过网页超链接就可以唤起终端SSH会话。这里调研下其可行性。

URL-Scheme支持

MacOS

ssh://<username>@<host>:<port>

点击测试

阅读全文 »

GitHub上如果是自己玩项目比较简单,但如何协作贡献开源项目呢,这就比较有意思了。这里mark下我在贡献开源项目,比如inshellisense积攒的经验。

https://static.1991421.cn/2024/2024-03-17-144331.png

这里以项目inshellisense为例

  1. fork开源项目,microsoft/inshellisense => alanhg/inshellisense

  2. 新建分支,比如fix/file-template,进行开发

    • 有UT的话更新UT,确保测试通过
    • 这里不直接使用主分支,是因为主分支用来同步项目更新,避免开发中,原项目有了新commit
    • 同时新建分支也可以更好的利用分支名表示在做的修改是feat还是fix等
  3. 提交到上游即alanhg/inshellisense

  4. 开源项目microsoft/inshellisense如果有更新,拉取更新Sync fork

  5. 提交分支fix/file-template进行rebase with主干分支,确保最新已同步

  6. 重新推送到上游alanhg/inshellisense

  7. 发起Pull Request,详细描述改动,等待合并

    • 如果PR review中有任何问题,积极反馈及解决
  8. 合并成功即🎉

  9. 可以将分支fix/file-template删除,切换到主分支,如果还有新的贡献可重新走步骤5进行操作

0%