Attack on Life ⚔️

Personal blog

发表于 更新于 本文字数： 928 阅读时长 ≈ 2 分钟
本文是作者对keyboard.lock使用的介绍，包括keyboard.lock使用的优势、实现细节、相关资料等，这些步骤可以帮助作者提高keyboard.lock使用的效率。

最近在做WebShell自定义热键，遇到的问题是网页热键受限于浏览器和操作系统，有些热键无法捕获，比如command t。

经过调查发现navigator.keyboard.lock可以解决这个限制问题，这里记录下使用过程中的一些问题和心得

不可拦截热键

以Mac为例，实际测试比如以下几个热键不支持拦截。即JS层面我们无法捕获这类按键，也就阻止默认行为

1
2
3
4
5
⌘ N 创建新window
⌘ T 创建新Tab
⌘ W 关闭Tab
⌘ ⇧ [ 左Tab
⌘ ⇧ [ 右Tab

这个似乎无解，但有了lock api 这些就有可能解决了

阅读全文 »

发表于 更新于 本文字数： 1.7k 阅读时长 ≈ 3 分钟
本文是作者对ChatGPT GPTs使用的介绍，包括ChatGPT GPTs使用的优势、实现细节、相关资料等，这些步骤可以帮助作者提高ChatGPT GPTs使用的效率。

GPTs 6号发布距今有几天了，玩了下觉得非常不错，熟悉后对于个人使用GPT还是很方便的。这里记录下使用过程中的一些问题和心得

GPTs

GPTs即每个人可以自定义创建个性化的GPT可以根据自己的需求进行配置，比如聊天助手、知识库助手、API助手等等。这里的GPTs是基于ChatGPT的，所以可以理解为ChatGPT的升级版，可以自定义更多的功能。

要求

使用GPTs需要满足以下条件

阅读全文 »

发表于 更新于 本文字数： 1.2k 阅读时长 ≈ 2 分钟
本文是作者对WebShell中实现图片显示的介绍，包括WebShell中实现图片显示的优势、实现细节、相关资料等，这些步骤可以帮助作者提高WebShell中实现图片显示的效率。

终端可以显示图片吗？当然，这里就总结下基于xterm.js实现图片显示

效果

实现

阅读全文 »

发表于 更新于 本文字数： 612 阅读时长 ≈ 1 分钟
本文是作者对css使用-has函数的介绍，包括css使用-has函数的优势、实现细节、相关资料等，这些步骤可以帮助作者提高css使用-has函数的效率。

最近WebShell开发时，遇到一个动态调整样式的需求即当终端开启上下分屏，上侧出现编辑器的时候，下侧的终端需要调整样式，具体来说是调整最小高。这里考虑走css实现。

分析

has函数可以使用css选择器来判断后面或者子后代是否存在某个元素，因此这样利用has可以捕获到上下分屏的情况下的编辑器元素，之后就可以正常使用+获取兄弟元素，再实际调整样式了。当然JS也可以实现，但CSS实现更加简单

例子

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<style>
  .terminal {
    width: 100%;
    min-height: 200px;
    background-color: #4bd58d;
  }
  .editor{
    width: 100%;
    height: 100px;
    background-color: #003dfd;
  }

  .editor:has(+.terminal) +.terminal{
    background-color: #ff0000;
  }
</style>
阅读全文 »

发表于 更新于 本文字数： 427 阅读时长 ≈ 1 分钟
本文是作者对Shell安装使用的介绍，包括Shell安装使用的优势、实现细节、相关资料等，这些步骤可以帮助作者提高Shell安装使用的效率。

最近WebShell在支持各Shell函数钩子时遇到了些问题，针对各Shell的安装使用做个记录，以便后续使用。

这里以Ubuntu为例

Bash

1
2
3
chsh -s $(which bash)
# 版本 
bash --version

Zsh

阅读全文 »
0%