通过ZeroTier内网穿透连接软路由
想要在外面随时可以查看路由器,就需要启用软路由的 ZeroTier 功能,经过配置后就可以在任何安装了 ZeroTier 的设备上直接访问内网。
- 路由器启用 ZeroTier
- 登录 ZeroTier 网站,创建 Network,获取 NetworkId。
在任何安装 ZeroTier 的设备上通过 NetworkId 加入该网络,即形成了一个 ZeroTier 打造的局域网。
- 软路由/电脑/移动设备 ZeroTier 界面通过输入 NetworkId 加入网络。
- 登录 ZeroTier 网站,在 Members 下通过地址确认各设备并授予权限,ZeroTier 会自动分配一个 ip 地址,形成一个局域网。
- 如果想要保持软路由的地址一致,在 ZeroTier 网站界面 Managed Routes 添加一个跳转,Destination 为目标软路由地址,via 为 ZeroTier 为软路由设备自动分配的地址。
红米AX6000刷OpenWrt
网上给红米 AX6000 刷 OpenWrt 的内容多如牛毛,我也是参考了恩山论坛的帖子,期间也用小米路由器救砖工具重置过几次路由器,在此记录一下参考的网站和遇到的问题。
刷机步骤
在红米 AX6000 闭源驱动 op下载作者编译的 ImmortalWrt 固件,参考红米 AX6000 X-WRT 固件刷机教程刷入 X-Wrt 底包,之后在 X-wrt web 界面刷入下载好的 ImmortalWrt。
遇到的问题
按教程刷入 X-Wrt 或者 OpenWrt stack 底包重启后没有 Wifi 信号,导致无法连接路由器登陆后台。
这是因为底包默认关闭了 Wifi 功能,将路由器通过网线连接电脑,在控制面板/网络和 Internet/查看网络信息,找到设备查看详细信息就可以看到电脑自动分配的 IP 地址了。如果自动分配的 IP 地址打不开,可以点击属性,在 IPv4 设置里手动设置 IPv4 地址。
根据 Ip 地址登录之后可以在菜单栏无线里面打开 Wifi 功能。
底包 Web 页面刷入 ImmortalWrt 有警告提示。
不慌,大胆刷。
PassWall TCP 节点分流无效,指定单个节点却正常。
先选择单个节点确保网络正常翻墙,选择规则管理,checkbox 勾选 geoip geosite 规则并且手动更新。
更新.gitignore
如何应用.gitignore文件的更新。
1 |
|
n1盒子设置
记录一下 n1 盒子刷上 OpenWrt 之后的一些问题。
n1 盒子作旁路由
n1 盒子与主路由保持同一网段,譬如主路由是 192.168.0.1,则 n1 盒子 ip 是 192.168.0.x,x!=1。
主路由
打开 dhcpn1 盒子
设置网关为主路由的地址 192.168.0.1
关闭 dhcp 服务
passwall
如果想针对特定设备能够翻墙,则需要在对应设备设置网关和 dns 为 n1 盒子的 ip 地址
如果想要不区分设备,则要在主路由 dhcp 设置网关和 dns 为 n1 盒子的 ip 地址,这样就相当于为每个设备自动下发了对应的网关和 dns 设置
这种方式旁路由和主路由都能够实现翻墙,所有的链接会经过 passwall 的分流处理交由主路由。
openClash
这种方式只要 openClash 配置好就能上网,无需操作主路由,而且连接主路由正常上网,链接 n1 盒子翻墙上网,分配明确。
WSL打开VSCode出错
在WSL命令行中输入命令code .
应该会呼出Windows的VSCode,但是却提示错误
1 |
|
可以手动删除/home/xxx/.vscode-server
,此时运行code .
会重新安装VSCode。
HTML原生input标签实现调色板功能
使用 input 标签 type=‘color'属性调出浏览器的调色板,监听 input 事件实时获取取色值,将 input 标签隐藏以应用自定义样式。
1 |
|
通过Chrome Devtool在PC端调试安卓设备网页
开发过程中需要使用移动设备测试页面,为了方便调试,可以通过 PC 连接移动设备(Android),使用 Chrome 浏览器 Devtool 像调试 PC 页面一样调试移动设备。
电脑连接手机
手机开发者模式打开 usb 调试;或者无线调试,使用 adb 命令连接设备。
导航栏地址
chrome://inspect/#devices
允许浏览器通过 usb 或者 network 查找连接的手机
以上操作完成后,会在 Remote Target 下看到自己的手机型号,此时在手机浏览器打开任意页面都会反映在当前页面,通过 inspect 调试相应页面即可。
扁平化嵌套数组-flat方法
当需要把嵌套数组转成扁平数组时可以使用 flat 方法,arr.flat(depth) depth 指的是需要拍平的深度。
1 |
|
使用Object.entries循环对象
平时循环对象一直使用 Object.keys(),最近学到了用 Object.entries()感觉更方便。
1 |
|
前端批量下载遇到的问题
在需要批量下载文件时,总是最后一个文件能够下载成功,在 Chrome Devtool 的网络请求里可以看到前面的文件请求状态是 canceled,代码如下。
1 |
|
原因:把 a 链接当成一次网页导航,当点击 a 链接跳转时又重复点击该链接,浏览器此时会重置之前的跳转并重新计算,这就导致了之前的网络请求都被 canceled。
解决方法:使用 iframe 隐藏下载,但是缺点是会在 body 里面嵌入多个 iframe。
1
2
3
4
5
6
7
8
9
10
11const saveFile = (url: string) => {
const iframe = document.createElement('iframe')
iframe.setAttribute('sandbox', 'allow-downloads allow-scripts')
iframe.src = url
iframe.setAttribute('style', 'display: none')
document.body.appendChild(iframe)
setTimeout(() => {
iframe.remove()
}, 1000)
}
检测到页面内容有更新,是否刷新页面 是否