随心而记

使用乾坤微前端嵌入早期不同技术栈的项目

Tue, 02 Jul 2024 00:00:00 GMT

最终效果

<video controls> <source src="/videos/preview-qiankun-2024-07-02.mp4" type="video/mp4"> Your browser does not support the video tag. </video>

最近公司有个新的需求，类似于低代码平台的一个需求，前端主要做的是一个拖拽生成大屏的平台，但是这个平台完全从零开发需要消耗非常多的工时，因此需要从 Github 上找类似的开源的可以满足需求的组件或者项目。

最终选定了 AJ-Report 这个项目，由于这个需求一期可能要在其他系统上开发（React 技术栈），二期可能要改造形成自己的产品，而这个项目使用的技术栈是 Vue2，不管是对于一期还是二期形成自己的产品它的技术栈都不符合要求，但是通过调研，市面上也没有其他更适合的开源项目了，因此我想要使用微前端的架构将它嵌入到主应用中。

一期需求

对于一期来说，仅仅将它改造成为子系统并嵌入原有的系统中即可，具体改造配置请见二期需求。

二期需求

对于二期来说，至少需要三个工程，分别是主应用、开源的可拖拽大屏平台子应用、业务代码子应用。

由于我们团队技术栈都为 React 因此主应用和子应用的首选技术栈为 React。

主应用

通过 Creact React App 脚手架创建。

npx create-react-app cra-framework --template typescript

安装乾坤

npm i qiankun -S

安装路由并配置路由

npm install react-router-dom

路由及布局如下图

注册并启动子应用

import React from 'react';
import ReactDOM from 'react-dom/client';
import { BrowserRouter } from 'react-router-dom';
import RouterGurad from './router/RouterGurad';
import reportWebVitals from './reportWebVitals';
import { registerMicroApps, start, initGlobalState, MicroAppStateActions } from 'qiankun';

const root = ReactDOM.createRoot(
  document.getElementById('root') as HTMLElement
);
root.render(
  <React.StrictMode>
    <BrowserRouter>
      <RouterGurad />
    </BrowserRouter>
  </React.StrictMode>
);

// If you want to start measuring performance in your app, pass a function
// to log results (for example: reportWebVitals(console.log))
// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals
reportWebVitals();

registerMicroApps([
  {
    name: 'app-vue',
    entry: '//localhost:9528',
    container: '#root',
    activeRule: '/app-vue',
  },
  {
    name: 'cra-sub-web',
    entry: '//localhost:3002',
    container: '#main',
    activeRule: '/cra-sub-web',
  },
]);
// 启动 qiankun
start();

可拖拽大屏平台子应用

在 src 目录新增 public-path.js：

if (window.__POWERED_BY_QIANKUN__) {
  __webpack_public_path__ = window.__INJECTED_PUBLIC_PATH_BY_QIANKUN__;
}

入口文件 main.js 修改，为了避免根 id #app 与其他的 DOM 冲突，需要限制查找范围。

相关代码主要集中在最后导出bootstrap、mount、unmount函数以及挂载 Vue（有很多原本存在的与改造成子系统无关的代码）

import Vue from 'vue'
import './public-path';
import VueRouter from 'vue-router';

// element-ui
import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'
import zhLocale from 'element-ui/lib/locale/lang/zh-CN'
import 'normalize.css/normalize.css'// A modern alternative to CSS resets
import '@/assets/styles/common.css'
import '@/assets/styles/index.scss'// custome global css

// app router vuex filter mixins
import App from './App'
import router from './router'
import store from './store'
import * as filter from './filter'
import mixins from '@/mixins'
import echarts from 'echarts';
// 全局定义echarts
import ECharts from 'vue-echarts'
import 'echarts/lib/chart/bar'
import 'echarts/lib/component/tooltip'
//import 'echarts-liquidfill'
// import 'echarts-gl'
Vue.component('v-chart', ECharts)
// 全局引入datav
import dataV from '@jiaminghi/data-view'
Vue.use(dataV)
// anji component
import anjiCrud from '@/components/AnjiPlus/anji-crud/anji-crud'
import anjiSelect from '@/components/AnjiPlus/anji-select'
import anjiUpload from '@/components/AnjiPlus/anji-upload'
Vue.component('anji-upload', anjiUpload)
Vue.component('anji-crud', anjiCrud)
Vue.component('anji-select', anjiSelect)

// permission control
import '@/permission'
// 按钮权限的指令
import permission from '@/components/Permission/index'
Vue.use(permission)

import Avue from '@smallwei/avue';
import '@smallwei/avue/lib/index.css';
Vue.use(Avue);

// enable element zh-cn
Vue.use(ElementUI, { zhLocale })

// register global filter.
Object.keys(filter).forEach(key => {
  Vue.filter(key, filter[key])
})

// register global mixins.
Vue.mixin(mixins)

// 分页的全局size配置;
Vue.prototype.$pageSizeAll = [10, 50, 100, 200, 500]

// create the app instance.
// new Vue({ el: '#app', router, store, render: h => h(App) })

Vue.config.productionTip = false;

let instance = null;
function render(props = {}) {
  const { container } = props;
  router.base = window.__POWERED_BY_QIANKUN__ ? '/app-vue/' : '/';

  instance = new Vue({
    el: container ? container.querySelector('#app') : '#app',
    router,
    store,
    render: (h) => h(App),
  });
}
// 独立运行时
if (!window.__POWERED_BY_QIANKUN__) {
  render();
}

export async function bootstrap() {
  console.log('[vue] vue app bootstraped');
}
export async function mount(props) {
  console.log('[vue] props from main framework', props);
  render(props);
}
export async function unmount() {
  console.log('[vue] vue app unmount');
  instance.$destroy();
  instance.$el.innerHTML = '';
  instance = null;
  // router = null;
}

打包配置修改（vue.config.js）：

由于这个 vue 项目使用的脚手架版本的问题并没有 vue.config.js文件，因此直接修改 webpack 配置

const devWebpackConfig = merge(baseWebpackConfig, {
  output: {
    path: config.build.assetsRoot,
    filename: '[name].js',
    publicPath: config.dev.assetsPublicPath,
    library: 'app1',
    libraryTarget: 'umd', // 把微应用打包成 umd 库格式
    jsonpFunction: `webpackJsonp_${name}`, // webpack 5 需要把 jsonpFunction 替换成 chunkLoadingGlobal
  },
   devServer: {
    headers: {
      'Access-Control-Allow-Origin': '*',
    },
   }
});

配置完成后访问 http://localhost:3001/app-vue#/bigscreen/designer?reportCode=test_001 如下图

业务代码子应用

通过 Creact React App 脚手架创建。

npx create-react-app cra-sub-web --template typescript

在 src 目录新增 public-path.js：

if (window.__POWERED_BY_QIANKUN__) {
  __webpack_public_path__ = window.__INJECTED_PUBLIC_PATH_BY_QIANKUN__;
}

设置 history 模式路由的 base：

<BrowserRouter basename={window.__POWERED_BY_QIANKUN__ ? '/app-react' : '/'}>

入口文件 index.js 修改，为了避免根 id #root 与其他的 DOM 冲突，需要限制查找范围。

import React from 'react';
import './public-path';
import ReactDOM from 'react-dom/client';
import routes from './router';
import { BrowserRouter, useRoutes } from 'react-router-dom';
import './index.css';

let root = ReactDOM.createRoot(
  document.getElementById('root') as HTMLElement
);

function App () {
  return useRoutes(routes)
}
// @ts-ignore
console.log(window.__POWERED_BY_QIANKUN__);

// @ts-ignore
if (!window.__POWERED_BY_QIANKUN__) {
  root.render(
    <React.StrictMode>
      {/* @ts-ignore */}
      <BrowserRouter basename={window.__POWERED_BY_QIANKUN__ ? '/cra-sub-web' : '/'}>
        <App />
      </BrowserRouter>
    </React.StrictMode>
  );
}

export async function bootstrap() {
  console.log('[react16] react app bootstraped');
}

export async function mount(props: any) {
  console.log('[react16] props from main framework', props);
  const { container } = props;
  root = ReactDOM.createRoot(container ? container.querySelector('#root') as HTMLElement : document.getElementById('root') as HTMLElement);
  console.log(container ? container.querySelector('#root') as HTMLElement : document.getElementById('root') as HTMLElement);
  
  root.render(
    <React.StrictMode>
      {/* @ts-ignore */}
      <BrowserRouter basename={window.__POWERED_BY_QIANKUN__ ? '/cra-sub-web' : '/'}>
        <App />
      </BrowserRouter>
    </React.StrictMode>
  );
}

export async function unmount(props: any) {
  // 卸载
  root.unmount();
}

修改 webpack 配置

我使用的是 react-app-rewired 库，安装 react-app-rewired

npm install react-app-rewired --save-dev

修改 package.json

{
  "scripts": {
    "start": "react-app-rewired start",
    "build": "react-app-rewired build",
    "test": "react-app-rewired test",
    "eject": "react-scripts eject"
  }
}

创建 config-overrides.js 文件

const { override, addWebpackAlias } = require('customize-cra');
const path = require('path');
const { name } = require('./package');

module.exports = {
  webpack: override(
    (config) => {
      config.output.library = `${name}-[name]`;
      config.output.libraryTarget = 'umd';
      // Webpack 5 需要把 jsonpFunction 替换成 chunkLoadingGlobal
      config.output.chunkLoadingGlobal = `webpackJsonp_${name}`;
      config.output.globalObject = 'window';
      return config;
    },
    addWebpackAlias({
      '@': path.resolve(__dirname, 'src'),
    })
  ),

  devServer: (configFunction) => {
    const config = configFunction;

    config.headers = {
      'Access-Control-Allow-Origin': '*',
    };
    config.historyApiFallback = true;
    config.hot = false;
    config.watchContentBase = false;
    config.liveReload = false;

    return config;
  },
};

重新启动服务然后访问 http://localhost:3001/cra-sub-web/home 如下图

应用间通信

根据文档使用**GlobalState** ，使用方式类似于 bus。

首先在主应用中定义 state

import { initGlobalState, MicroAppStateActions } from 'qiankun';

const state = {
  status: 1,
};

const actions: MicroAppStateActions = initGlobalState(state);

actions.onGlobalStateChange((state, prev) => {
  // state: 变更后的状态; prev 变更前的状态
  console.log(state, prev);
  if (state.status === 0) {
    alert('token 失效，跳转登录页');
    window.location.href = '/home';
  }
});

子应用从 mount 函数中消费即可，这里将函数保存到 Vue 示例上。

export async function mount(props) {
  console.log('[vue] props from main framework', props);
  Vue.prototype.$onGlobalStateChange = props.onGlobalStateChange;
  Vue.prototype.$setGlobalState = props.setGlobalState;
  render(props);
}
// 使用
Vue.prototype.$setGlobalState({
  status: 2
});

但是使用时控制台警告提醒该 api 将要在 qiankun3.0 版本移除，不推荐使用

根据 Github Issue 中看到开发者建议将变量挂载到 window对象中，最终修改如下

const state = {
  status: 1,
};
// window 添加__qiankun__.$state全局变量
window.__qiankun__ = {};
window.__qiankun__.$state = state;

// 监听 window.__qiankun__.$state 变化
window.__qiankun__.$state = new Proxy(state, {
  set: function (target, key, value) {
    console.log('set', key, value);
    if (key === 'status' && value === 0) {
      alert('token 失效，跳转登录页');
      window.location.href = '/home';
    }
    return Reflect.set(target, key, value);
  },
});

进入子系统 console**.log**(window**.qiankun.**$state); 控制台成功打印

将子系统中的window.qiankun.$state.status设置为 0 成功被主应用监听到。

OpenCode 入门指南

Tue, 07 Apr 2026 00:00:00 GMT

OpenCode 入门指南

1. 前言

OpenCode 是一款开源的终端 AI 编程助手，类似于 Claude Code 和 Gemini CLI，能够直接在终端中与大语言模型对话，完成代码编写、调试、重构等开发任务。

与传统 IDE 插件不同，OpenCode 运行在终端环境中，天然适配服务器、远程开发等场景，同时支持灵活接入多种模型提供商，让你自由选择最适合的 AI 模型。

本指南将带你从零开始完成 OpenCode 的安装与配置，熟悉日常使用方式和常用命令，并介绍 oh-my-openagent 等进阶插件，帮助你充分释放 AI 辅助编程的潜力。

2. 配置网络代理

Node.js、OpenCode 等工具在安装过程中可能因网络原因下载缓慢甚至失败，建议先完成网络代理配置。

打开注册链接，注册一个账号：https://love.p6m6.com/#/register?code=sAkUiL1y
选择「入门精灵球」套餐，输入优惠码 耿鬼（0 元即可购买）
按页面提示下载代理软件，然后点击「导入订阅」
下载完成后，打开代理软件，把模式切换到「规则代理」，然后开启代理
打开浏览器访问 Google，如果能正常显示，说明代理配置成功了
终端中使用代理：打开代理软件的设置，找到「复制环境变量」相关选项，切换到 PowerShell 类型，将复制的内容粘贴到 PowerShell 终端中，之后在该终端中执行的下载操作都会走代理

macOS： 终端类型选择 bash 或 zsh，粘贴到终端（Terminal）中

Windows（WSL 环境下）： 终端类型选择 bash，粘贴到 WSL 终端中

提示： 每次打开新的终端窗口都需要重新粘贴环境变量，代理才会生效。

3. 安装

3.1 macOS

打开终端（Terminal），选择以下任一方式安装：

方式一：Homebrew（官方推荐）

brew install anomalyco/tap/opencode

方式二：一键安装脚本

curl -fsSL https://opencode.ai/install | bash

方式三：npm

npm install -g opencode-ai

3.2 Windows

Windows 下推荐通过 WSL 使用 OpenCode，这是官方最佳体验方案。

右键开始菜单 → Windows PowerShell（管理员） 或 终端（管理员）

第一步：安装 WSL

wsl --install

安装完成后重启计算机。重启后再次打开 PowerShell（管理员），输入以下命令完成环境初始化：

# 启动 WSL
wsl

# 根据提示设置用户名和密码

# 更新软件源
sudo apt update && sudo apt upgrade -y

# 安装必要依赖
sudo apt install -y curl git

第二步：安装 OpenCode

curl -fsSL https://opencode.ai/install | bash

3.3 验证安装

安装完成后，运行以下命令确认是否成功：

opencode -v
# 输出示例：1.2.24

4. 配置

创建并编辑配置文件：

macOS：

mkdir -p ~/.config/opencode && nano ~/.config/opencode/opencode.jsonc

Windows（WSL 环境下）：

mkdir -p ~/.config/opencode && nano ~/.config/opencode/opencode.jsonc

其他编辑方式（推荐）：
VS Code（最推荐，智能提示 + Schema 自动补全）
code ~/.config/opencode/opencode.jsonc
前提：在 WSL 中已安装 VS Code，或在 Windows 端使用 VS Code + Remote-WSL 扩展
Vim
vim ~/.config/opencode/opencode.jsonc
从 Windows 资源管理器直接编辑（无需进入 WSL）

在地址栏输入 \\wsl$\Ubuntu\home\你的WSL用户名\.config\opencode（将 Ubuntu 替换为你的发行版名，如 Ubuntu-22.04），然后用记事本或 Notepad++ 打开 opencode.jsonc 编辑

填入以下内容：

{
  "$schema": "https://opencode.ai/config.json",
  "disabled_providers": ["google-vertex", "google-vertex-anthropic"],
  "provider": {
    "cpa": {
      "name": "CPA",
      "npm": "@ai-sdk/openai-compatible",
      "options": {
        "baseURL": "你的服务地址",
        "apiKey": "你的 API Key"
      },
      "models": {
        "gpt-latest": {
          "name": "gpt-latest(high)",
          "cost": {
            "input": 2.5,
            "output": 15,
            "cache_read": 0.25,
            "cache_write": 0,
            "context_over_200k": {
              "input": 5,
              "output": 22.5,
              "cache_read": 0.5,
              "cache_write": 0,
            },
          },
        },
        "gpt-codex-latest": {
          "name": "gpt-codex-latest(xhigh)",
          "cost": {
            "input": 1.75,
            "output": 14,
            "cache_read": 0.175,
            "cache_write": 0,
          },
        },
      },
    }
  },
  "autoupdate": true,
}

提示：

gpt-latest 指向最新的 GPT 模型，当前为 GPT-5.4

gpt-codex-latest 指向最新的 GPT Codex 模型，当前为 GPT-5.3-codex

模型名称括号中的内容为思考量等级，可选值为 low、medium、high、xhigh。等级越高，模型能力越强，但 Token 消耗越大、响应速度越慢

5. 使用

首先进入你的项目目录：

# macOS
cd ~/project

# Windows（WSL 环境下）
cd /mnt/c/Users/你的用户名/project

Windows 路径与 WSL 路径的对应关系：

Windows 路径	WSL 路径
`C:\`	`/mnt/c/`
`D:\`	`/mnt/d/`
`C:\Users\用户名\Documents`	`/mnt/c/Users/用户名/Documents`

5.1 终端模式（TUI）

opencode

5.2 Web 模式

opencode web

6. 常用命令

6.1 CLI 命令（终端直接输入）

命令	说明
`opencode`	启动 TUI 交互界面（最常用）
`opencode -v`	显示版本号
`opencode -h`	显示帮助信息
`opencode upgrade`	升级到最新版本
`opencode run "你的提示"`	非交互模式，快速执行单次任务
`opencode models`	列出所有可用模型
`opencode session list`	查看历史会话
`opencode -s <session_id>`	使用指定会话
`opencode serve`	启动无头服务器（供 Desktop / Web 连接）
`opencode web`	启动 Web 界面
`opencode stats`	查看 Token 使用统计

6.2 TUI 内置命令（进入界面后输入 `/`）

命令	说明
`/connect`	连接或切换模型提供商
`/models`	查看并切换模型
`/init`	初始化项目（生成 AGENTS.md）
`/new`	新建会话
`/compact`	手动压缩上下文
`/undo`	撤销上一步操作
`/redo`	重做
`/share`	生成分享链接
`/help`	显示所有命令

7. 进阶配置

7.1 oh-my-openagent 插件

7.1.1 简介

oh-my-openagent（简称 OMO，前身为 oh-my-opencode）是 OpenCode 生态中最受欢迎的多代理插件。它将 OpenCode 从单一 AI 助手升级为一个高度自治的 AI 团队，通过 Sisyphus 主协调代理调度多个专业子代理并行工作，能够将复杂的软件工程任务自动化——几乎做到"交代任务后去喝杯咖啡，回来就完成了"。

7.1.2 核心功能

执行模式

Ultra Work 模式（ulw）

最核心的执行模式。输入 ulw + 任务描述，所有代理同时激活，自动规划、并行执行、自我纠错，持续运行直到任务完成，无需手动干预。

Ralph Loop（/ulw-loop）

自引用执行循环，与 Ultra Work 配合使用。代理会反复迭代，直到任务完全达成目标——适合需要多轮修改和验证的复杂任务。

深度初始化（/init-deep）

在项目目录树中自动生成分层的 AGENTS.md 文件，为每个代理提供分层、有作用域的上下文，既节省 Token 又提升代理对项目的理解能力。

规划模式（/start-work）

由 Prometheus 代理驱动的面试式规划流程。在编写任何代码之前，它会像真正的工程师一样向你提问、澄清需求、确定范围，然后生成详细的执行计划。

质量保障机制

IntentGate（意图门控）

在分类或执行操作前，先分析用户的真实意图，防止对提示词的字面误解。

Hashline（哈希锚定编辑）

代理读取的每一行都会标记内容哈希（如 11#VK|），编辑时引用这些标记，哈希不匹配的修改会被直接拒绝，从源头防止文件损坏。据官方报告，编辑成功率从 6.7% 提升到 68.3%。

Todo Enforcer（任务强制器）

自动将偏离主线的代理拉回正轨，确保当前任务不会被遗忘或搁置。

Comment Checker（注释检查器）

阻止低质量的 AI 生成注释，确保代码注释的专业性和可读性。

工具链集成

LSP 与 AST-Grep

LSP 工具：lsp_rename、lsp_goto_definition、lsp_find_references、lsp_diagnostics
AST-Grep：跨 25 种语言的模式感知搜索与重写

内置 MCP 服务

Exa — 网页搜索
Context7 — 官方文档查询
Grep.app — GitHub 代码搜索

Skill-Embedded MCPs（技能内嵌 MCP）

每个技能可携带自己的 MCP 服务器，按需启动、用完即销毁，不会占用上下文窗口。内置技能包括 playwright（浏览器自动化）、git-master（原子提交 / Rebase）、frontend-ui-ux（设计优先的 UI 开发）等。

Tmux 集成

完整的交互式终端支持，可在代理会话中运行 REPL、调试器和 TUI 应用程序。

智能模型路由

根据任务类型自动选择最合适的模型（如 Claude 做规划、GPT Codex 写代码），按类别而非具体模型分配，在节省 Token 的同时保持高效。

Claude Code 完全兼容

现有的所有 Hooks、Commands、Skills、MCPs 和插件均可直接使用，无需任何改动。

7.1.3 安装

进入 OpenCode 终端后，直接发送以下内容让 LLM 自动完成安装：

Install and configure oh-my-opencode by following the instructions here:
https://raw.githubusercontent.com/code-yeongyu/oh-my-openagent/refs/heads/dev/docs/guide/installation.md

安装成功后，重新进入 OpenCode，默认模式变为 Sisyphus (Ultraworker) 即表示安装成功。

7.1.4 配置模型

oh-my-openagent 默认配置的模型为 GPT、Claude、Gemini 等官方模型。由于我们使用的是 CPA 提供商，需要手动修改配置文件。

编辑 oh-my-opencode 配置文件：

macOS：

code ~/.config/opencode/oh-my-opencode.json

Windows（WSL 环境下）：

code ~/.config/opencode/oh-my-opencode.json

也可使用 nano 或 vim 替代 code，编辑方式参见上方第 4 节的说明。

将内容替换为：

{
  "$schema": "https://raw.githubusercontent.com/code-yeongyu/oh-my-opencode/dev/assets/oh-my-opencode.schema.json",
  "agents": {
    "sisyphus": {
      "model": "cpa/gpt-latest",
      "variant": "high"
    },
    "hephaestus": {
      "model": "cpa/gpt-codex-latest",
      "variant": "xhigh"
    },
    "oracle": {
      "model": "cpa/gpt-latest",
      "variant": "xhigh"
    },
    "librarian": {
      "model": "cpa/gpt-codex-latest",
      "variant": "high"
    },
    "explore": {
      "model": "cpa/gpt-codex-latest",
      "variant": "high"
    },
    "multimodal-looker": {
      "model": "cpa/gpt-latest",
      "variant": "high"
    },
    "prometheus": {
      "model": "cpa/gpt-latest",
      "variant": "xhigh"
    },
    "metis": {
      "model": "cpa/gpt-latest",
      "variant": "xhigh"
    },
    "momus": {
      "model": "cpa/gpt-latest",
      "variant": "xhigh"
    },
    "atlas": {
      "model": "cpa/gpt-latest",
      "variant": "high"
    }
  },
  "categories": {
    "visual-engineering": {
      "model": "cpa/gpt-latest",
      "variant": "high"
    },
    "ultrabrain": {
      "model": "cpa/gpt-latest",
      "variant": "xhigh"
    },
    "deep": {
      "model": "cpa/gpt-codex-latest",
      "variant": "xhigh"
    },
    "artistry": {
      "model": "cpa/gpt-latest",
      "variant": "high"
    },
    "quick": {
      "model": "cpa/gpt-codex-latest",
      "variant": "high"
    },
    "unspecified-low": {
      "model": "cpa/gpt-codex-latest",
      "variant": "high"
    },
    "unspecified-high": {
      "model": "cpa/gpt-latest",
      "variant": "high"
    },
    "writing": {
      "model": "cpa/gpt-latest",
      "variant": "high"
    }
  }
}

说明： 以上配置根据各代理和分类的职责特点，在两个可用模型之间做了差异化分配：需要深度推理的角色（规划、架构、审查）使用 gpt-latest + xhigh；需要深度编码的角色使用 gpt-codex-latest + xhigh；轻量搜索和快速任务使用 gpt-codex-latest + high（成本更低）；通用协调和执行角色使用 gpt-latest + high。

7.1.5 Agents 与 Categories 参考

Agents（专业代理角色）

代理名称	主要职责	推荐模型	说明
sisyphus	主协调者	Claude Opus / GLM-5	任务拆解、分配子代理、并行调度、驱动任务完成，所有复杂任务的入口
hephaestus	自主深度编码工匠	GPT-5.3-codex	探索代码库、研究模式、端到端自主实现功能，擅长深度编码
prometheus	战略规划师	Claude Opus / GLM-5	面试式规划——向用户提问、明确范围、构建详细计划后再动手
oracle	架构与调试专家	高推理能力模型	架构决策、疑难 bug 诊断、技术方案验证
librarian	知识与文档管理员	通用模型	代码和文档搜索、解释现有代码、生成说明文档
explore	快速代码库探索者	轻量快速模型	快速扫描和 Grep，定位修改点、收集上下文证据
multimodal-looker	多模态 / 视觉分析专家	多模态模型	处理图片、UI 设计稿、截图，转化为代码或建议
metis	预规划分析师	高推理能力模型	与 Prometheus 协作，识别风险、边缘情况、依赖关系、方案权衡
momus	严苛审查者 / 质量批评家	高推理能力模型	代码与计划审查，发现 bug、安全与性能问题
atlas	执行大师 / 部署者	通用模型	最终集成、部署、环境配置、验证生产就绪

注意： "推荐模型"列为官方建议的理想配置。由于我们当前只接入了 CPA 提供商，实际配置中统一使用 cpa/gpt-latest。

Categories（任务分类路由）

Sisyphus 协调代理在分配任务时，会根据任务特征自动匹配以下分类，每个分类对应不同的模型和努力级别：

分类名称	适用领域	努力级别	常见场景
visual-engineering	前端、UI/UX、视觉设计	高（视觉 / 多模态）	构建界面、CSS、组件、设计系统
ultrabrain	极难逻辑、重型架构、复杂算法	极高（长思考）	系统设计、分布式系统、性能关键逻辑
deep	目标导向的深度问题解决	中高（自主执行）	端到端功能实现、深度重构、跨模块修改
artistry	创意 / 非常规解决方案	高（发散思考）	发明新模式、巧妙优化、跳出框框的思路
quick	琐碎、快速的小修改	极低（最小思考）	拼写错误、一行改动、快速重命名
unspecified-low	未分类的简单通用任务	低	杂项小任务、样板代码
unspecified-high	未分类的重要复杂任务	高	重要但未匹配分类的任务
writing	文档、注释、README	自然语言优先	写文档、变更日志、博客、测试描述

除以上内置分类外，oh-my-openagent 也支持自定义分类，可根据团队需求扩展。

7.2 MCP

MCP（Model Context Protocol，模型上下文协议）是一种标准化协议，允许 AI 模型访问外部工具和数据源。通过配置 MCP，OpenCode 可以连接本地脚本、远程知识库或专业服务，从而获得更强的能力。

在配置文件中添加 mcp 字段即可配置（macOS：~/.config/opencode/opencode.jsonc，Windows：%USERPROFILE%\.config\opencode\opencode.jsonc）。OpenCode 支持两种类型的 MCP 服务：

远程（remote）：连接远程 HTTP/HTTPS 端点，无需本地安装
本地（local）：运行本地命令或脚本作为 MCP 服务

组合配置示例

以上服务可同时启用，合并写入配置文件的 mcp 字段中：

{
  "$schema": "https://opencode.ai/config.json",
  // ... 其他配置（provider 等）
  "mcp": {
    "context7": {
      "type": "remote",
      "url": "https://mcp.context7.com/mcp",
    },
    "gh_grep": {
      "type": "remote",
      "url": "https://mcp.grep.app",
    },
  },
}

常用管理命令

命令	说明
`opencode mcp add`	交互式添加 MCP 服务
`opencode mcp list`	列出已配置的所有 MCP 服务
`opencode mcp auth <名称>`	对指定服务进行鉴权
`opencode mcp debug <名称>`	检查连接状态和服务健康度

提示： MCP 服务会增加上下文消耗，建议只启用当前需要的服务，避免因工具过多导致 Token 超限。

7.3 推荐技能（Skill）

Skill 是 OpenCode 的技能插件系统，每个技能包含领域专属的指令、内嵌 MCP 服务和预设权限，安装后在相关场景中自动激活，无需手动调用。

ui-ux-pro-max — AI 驱动的 UI/UX 设计智能

适用范围：仅限前端项目。 该技能专为前端 UI/UX 开发设计，不适用于后端、CLI 工具、数据处理等非前端场景。如果你的项目不涉及界面开发，无需安装此技能。

ui-ux-pro-max 是一款面向前端开发者的设计智能技能。当你向 AI 描述 UI 需求时，它会自动生成完整的设计系统（配色、字体、布局、风格、反模式检查），然后基于该系统输出高质量代码。

核心能力

设计系统生成器：用自然语言描述项目，自动输出完整设计系统——布局模式、视觉风格、配色方案、字体组合、特效建议及反模式检查清单
161 条行业推理规则：覆盖 SaaS、金融科技、电商、医疗、餐饮、游戏、Web3 等细分领域，每条规则包含推荐布局、风格优先级、色彩基调和排版建议
67 种 UI 风格：Glassmorphism、Neumorphism、Brutalism、Bento Grid、Liquid Glass、Cyberpunk UI、Aurora UI 等主流与前沿风格
57 组精选字体搭配：附带 Google Fonts 链接，开箱即用
161 套配色方案：按产品类型匹配，确保行业适配性
25 种图表类型：适用于仪表盘和数据分析场景

支持的技术栈

类别	框架
Web（默认）	HTML + Tailwind CSS
React 生态	React、Next.js、shadcn/ui
Vue 生态	Vue、Nuxt.js、Nuxt UI
其他 Web	Svelte、Astro
iOS	SwiftUI
Android	Jetpack Compose
跨平台	React Native、Flutter

安装

前置依赖：Python 3.x

# 安装 CLI
npm install -g uipro-cli

# 进入项目目录后初始化（指定 opencode 作为 AI 工具）
cd /path/to/your/project
uipro init --ai opencode

使用方式

安装后无需额外操作，当你在 OpenCode 中发起 UI/UX 相关请求时（如 build、design、create、implement、review、fix、improve），技能会自动激活并执行以下流程：

分析你的需求，匹配产品类型和行业规则
自动生成完整设计系统（配色、字体、布局、风格）
基于设计系统生成代码，确保色彩、间距、最佳实践一致
交付前自动检查常见反模式

提示： 在提示词中注明技术栈（如"用 Next.js + shadcn/ui"），可获得更精准的代码输出。未指定时默认使用 HTML + Tailwind CSS。

从 Warp 迁移到 Ghostty

Fri, 26 Dec 2025 00:00:00 GMT

随着 Claude Code、Cursor Agent 等终端 AI 工具的兴起，终端不再只是敲命令的地方，而是主力开发环境。一个高效、轻量、可控的终端模拟器变得前所未有的重要。

::github{repo="ghostty-org/ghostty"}

为什么离开 Warp

Warp 是一款基于 Rust 开发的现代化终端，主打 AI 辅助、块编辑、命令搜索等创新功能。我使用了大约一年，确实带来了不少便利，但随着使用深入，一些问题逐渐暴露：

资源占用高：GPU 渲染 + 丰富功能 = 明显的内存和 CPU 开销

启动慢：冷启动 2-3 秒，打断工作心流
强制登录：必须注册账号才能使用，终端工具为什么需要账号？
内置 AI 鸡肋：实际工作中更多依赖 Claude Code，内置 AI 几乎没用过
闭源：无法自定义或贡献代码

为什么选择 Ghostty

Ghostty 由 HashiCorp 联合创始人 Mitchell Hashimoto 开发，使用 Zig 语言编写。它的设计理念恰好解决了我对 Warp 的所有不满：

极速启动：GPU 加速渲染，启动几乎瞬间完成
资源占用低：内存仅 Warp 的 1/3

完全开源：MIT 协议，社区活跃
无需账号：开箱即用
原生体验：遵循 macOS 设计规范
配置简洁：单文件配置，语法直观

安装

brew install --cask ghostty

也可以从官网直接下载。

配置

Ghostty 使用单文件配置 ~/.config/ghostty/config：

mkdir -p ~/.config/ghostty && touch ~/.config/ghostty/config

# 安装字体（配置中使用）
brew install --cask font-maple-mono-nf-cn

我的完整配置：

# ========== 字体设置 ==========
# 主字体：Maple Mono NF CN
font-family = Maple Mono NF CN
font-size = 14
# 行高设置（Maple Font 官方推荐 1.8 行高，实测最佳值为 30%）
adjust-cell-height = 25%
# 启用 Maple Mono 连字和字体特性（官方推荐配置）
# calt: 基本连字 | zero: 带点的零 | cv01: 去除间隙
# ss01: 分离等号 | ss02: 分离比较符 | ss07: 强制 >> 连字 | ss08: 双箭头
font-feature = calt, cv01, cv03, ss01, ss02, ss03
# 字体粗细（让字体更粗，类似 Tabby 600/700 配置）
font-thicken = true

# ========== 主题设置 ==========
theme = GitHub Dark Dimmed

# ========== 窗口尺寸 ==========
# 设置窗口初始大小（以字符为单位）
window-width = 125
window-height = 35
# 记住窗口位置和大小
window-save-state = always

# ========== 光标设置 ==========
# 光标样式：block（粗方块光标，类似 Tabby）
cursor-style = bar
# 光标闪烁
cursor-style-blink = true
# 光标颜色（使用明亮的橙色，更醒目）
cursor-color = #ff9e64
# 光标下的文本颜色
cursor-text = #1a1b26

# ========== 窗口外观 ==========
# 窗口内边距
window-padding-x = 8
window-padding-y = 8
# 窗口装饰样式（macOS）- tabs 样式支持标签栏
macos-titlebar-style = tabs
# 保持窗口阴影
macos-window-shadow = true

# ========== 其他优化 ==========
# 背景略微透明（可选，1.0 为完全不透明）
background-opacity = 0.97
# 滚动缓冲区大小（单位：字节）
# 适合 Claude Code 等长对话应用
scrollback-limit = 200000000
# 在输入时隐藏鼠标
mouse-hide-while-typing = true

# ========== Shell Integration ==========
# 启用 shell 集成，但明确禁用 cursor 特性（避免覆盖我们的光标设置）
shell-integration = zsh
shell-integration-features = no-cursor,title
keybind = shift+enter=text:\x1b\r
keybind = ctrl+enter=text:\\\r

主题

Ghostty 内置大量主题：

ghostty +list-themes

theme = tokyonight
theme = catppuccin-mocha
theme = dracula
theme = nord
theme = GitHub Dark Dimmed  # 我在用的

自定义主题可放在 ~/.config/ghostty/themes/ 目录下。

迁移调整

Warp 开箱即用，Ghostty 需要手动配置。但这也意味着更高的可控性。

命令行增强

Warp 内置了历史补全、语法高亮。在 Ghostty 中通过 zsh 插件实现：

brew install zsh-autosuggestions zsh-syntax-highlighting zsh-completions

在 ~/.zshrc 中添加以下配置：

# -----------------------
# Homebrew Zsh completions (must be BEFORE oh-my-zsh / compinit)
# -----------------------
if type brew &>/dev/null; then
  export BREW_PREFIX="$(brew --prefix)"
  FPATH="$BREW_PREFIX/share/zsh-completions:$FPATH"
  FPATH="$BREW_PREFIX/share/zsh/site-functions:$FPATH"
fi

# -----------------------
# Zsh plugins (Homebrew)
# -----------------------

# zsh-autosuggestions - 根据历史命令自动补全建议（灰色提示）
if [[ -n "$BREW_PREFIX" && -f "$BREW_PREFIX/share/zsh-autosuggestions/zsh-autosuggestions.zsh" ]]; then
  source "$BREW_PREFIX/share/zsh-autosuggestions/zsh-autosuggestions.zsh"
fi

# zsh-syntax-highlighting - 命令语法高亮（必须放在最后）
if [[ -n "$BREW_PREFIX" && -f "$BREW_PREFIX/share/zsh-syntax-highlighting/zsh-syntax-highlighting.zsh" ]]; then
  source "$BREW_PREFIX/share/zsh-syntax-highlighting/zsh-syntax-highlighting.zsh"
fi

:::note 如果使用 Oh My Zsh，不要将 zsh-autosuggestions 和 zsh-syntax-highlighting 放入 plugins=() 中，否则会与 Homebrew 安装的版本重复加载。 :::

这三个插件分别提供：

zsh-autosuggestions：历史命令补全（按 → 确认）
zsh-syntax-highlighting：语法高亮，错误命令显示红色
zsh-completions：增强的 Tab 补全

提示符主题 - Spaceship

Warp 有漂亮的内置提示符，Ghostty 中可以用 Spaceship 实现类似效果。

1. 安装 Oh My Zsh（前置条件）

Spaceship 依赖 Oh My Zsh 框架，需先安装：

sh -c "$(curl -fsSL https://raw.githubusercontent.com/ohmyzsh/ohmyzsh/master/tools/install.sh)"

:::warning 安装脚本会将原有 ~/.zshrc 备份为 ~/.zshrc.pre-oh-my-zsh，并生成新的配置文件。安装完成后需手动将原配置迁移到新文件中。 :::

2. 安装 Spaceship 主题

git clone https://github.com/spaceship-prompt/spaceship-prompt.git \
  "${ZSH_CUSTOM:-$HOME/.oh-my-zsh/custom}/themes/spaceship-prompt" --depth=1

# 创建符号链接
ln -sf \
  "${ZSH_CUSTOM:-$HOME/.oh-my-zsh/custom}/themes/spaceship-prompt/spaceship.zsh-theme" \
  "${ZSH_CUSTOM:-$HOME/.oh-my-zsh/custom}/themes/spaceship.zsh-theme"

3. 启用主题

Oh My Zsh 安装后会自动生成 ~/.zshrc，找到 ZSH_THEME 那一行，修改为：

export ZSH="$HOME/.oh-my-zsh"
ZSH_THEME="spaceship"
source "$ZSH/oh-my-zsh.sh"

Spaceship 会显示 Git 分支、Node 版本、执行时间等上下文信息，非常适合开发者使用。

历史命令搜索 - Atuin

Warp 的历史命令弹出列表很方便，Atuin 是更强大的替代品：

brew install atuin

# 初始化（添加到 ~/.zshrc）
eval "$(atuin init zsh)"

# 导入现有的 shell 历史记录
atuin import auto

Atuin 配置文件位于 ~/.config/atuin/config.toml，我的配置如下：

# ↑ 键触发的过滤范围：全局（所有目录/会话/主机）
filter_mode_shell_up_key_binding = "global"

# ↑ 键触发的搜索模式：前缀匹配（适合 ssh、git 等命令）
search_mode_shell_up_key_binding = "prefix"

# 紧凑样式
style = "compact"

# 内联高度（行数）
inline_height = 14

# 关闭预览（命令太长时的预览）
show_preview = false

# 关闭帮助行和标签栏，界面更简洁
show_help = false
show_tabs = false

# 回车直接执行命令（按 Tab 可编辑）
enter_accept = true

[sync]
# 启用 sync v2
records = true

:::tip 配置完成后，按 ↑ 键即可弹出历史命令列表，输入关键字即可快速筛选。 :::

Atuin 的优势：

全文搜索：Ctrl+R 弹出交互式搜索
跨设备同步：可选云端同步
统计分析：命令使用频率统计
上下文感知：按目录、会话筛选

对比

对比项	Warp	Ghostty
启动速度	2-3 秒	< 0.5 秒
内存占用	~600 MB	~100 MB
开源	❌	✅
需要账号	✅	❌
内置 AI	✅	❌
块编辑	✅	❌
自定义程度	中	高

快捷键

操作	快捷键
水平分屏	`Cmd+D`
垂直分屏	`Cmd+Shift+D`
切换分屏	`Cmd+[` / `Cmd+]`
关闭分屏	`Cmd+W`
打开配置	`Cmd+Shift+,`

:::tip 修改配置文件后 Ghostty 会自动重载，无需重启。 :::

总结

Warp 像一辆带自动驾驶的车；Ghostty 更像一台手动挡。

更累，但我终于知道每个动作是谁做的。

让等待可见：起名场景的流式输出优化实践

Sun, 21 Dec 2025 00:00:00 GMT

功能背景

用户在小程序里填好宝宝信息（姓氏、性别、出生时间），点击"开始智能起名"，期望快速拿到一组可直接参考、解释清晰的名字建议。

但起名不是简单地"吐出几个字"。为了让建议更可信、更方便用户决策，页面需要展示多个模块：

八字分析与取名方向：先告诉用户整体思路
多个名字建议：通常 5~10 个
每个名字的详细解释：寓意、五行补益、读音搭配、综合评分等

内容越完整，用户越好做决定——但生成时间也越长。

原方案的问题

优化前的交付方式是"一次性整包返回"：

用户点击"开始起名"
页面进入 loading 状态
后端调用大模型生成完整的结构化 JSON
等 JSON 全部生成完毕后，一次性返回前端
页面拿到完整结果后，一次性渲染所有模块

工程上很直观，但用户体验上把整个过程变成了黑盒。

用户的真实感受

用户不是怕慢，而是怕"什么都看不到的慢"。

在旧流程里，用户只能看到一个"加载中"——没有进展、没有反馈、不知道还要等多久。

这导致了几个典型问题：

怀疑卡住：反复点击按钮，产生重复请求
提前放弃：看不到希望，直接退出
感知放大：即使后端已经在生成，用户也完全不知道

问题本质

不是内容太多，而是交付方式太"整包"。

打个比方：

旧方案像交作业：必须写完整篇论文才能交
用户体验像等快递：物流不更新，完全不知道进度

我们想要的是：

起名可以像"直播"一样，生成一点就展示一点。

优化目标

聚焦起名场景，我们定了三个核心目标：

更早出现有价值的内容：优先展示八字分析，而不是空等
名字逐条出现：边看边等，不必等全部生成完
明确的进度反馈：避免用户误以为卡住或已结束

目标不是"让模型变快"，而是让等待从"黑盒"变成"有反馈、有进展"。

方案设计

整体思路：分段输出 + 渐进渲染

把起名结果从"单次大返回"改成"多阶段流式输出"：

┌─────────────┐     ┌─────────────┐     ┌─────────────┐
│  八字分析   │ ──▶ │  名字 1     │ ──▶ │  名字 2     │ ──▶ ...
│  (先输出)   │     │  (追加)     │     │  (追加)     │
└─────────────┘     └─────────────┘     └─────────────┘
      ↓                   ↓                   ↓
   用户开始阅读       结果在增长           持续有反馈

阶段 1：先输出八字分析

八字分析是用户最想先看到的"方向性信息"。它一出现，用户就能开始阅读，并对接下来的名字建议建立期待。

阶段 2：名字逐条追加

名字建议不需要等全部生成完再展示。每生成一条，就在页面上追加一条，让结果持续"增长"。

阶段 3：加载中提示卡片

当用户看到八字分析和 1~2 个名字后，最容易产生新疑问：

"怎么不动了？是不是卡住了？"

因此我们增加了一个明确的提示模块：

当已出现部分结果、但系统仍在生成时
页面展示"剩余模块正在加载"的卡片
卡片包含进度提示，如"已生成 2/5 个名字，更多内容加载中…"

这张卡片的价值不是"加个转圈"，而是给用户稳定的心理预期：结果还在来，我可以先看已有内容。

技术实现要点

通信协议：SSE（Server-Sent Events）

我们选择 SSE 而非 WebSocket，原因是：

起名是单向推送场景，不需要双向通信
SSE 基于 HTTP，实现简单、兼容性好
自动重连机制，对弱网更友好

基本的数据格式设计：

// 每个 SSE 事件的 payload 结构
interface StreamChunk {
  type: 'bazi' | 'name' | 'done' | 'error';
  data: BaziAnalysis | NameSuggestion | null;
  progress?: {
    current: number;
    total: number;
  };
}

前端状态管理

使用状态机管理整个流式过程：

type StreamState =
  | { status: 'idle' }
  | { status: 'loading'; bazi: null; names: [] }
  | { status: 'streaming'; bazi: BaziAnalysis; names: NameSuggestion[] }
  | { status: 'done'; bazi: BaziAnalysis; names: NameSuggestion[] }
  | { status: 'error'; error: string };

核心处理逻辑：

const eventSource = new EventSource('/api/naming/stream');

eventSource.onmessage = (event) => {
  const chunk: StreamChunk = JSON.parse(event.data);

  switch (chunk.type) {
    case 'bazi':
      setState(prev => ({ ...prev, bazi: chunk.data }));
      break;
    case 'name':
      setState(prev => ({
        ...prev,
        names: [...prev.names, chunk.data],
        progress: chunk.progress
      }));
      break;
    case 'done':
      setState(prev => ({ ...prev, status: 'done' }));
      eventSource.close();
      break;
    case 'error':
      setState({ status: 'error', error: chunk.data });
      eventSource.close();
      break;
  }
};

渲染优化

为了让追加动画更流畅，名字卡片使用了简单的入场动画：

.name-card {
  animation: fadeInUp 0.3s ease-out;
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

边界情况处理

网络中断

SSE 自带重连机制，断开后会自动尝试重连
前端记录已接收的 progress.current，重连时带上偏移量
后端支持断点续传，避免重复生成

生成失败

单个名字生成失败：跳过该条，继续生成下一个，最终告知用户"部分内容生成失败"
整体失败：展示错误提示 + 重试按钮，已展示的内容保留

用户中途离开

页面隐藏时暂停渲染（使用 visibilitychange 事件）
返回时恢复，避免后台持续消耗资源

优化效果

指标	优化前	优化后	变化
首屏内容出现时间	~8s	~2s	-75%
用户等待期间跳出率	12%	4%	-67%
重复点击率（误操作）	8%	1.5%	-81%
用户满意度评分	3.8	4.5	+18%

数据来源：优化上线后两周的埋点统计

适用场景延伸

这套"流式输出 + 渐进渲染"的模式，适用于所有内容长、生成慢、可拆分的 AI 场景：

AI 报告生成：体检报告、财务分析、竞品调研
长文本创作：营销文案、文章大纲、多轮对话摘要
多步骤任务：表单智能填充、代码生成、翻译校对
搜索增强：RAG 场景下的多源结果聚合

核心判断标准：

结果是否可以拆成多个独立模块？
用户是否可以"边看边等"？
先出现的内容是否有独立价值？

如果三个答案都是"是"，就值得考虑流式输出。

小结

起名这类"内容长、结构化强"的 AI 能力，真正影响体验的往往不是"最终花多少秒"，而是：

用户在前几秒能不能看到价值
系统有没有把进度讲清楚
页面在生成过程中是不是仍然可用

把起名改成流式展示，本质上是在做一件事：

把不可见的等待，变成可见的进展。

扫码体验

想亲自感受流式输出的效果？扫描下方二维码，立即体验智能起名功能：

氛围编程（Vibe Coding）入门指南：让 AI 帮你写代码

Fri, 19 Dec 2025 00:00:00 GMT

一、什么是氛围编程？

一个新概念的诞生

2025 年 2 月，Andrej Karpathy（前特斯拉 AI 总监、OpenAI 联合创始人）在社交媒体上提出了一个新词：氛围编程（Vibe Coding）。

他这样描述：

"你完全沉浸在氛围中，拥抱指数级增长，忘掉代码的存在。"

听起来有点玄乎？其实很简单：

氛围编程 = 用自然语言告诉 AI 你想要什么，让它帮你写代码。

你不再需要一行一行敲代码，而是像和同事沟通一样，描述清楚需求，AI 就能帮你实现。

AI 编程工具的演进

在正式开始之前，我们先了解一下目前市面上的 AI 编程工具。它们大致可以分为三类：

🌐 第一类：网页对话型

代表：DeepSeek、豆包、ChatGPT
特点：像一位"博学的顾问"，你问它答
局限：它看不到你的代码，你需要手动复制粘贴

🔌 第二类：IDE 插件型

代表：通义灵码、GitHub Copilot、Cursor
特点：像一位"贴心的副驾"，能在编辑器里帮你补全代码
局限：视野局限于当前文件，无法理解整个项目

🤖 第三类：AI Agent 型

代表：Claude Code、Codex CLI、Gemini CLI
特点：像一位"全能的开发者"，能理解整个项目并直接操作文件
局限：需要一点命令行基础（但别担心，本文会教你）

本文要介绍的就是第三类 —— AI Agent。

什么是 Claude Code？

Claude Code 是 Anthropic 公司（Claude 模型的研发方）推出的命令行 AI 编程助手。

💡 打个比方：如果把 DeepSeek 比作"只能动嘴的军师"，那么 Claude Code 就是"既能动脑又能动手的全能助理"。

它不仅能思考和回答问题，还能直接操作你的项目（当然，每次操作前都会征求你的同意）：

🔍 读取文件：自动分析整个项目结构，比如"你的 React 项目有哪些组件"
✏️ 编辑文件：直接修改代码并保存，不用你手动复制粘贴
💻 运行命令：执行 npm test、git commit 等命令，帮你验证代码

为什么是命令行？

你可能会问："命令行黑乎乎的，看起来好复杂，为什么不做成图形界面？"

这是个好问题。在 AI 编程场景下，命令行反而是最高效的选择：

直接调用开发工具：Git、npm、测试框架本身就在命令行运行，AI 可以直接使用
全局视野：IDE 插件只能看当前文件，命令行工具能分析整个项目
并行工作：你可以在 IDE 里写代码，同时让终端里的 AI 帮你写测试

我的真实体验

作为一名前端开发，我这段时间一直在使用 AI Agent 工具。

目前已经基本实现：100% 代码由 AI 生成，我只负责描述需求 + 验收测试。

下图是一个完全由 AI 生成的 BI 即席分析页面：

二、手把手安装配置

🎯 目标：完成本章后，你就能在终端里和 AI 对话写代码了。

第一步：安装 Claude Code

打开你的终端（macOS 按 Cmd + 空格 搜索"终端"，Windows 搜索"PowerShell"），输入以下命令：

macOS 用户：

curl -fsSL https://claude.ai/install.sh | bash

Windows 用户（PowerShell）：

irm https://claude.ai/install.ps1 | iex

通过 npm 安装（推荐前端开发者）：

npm install -g @anthropic-ai/claude-code

💡 小提示：如果你是前端开发，电脑上通常已经安装了 Node.js，直接用 npm 安装最省事。

第二步：选择 AI 模型

安装完成后，你需要告诉 Claude Code 使用哪个 AI 模型。这里有两条路：

方案 A：官方订阅

Claude 官方提供 Max 订阅服务，每月 $200 美元，可以直接使用最强的 Claude 模型。

⚠️ 提醒：国内用户可能无法直接访问 Anthropic 官方服务，需要特殊网络环境。

方案 B：接入第三方模型（推荐国内用户）

好消息是 Claude Code 是开源的，支持接入国产大模型！以下是几个不错的选择：

🔥 清华智谱 GLM-4.6

官网：bigmodel.cn
特点：国产模型，中文理解能力强

💰 MiniMax M2

官网：minimaxi.com
特点：性价比高，接入简单

🌋 火山引擎 doubao-seed-code

官网：volcengine.com
特点：字节跳动旗下，适合代码生成

虽然这些模型与顶级模型（Claude Opus 4.5、GPT-5.1）有差距，但价格便宜、访问稳定，非常适合入门学习。

第三步：配置第三方模型

下面以 MiniMax M2 为例，手把手教你配置：

1️⃣ 获取 API Key

打开 MiniMax 开放平台
注册并登录账号
进入控制台，创建一个 API Key（一串类似密码的字符串）
复制保存好这个 Key

2️⃣ 创建配置文件

在你的用户目录下，创建或编辑 ~/.claude/settings.json 文件：

{
  "alwaysThinkingEnabled": true,
  "env": {
    "ANTHROPIC_AUTH_TOKEN": "把你的API Key粘贴到这里",
    "ANTHROPIC_BASE_URL": "https://api.minimaxi.com/anthropic",
    "ANTHROPIC_MODEL": "MiniMax-M2",
    "API_TIMEOUT_MS": "3000000"
  }
}

💡 路径说明：

macOS：~ 就是 /Users/你的用户名，完整路径是 /Users/你的用户名/.claude/settings.json

Windows：完整路径是 C:\Users\你的用户名\.claude\settings.json

第四步：创建系统提示词（进阶配置）

这一步是可选的，但强烈推荐。系统提示词可以让 AI 按照你的习惯工作，比如用中文回复、遵循特定的代码规范等。

创建 ~/.claude/CLAUDE.md 文件，写入你的个性化指令。

下面是我自己在用的配置（你可以直接复制使用）：

### 🌏 语言规范
Always respond in Chinese-simplified

1. 只允许使用简体中文回答 - 所有思考、分析、解释和回答都必须使用简体中文
2. 中文优先 - 优先使用中文术语、表达方式和命名规范
3. 中文注释 - 生成的代码注释和文档都应使用中文
4. 中文思维 - 思考过程和逻辑分析都使用中文进行

### 🎯 基本原则（不可违反）

1. **质量第一**：代码质量和系统安全不可妥协
2. **思考先行**：编码前必须深度分析和规划
3. **工具优先**：优先使用验证过的最佳工具链
4. **透明记录**：关键决策和变更必须可追溯
5. **持续改进**：从每次执行中学习和优化
6. **结果导向**：以目标达成为最终评判标准

---

## 📊 质量标准

### 🏗️ 工程原则

- **架构设计**：遵循 SOLID、DRY、关注点分离、YAGNI（精益求精）
- **代码质量**：
  - 清晰命名、合理抽象
  - 必要的中文注释（关键流程、核心逻辑、重点难点）
  - 删除无用代码，修改功能不保留旧的兼容性代码
  - 若无显式要求不要编写任何兼容代码
- **完整实现**：禁止 MVP/占位/TODO，必须完整可运行

<plan_tool_usage>
- 对于中等规模或更大规模的任务（例如：多文件修改、添加新的接口/命令行工具（CLI）功能，或进行多步骤的调查），在执行任何代码或工具操作之前，必须在 TODO/plan 工具中创建并维护一个详细的计划。
- 创建 2-5 个里程碑或目标项；避免包含过于细小的步骤或重复性的操作任务（例如：“打开文件”、“运行测试”等）。切勿使用像“实现整个功能”这样的笼统描述。
- 在工具中维护任务的状态：任何时候只能有一个任务处于 “in_progress”（进行中）状态；任务完成后请将其标记为 “completed”（已完成）；及时更新任务状态（切勿连续多次调用工具而不进行任何更新）。切勿直接将任务状态从 “pending”（待处理）变为 “completed”：必须先将其设置为 “in_progress”（如果任务确实可以立即完成，可以在同一条更新中同时将其标记为 “in_progress” 和 “completed”）。切勿事后批量完成多个任务。
- 在任务结束时，确保所有任务要么已完成，要么已被明确取消或推迟。
- 任务结束时的基本规则：所有任务的状态应为 “in_progress” 或 “pending” 均为零；对于未完成的任务，需明确说明其原因并完成它们或取消/推迟它们。
- 如果你需要通过聊天来说明一个中等复杂性的任务计划，请将该计划同步到 TODO/plan 工具中，并在后续更新中引用这些任务项。
- 对于非常简单、耗时较短的任务（例如：修改单个文件，代码量不超过 10 行），你可以省略使用该工具。如果仍然需要通过聊天来说明任务计划，只需用 1-2 句话简洁地描述任务目标，无需包含具体的操作步骤或详细的任务清单。
- 在进行任何非琐碎的代码修改之前（例如：应用补丁、多文件编辑或进行复杂的系统配置），请确保当前计划中有一个与你要执行的操作相匹配的任务被标记为 “in_progress”；如有必要，请先更新计划。
- 如果任务范围发生变化（例如：需要拆分、合并或重新排列任务项），请在继续执行之前更新计划。切勿在编码过程中让计划状态变得过时。
- 任何时候都只能有一个任务处于 “in_progress” 状态；如果出现多个任务同时处于 “inProgress” 状态，请立即调整状态，确保只有当前阶段的任务处于进行中。
<plan_tool_usage>

### ⚡ 性能标准

- **算法意识**：考虑时间复杂度和空间复杂度
- **资源管理**：优化内存使用和 IO 操作
- **边界处理**：处理异常情况和边界条件

### 🧪 测试要求

- **测试驱动**：可测试设计，单元测试覆盖,后台执行单元测试时，最大不能超过 60s，避免任务卡死。
- **质量保证**：静态检查、格式化、代码审查
- **持续验证**：自动化测试和集成验证

---

## 🛠️ 工具使用指南

### 🔍 代码分析

- **首选**：`Serena`符号工具（`get_symbols_overview` → `find_symbol`）
- **备选**：`Read` + `Grep` + `Glob`组合
- **降级**：直接文件读取（需记录决策依据）

### 📚 知识查询

- **技术文档**：`Context7`（先 `resolve-library-id` 后 `get-library-docs`）
- **网页搜索**：`extra`
- **GitHub 文档**：`DeepWiki`

### 💭 分析规划

- **深度思考**：`Sequential-Thinking`（规划前必须执行）
- **知识管理**：`Memory`（读取约束，存储决策）

### 🔧 命令执行标准

**路径处理：**

- 始终使用双引号包裹文件路径
- 优先使用正斜杠 `/` 作为路径分隔符
- 确保跨平台兼容性

**工具优先级：**

1. `rg` (ripgrep) > `grep` 用于内容搜索
2. 专用工具 (Read/Write/Edit) > 系统命令
3. 批量工具调用提高效率

---

## ⚠️ 危险操作确认机制

### 🚨 高风险操作清单

执行以下操作前**必须获得明确确认**：

- **文件系统**：删除文件/目录、批量修改、移动系统文件
- **代码提交**：`git commit`、`git push`、`git reset --hard`
- **系统配置**：修改环境变量、系统设置、权限变更
- **数据操作**：数据库删除、结构变更、批量更新
- **网络请求**：发送敏感数据、调用生产环境 API
- **包管理**：全局安装/卸载、更新核心依赖

### 📝 确认格式模板

---
⚠️ 危险操作检测！
操作类型：[具体操作]
影响范围：[详细说明]
风险评估：[潜在后果]

请确认是否继续？[需要明确的"是"、"确认"、"继续"]
---

---

## ✅ 关键检查点

### 🚀 任务开始

**尽量并行化工具调用；同时采用批量读取（read_file）和批量修改（apply_patch）的方式来加速整个处理过程。**

- [ ] 读取相关 Memory，回显关键约束
- [ ] 根据任务特征选择适配策略
- [ ] 确认工具可用性和降级方案

### 💻 编码前

- [ ] 完成 `Sequential-Thinking` 分析
- [ ] 使用`Serena`等工具理解现有代码
- [ ] 制定实施计划和质量标准

### 🔍 实施中

- [ ] 遵循选定的质量标准
- [ ] 记录重要决策和变更理由
- [ ] 及时处理异常和边界情况

### ✨ 完成后

- [ ] 验证功能正确性和代码质量
- [ ] 更新相关测试和文档
- [ ] 总结经验，更新 Memory 和最佳实践

---

## 🎨 终端输出风格指南

### 💬 语言与语气

- **友好自然**：像专业朋友对话，避免生硬书面语
- **适度点缀**：在标题或要点前使用 🎯✨💡⚠️🔍 等 emoji 强化视觉引导
- **直击重点**：开篇用一句话概括核心思路（尤其对复杂问题）

---

### 📐 内容组织与结构

- **层次分明**：用标题、子标题划分内容层级，长内容分节展示
- **要点清晰**：将长段落拆分为短句或条目，每点聚焦一个 idea
- **逻辑流畅**：多步骤任务用有序列表（1. 2. 3.），并列项用无序列表（- 或 *）
- **合理分隔**：不同信息块之间用空行或 `---` 分隔，提升可读性

> ❌ 避免在终端中使用复杂表格（尤其内容长、含代码或需连贯叙述时）

---

### 🎯 视觉与排版优化

- **简洁明了**：控制单行长度，适配终端宽度（建议 ≤80 字符）
- **适当留白**：合理使用空行，避免信息拥挤
- **对齐一致**：统一缩进与符号风格（如统一用 `-` 而非混用 `*`）
- **重点突出**：关键信息用 **粗体** 或 *斜体* 强调

---

### 🧩 技术内容规范

#### 代码与数据展示

- **代码块**：多行代码、配置或日志务必用带语言标识的 Markdown 代码块（如 ```python）
- **聚焦核心**：示例代码省略无关部分（如导入语句），突出关键逻辑
- **差异标记**：修改内容用 `+` / `-` 标注，便于快速识别变更
- **行号辅助**：必要时添加行号（如调试场景）

#### 结构化数据

- **优先列表**：大多数场景用列表替代表格
- **慎用表格**：仅当需严格对齐结构化数据（如参数对比）时使用 Markdown 表格

---

### 🚀 交互与用户体验

- **即时反馈**：快速响应，避免长时间无输出
- **状态可见**：重要操作显示进度或当前状态（如“正在处理…”）
- **错误友好**：清晰说明错误原因，并提供可操作的解决建议
- **引导下一步**：结尾给出实用建议、行动指南或鼓励进一步提问

---



### ✅ 输出结尾建议

- 复杂内容后附**简短总结**，重申核心要点
- **最终答案的编写规范：**  
- **对于微小的修改（单个文件，修改内容不超过10行）：** 仅需使用2–5句话或3个要点进行描述，无需使用标题；除非必要，否则不要添加任何简短的代码片段（不超过3行）。  
- **对于中等规模的修改（涉及单个文件或少量文件）：** 使用不超过6个要点进行描述，总共可以使用6–10句话；最多只能添加1–2个简短的代码片段（每个片段不超过8行）。  
- **对于大规模的修改（涉及多个文件）：** 应分别对每个文件进行总结，每个文件使用1–2个要点进行描述；除非代码非常关键，否则避免直接在最终答案中嵌入代码片段。  
- **禁止在最终答案中包含“修改前/修改后”的对比内容、完整的方法体，或过长（需要滚动才能查看的）代码块；建议使用文件名或符号名称来引用相关内容。**  
- **除非用户明确要求，或者修改过程会导致构建、代码检查（如yarn、tsc、eslint等）失败，否则不要在答案中提及这些过程或工具的使用情况。** 如果这些检查过程顺利完成（即没有产生任何错误或警告），则无需特别说明。  

**关于代码与格式的注意事项：**  
- 对于需要突出显示的代码片段，请使用等宽字体（monospace）进行显示；同时，请避免将代码片段与**符号（如**）混合使用。  
- **除非修改过程需要记录构建、代码检查的结果，或者这些步骤会影响到修改的顺利进行，否则不要在答案中提及相关的日志或工具信息。**  
- 对于简单的修改，只需简要说明修改的内容、涉及的位置以及修改的结果即可，无需进行复杂的总结。  
- **避免使用过多的代码注释或长篇的代码示例；建议通过引用文件名、符号或函数名称来说明修改的具体内容。**  
- **当代码示例能更直观地说明问题时，优先使用自然语言进行描述（即直接引用文件名、符号或函数名称）；只有在确实需要避免混淆的情况下，才允许使用代码片段，且每个代码片段的长度应控制在规定的范围内。**  
- **对于代码库中的代码片段：** 如果必须引用代码库中的代码，可以使用相应的引用格式，但在最终答案中应避免使用行号和文件路径作为前缀；每个代码片段的长度最多不超过1–2行。
---

第五步：安装 MCP 插件（可选进阶）

🔧 什么是 MCP？ MCP（Model Context Protocol）是一套插件协议，可以给 AI 扩展更多能力，比如操作浏览器、深度思考等。

如果你想让 Claude Code 更强大，可以安装以下插件（在终端中逐条执行）：

# 1. Chrome DevTools - 让 AI 能操作浏览器
claude mcp add --transport stdio --scope user chrome-devtools \
  -- npx chrome-devtools-mcp@latest

# 2. Sequential Thinking - 增强 AI 的深度思考能力
claude mcp add --transport stdio --scope user sequential-thinking \
  -- npx -y @modelcontextprotocol/server-sequential-thinking

# 3. Serena - 代码符号分析工具
claude mcp add --transport stdio --scope user serena \
  -- uvx --from git+https://github.com/oraios/serena \
     serena start-mcp-server --enable-web-dashboard false

# 4. Context7 - 技术文档查询
claude mcp add --transport stdio --scope user context7 \
  -- npx -y @upstash/context7-mcp

💡 初学者可以先跳过这一步，等熟悉基本用法后再来扩展。

🎉 开始使用！

配置完成后，打开终端，进入你的项目目录，输入 claude 即可启动：

cd /path/to/your/project
claude

你会看到这样的界面：

试着问它一个问题，比如"这是一个什么项目？"

AI 会先思考你的意图，然后调用工具分析项目：

分析完成后，它会给出清晰的总结：

恭喜你！🎊 现在你已经成功配置好了 AI 编程助手，可以开始氛围编程之旅了。

三、其他 AI 编程工具推荐

除了 Claude Code，市面上还有几款值得关注的 AI Agent 工具。根据你的开发方向，可以选择最适合的：

🥇 Codex CLI（OpenAI 出品）

官网：developers.openai.com/codex/cli

适合人群：后端开发者

核心特点：

OpenAI 官方出品，使用 GPT 系列模型
遇到问题会先"深度推理"，反复推演边界情况
特别适合逻辑复杂的后端场景

💰 低成本使用方式：目前 ChatGPT Team 有 0$/1$ 试用活动，可以同时使用 ChatGPT 官网和 Codex CLI。一个月成本约 10 元人民币，性价比极高。

推荐指数：⭐⭐⭐⭐⭐

🤖 Droid CLI（Factory.ai 出品）

官网：factory.ai/product/cli

适合人群：需要多角色协作的复杂项目

核心特点：

理念独特：不是"给你一个助手"，而是"给你一支军队"
将 AI 拆分为不同的"专职机器人"，模拟真实研发团队
支持多种顶级模型（Claude、GPT、Gemini 等）

💰 低成本使用方式： ~~注册送 4000 万 Token（约 108 美元）~~，目前活动已结束，价格有所上涨（约 6 元/1000 万 Token）。

推荐指数：⭐⭐⭐（活动结束后性价比下降）

🎨 Gemini CLI（Google 出品）

官网：geminicli.com

适合人群：前端 UI 开发者

核心特点：

Google 官方出品，使用 Gemini 系列模型
Gemini 3 PRO 对 UI/视觉类任务表现出色
工具成熟度略逊于 Claude Code 和 Codex CLI

💰 低成本使用方式： Google One 学生优惠，可免费使用一年 PRO 订阅。

推荐指数：⭐⭐⭐（仅推荐前端 UI 场景）

📊 工具对比总结

工具	适合场景	模型	推荐度
Claude Code	全栈开发	Claude	⭐⭐⭐⭐⭐
Codex CLI	后端开发	GPT	⭐⭐⭐⭐⭐
Droid CLI	团队协作	多模型	⭐⭐⭐
Gemini CLI	前端 UI	Gemini	⭐⭐⭐

四、实战案例：AI 能做什么？

🎯 这一章通过真实项目案例，展示 AI Agent 的各项能力。看完你就知道它能帮你做什么了。

案例一：快速理解陌生代码

场景：接手一个新项目，需要快速了解某个功能的实现逻辑。

在重构中升 CDP 系统的 Datart 前端项目时，我需要了解"数据视图中不同字段类型如何显示不同图标"。

如果没有 AI，我可能需要：

在代码中搜索相关关键词
逐个文件阅读理解
画出调用关系图
花费数小时甚至一天

有了 AI，我只需要问一句：

了解一下数据视图接口返回的 data.model.columns 中，type 类型有哪些？
目前我已知的有 STRING 和 NUMERIC

AI 立刻给出完整答案：

原来有 8 种类型！前 4 种是常用类型，后面是变量/脚本处理场景。

继续追问前端渲染逻辑：

不同的 type 在前端页面中渲染有什么特殊处理吗？

AI 分析后返回：

现在我完全理解了这个功能的实现，可以让 AI 直接帮我修改代码：

最终效果 —— 不同字段类型显示对应图标：

案例二：批量修改业务逻辑

场景：产品经理提出需求变更，需要修改多处相关代码。

原始需求：中升 CDP 看板的"导出 Excel"功能，默认是根据查询条件导出的。但产品经理发现：如果用户只切换了查询条件却没点"查询"，导出的数据和页面显示的不一致。

这个问题涉及全局多处导出功能，手动找很容易遗漏。

让 AI 来处理：

AI 自动找到所有相关位置并一并修改，省时省力还不容易出错。

案例三：优化页面布局

场景：页面上的指标过多时，标签显示不完整，需要优化布局。

原始问题 —— 指标太多导致 Tag 被截断：

我发给 AI 一张截图 + 一句话描述：

列中支持多个指标，拖入多个指标导致指标 Tag 展示不完整，请合理优化前端展示

AI 思考后给出了三种解决方案：

它选择了方案一（水平滚动），效果如下：

我不太满意，要求换行展示：

不要横向滚动条，换行展示

AI 立刻调整：

从发现问题到解决，只花了几分钟。

案例四：联网搜索最新资讯

场景：了解技术圈的最新动态。

最近 Meta 的 React 团队和 Vercel 的 Next.js 团队联合发布了两个最高危险等级的安全漏洞，我想了解详情。

直接问 AI：

查询最近 Next.js 爆出的最高危险等级漏洞，详细介绍下

AI 自动联网搜索并整理：

比自己去各个网站翻找高效多了。

案例五：根据原型图生成页面

场景：拿到产品原型图，需要快速实现页面。

这是产品给的原型：

我把图片发给 AI，并说明：

这是一个 B 端原型，请使用项目中已有的组件库实现

AI 生成的页面（左侧菜单和水印是长截图的 bug）：

虽然还需要微调，但基本框架已经出来了，节省了大量重复劳动。

五、写在最后

氛围编程的本质

氛围编程不是让 AI 完全取代程序员，而是改变了我们的工作方式：

传统模式：需求 → 思考 → 编码 → 调试 → 测试

氛围编程：需求 → 描述给 AI → 审查 AI 的输出 → 微调 → 验收

你的角色从"代码的生产者"变成了"代码的审核者"。这意味着：

✅ 你需要更强的需求理解能力：能准确描述你想要什么
✅ 你需要更强的代码审查能力：能判断 AI 写的代码好不好
✅ 你需要更广的技术视野：知道什么方案是合理的
❌ 你不再需要记住每个 API 的参数顺序
❌ 你不再需要手写重复的模板代码

给初学者的建议

从简单任务开始：先让 AI 帮你写个函数、改个样式，熟悉交互方式
学会描述需求：越具体越好，比如"把按钮改成蓝色"不如"把提交按钮的背景色改成 #1890ff"
保持批判性思维：AI 也会犯错，要审查它的输出
多尝试不同工具：Claude Code、Codex CLI、Gemini CLI 各有特点，找到适合自己的

常见问题

Q：AI 写的代码能用于生产环境吗？

A：可以，但必须经过审查和测试。我目前的工作流是：AI 生成 → 我审查 → 跑测试 → 部署。

Q：这会让程序员失业吗？

A：短期内不会。AI 目前更像是效率工具，能让一个人干两个人的活，但还无法独立完成复杂项目。长期来看，会改变行业对程序员的能力要求。

Q：国产模型够用吗？

A：对于日常开发任务，国产模型基本够用。复杂的架构设计和疑难 bug 排查，顶级模型会更可靠。

希望这篇文章能帮你开启氛围编程之旅。如果有问题，欢迎在评论区交流！

💡 小贴士：工具在不断更新，本文内容可能会过时。建议收藏官方文档：

Claude Code 官方文档

Codex CLI 官方文档

如何配置 Claude Code 和 Codex

Mon, 27 Oct 2025 00:00:00 GMT

Claude Code 和 Codex 是什么

Claude Code 是 Anthropic 的“代理式”编码工具，既有本地 CLI、VS Code 插件，也有云端/Web 形态（研究预览，Pro/Max 可用）。可理解/修改代码、运行命令、并支持子代理、检查点回滚等增强自治能力。

Codex 是 OpenAI 推出的本地终端编码代理（开源，Rust 实现）。支持读取/编辑/运行当前目录代码，带交互式 TUI、脚本化 exec 模式、细粒度沙箱与审批策略，以及原生 MCP 集成（STDIO 与可流式 HTTP，含 OAuth）。同时有统一的 config.toml 供 CLI 与 IDE 扩展共享。

使用场景

维度	Claude Code	OpenAI Codex CLI
形态	终端、VS Code 扩展、Web（云端）	终端 CLI + IDE 扩展
价格	昂贵，即使是使用第三方中转站	较为便宜，可使用 Team 订阅
执行位置	本地；或云端隔离沙箱并行跑任务（自动 PR/进度跟踪）	本地在你的工作目录内读/改/跑（带交互式 TUI/脚本模式）
安全模型	基于文件系统+网络双重隔离的沙箱，减少权限弹窗，Git 走受控代理	“审批模式”可选：默认 Auto（工作区内自动），越权/联网需批准，也可只读/全开放
MCP（工具扩展）	官方文档与插件生态；可通过 MCP 连接外部工具	原生 MCP：支持 STDIO 与可流式 HTTP（含 OAuth，需要开启 `experimental_use_rmcp_client`），CLI 与 IDE 共用同一 `config.toml`
Windows	支持（含 WSL/Git Bash 路线）	实验性，官方建议用 WSL
典型场景	多仓库/并行小改动、TDD 修复、云端受控环境	本地项目深度改造、脚本化集成、和 IDE 同步用一套配置

Node 环境安装

版本需大于等于 20

如果你是前端工程师，建议使用 nvm 来管理 Node.js 版本。

# 查看远程 Node.js 版本
nvm ls-remote
# 安装 Node.js LTS
nvm install --lts
# 切换到 Node.js LTS
nvm use --lts

成功安装后，运行以下命令检查版本

node --version

Claude Code 配置

终端中使用

# 安装 CLI
npm install -g @anthropic-ai/claude-code
# 启动（终端）
claude

VS Code 中使用

从市场安装 Claude Code for VS Code

授权

编辑文件 ~/.claude/settings.json 文件添加以下内容：

{
  "env": {
    "ANTHROPIC_AUTH_TOKEN": "", // 你的 Claude API 密钥 如果你使用的是第三方中转站，请填入中转站的 API 密钥
    "ANTHROPIC_BASE_URL": "", // 通常为 https://api.anthropic.com/v1 如果你使用的是第三方中转站，请填入中转站的 API 地址
    "CLAUDE_CODE_DISABLE_NONESSENTIAL_TRAFFIC": "1"
  },
  "permissions": {
    "allow": [],
    "deny": []
  }
}

Codex 配置

终端中使用

# 安装（二选一）
npm install -g @openai/codex
# 启动交互式 TUI
codex

VS Code 中使用

从市场安装 OpenAI Codex for VS Code

授权

创建 ~/.codex 目录

创建并编辑文件 ~/.codex/config.toml 文件添加以下内容：

model_provider = "codex"
model = "gpt-5" #可更改为model = "gpt-5-codex"
model_reasoning_effort = "high"
disable_response_storage = true

[model_providers.codex]
name = "codex"
base_url = "https://api.openai.com/v1" # 通常为 https://api.openai.com/v1 如果你使用的是第三方中转站，请填入中转站的 API 地址
wire_api = "responses"
requires_openai_auth = true

创建并编辑文件 ~/.codex/auth.json 文件添加以下内容：

{
  "OPENAI_API_KEY": "your-api-key-here" // 你的 OpenAI API 密钥 如果你使用的是第三方中转站，请填入中转站的 API 密钥
}

基于 Antd Table 组件组件的二次封装，使其支持同列相同数据下的合并

Wed, 10 Sep 2025 00:00:00 GMT

背景

最近在进行业务开发时，经常遇到同列相同数据下的合并，为了方便后续使用，我封装了一个基于 Antd Table 组件的二次封装，可以方便的实现同列相同数据下的合并

实现思路

Antd Table 组件的 Column 描述列描述对象中 onCell 属性可以用来设置单元格的样式，因此我们只需要在 onCell 属性中设置合并单元格 rowSpan 值即可。

简单介绍下 rowSpan 属性，rowSpan 属性用来设置单元格的跨行数，如果设置为 2，则表示单元格跨两行。同时需要将被合并的单元格的 rowSpan 值设置为 0，来避免被合并的单元格被显示。

实现代码

import { useMemo } from 'react'
import { Table, TableProps } from 'antd'

export default function SameGroupMergeTable(props: TableProps) {
  const { columns, dataSource } = props;

  const innerColumns = useMemo(() => {
    if (!columns || !dataSource) return [];
    return columns.map((column: any) => {
      if (column.mergeColumn && !column.onCell) {
        return {
          ...column,
          onCell: (record: any, rowIndex: number | undefined) => {
            const dataIndex = column.dataIndex;
            const sameKey = dataSource.filter((item) => item[dataIndex] === record[dataIndex]);
            if (sameKey.length === 1) {
              return { rowSpan: 1 };
            }
            const sameKeyFirstIndex = dataSource.findIndex((item) => item[dataIndex] === record[dataIndex]);
            if (rowIndex === sameKeyFirstIndex) {
              return { rowSpan: sameKey.length };
            }
            return { rowSpan: 0 };
          },
        };
      }
      // 如果 column 中设置了 mergeColumn 和 onCell 属性，则需要重写 onCell 属性，因为可能需要用到 onCell 属性中的其他参数实现其他功能
      if (column.mergeColumn && column.onCell) {
        return {
          ...column,
          // 重写 onCell, 给 onCell 传递一个参数，合并单元格的值（rowSpan）
          onCell: (record: any, rowIndex: number | undefined) => {
            const dataIndex = column.dataIndex;
            const sameKey = dataSource.filter((item) => item[dataIndex] === record[dataIndex]);
            if (sameKey.length === 1) {
              return column.onCell(record, rowIndex, { rowSpan: 1 });
            }
            const sameKeyFirstIndex = dataSource.findIndex((item) => item[dataIndex] === record[dataIndex]);
            if (rowIndex === sameKeyFirstIndex) {
              return column.onCell(record, rowIndex, { rowSpan: sameKey.length });
            }
            return column.onCell(record, rowIndex, { rowSpan: 0 });
          },
        };
      }
      return column;
    });
  }, [columns, dataSource]);

  return (
    <Table {...props} columns={innerColumns} />
  )
}

使用方式

import SameGroupMergeTable from '@/src/components/SameGroupMergeTable';

const columns = [
  {
    title: 'Name',
    dataIndex: 'name',
    // 使用方式一：设置 mergeColumn 属性
    mergeColumn: true,
  },
  {
    title: 'Name',
    dataIndex: 'name',
    // 使用方式二：设置 mergeColumn 和 onCell 属性
    mergeColumn: true,
    onCell: (_record, rowIndex, mergeObject) => {
      if (rowIndex === 0) {
        return {
          ...mergeObject,
          style: {
            backgroundColor: "#E6F4FF",
          }
        }
      }
      return mergeObject;
    },
  },
];
const dataSource = [];
const Example = () => {
  return <SameGroupMergeTable
    columns={columns}
    dataSource={dataSource}
  />;
};

export default Example;

:::tip 通常情况下只需要设置 mergeColumn 属性即可

如果需要合并的列需要用到 onCell 属性中的其他参数实现其他功能，这通过 onCell 函数第三个形参 mergeObject 来实现。 :::

React Hook PDF 生成

Mon, 25 Aug 2025 00:00:00 GMT

背景

在项目开发过程中，我们经常需要生成 PDF 文件。但是，生成 PDF 文件的流程比较复杂，需要处理很多细节问题。

通常情况下如果按照页面原样生成 PDF 文件，只需要使用 html2canvas 和 jsPDF 即可。

代码也和简单，如下：

import html2canvas from 'html2canvas';
import jsPDF from 'jspdf';

const Example = () => {
  const onDownload = () => {
    html2canvas(document.body).then((canvas) => {
      const imgData = canvas.toDataURL('image/png');
      const pdf = new jsPDF();
      pdf.addImage(imgData, 'PNG', 0, 0);
      pdf.save('example.pdf');
    });
  };

  return <button onClick={onDownload}>Download PDF</button>;
};

export default Example;

这只是一份最简单的代码，但是实际项目中，我们还需要处理很多细节问题，如：

PDF 中的超链接可以点击 (实现 PDF 中的超链接可以点击 - 通过遍历页面中所有 a 标签，并添加蒙层，设置对应的位置，点击蒙层时，跳转到对应的超链接)
PDF 文件体积较大 (文件体积非常大, > 80 MB - 降低分辨率，压缩图片，压缩文件)
PDF 与页面样式不一致 (antd 表格中的额外行的 + 按钮样式错位问题，导出的 PDF 中变为了纵向排列的一个横和一个竖 - 隐藏原 ::before/::after 伪元素，用一个内联 SVG 覆盖，导出后再还原)

解决方案

为了简化使用方式并解决上述问题，我封装了一个 hook，用于生成 PDF 文件。

hook 使用方式如下：

import { usePdfGenerator } from '@/src/hooks/usePdfGenerator';
import { Button } from 'antd';

const Example = () => {
  const { contentRef, generatePdf, isLoading } = usePdfGenerator();
  const onDownload = () => {
    generatePdf('example');
    // 如果你需要获取到导出的文件，可以传入一个回调函数，或者直接使用 generatePdf 的返回值
    const file = generatePdf('example', {}, (file) => {
      console.log('file', file);
    });
  };

  return <div ref={contentRef}>
    <h1>Hello World</h1>
    <Button loading={isLoading} onClick={onDownload}>Download PDF</Button>
  </div>;
};

export default Example;

:::warning 回调函数和返回值返回的是生成的图片文件，这是由于我们项目有一个导出 word 的需求，需要前端将图片传给后端使用。 :::

hook 源码如下：

import { useRef, useCallback, useState } from 'react';
import html2canvas from 'html2canvas';
import jsPDF from 'jspdf';

type GeneratePdfOptions = {
  // 输出图片类型：JPEG 体积更小，PNG 无损但体积更大
  imageType?: 'jpeg' | 'png';
  // 当 imageType 为 JPEG 时生效，范围 0-1，建议 0.6~0.85
  jpegQuality?: number;
  // 二次缩放比例，0-1。用于在不明显损伤清晰度的前提下降低像素数，建议 0.7~0.9。
  downscaleRatio?: number;
  // 目标最大文件体积（KB），用于自适应压缩 PNG（通过逐步降低分辨率实现，尽量不损伤清晰度）
  maxFileSizeKB?: number;
  // 是否下载
  isDownload?: boolean;
  // 回调函数
  callback?: (file: File) => void;
};

export const usePdfGenerator = () => {
  // 1. 创建一个 ref 来附加到需要导出的 DOM 节点上
  const contentRef = useRef(null);
  const [isLoading, setIsLoading] = useState(false);
  // 2. 使用 state 来管理生成过程中的加载状态，提升用户体验
  // const [isLoading, setIsLoading] = useState(false);

  // 3. 使用 useCallback 来包装我们的核心函数，以避免不必要的重渲染
  const generatePdf = useCallback(async (
    fileName = 'document',
    options: GeneratePdfOptions = {},
    callback: (file: File) => void = () => { }
  ): Promise<File | undefined> => {
    const { imageType = 'png', jpegQuality = 0.82, downscaleRatio = 0.88, isDownload = true } = options;
    const element: HTMLElement = contentRef.current!;

    if (!element) {
      console.error("无法生成 PDF，因为找不到引用的内容元素。");
      return undefined;
    }

    setIsLoading(true); // 开始生成，设置加载状态为 true
    // 预先准备 a 标签样式恢复器，并在渲染前将计算后的颜色写入内联，确保导出跟页面一致
    const anchorsInDom = Array.from(element.querySelectorAll('a')) as HTMLAnchorElement[];
    const restoreAnchorInlineStyles: Array<() => void> = [];
    anchorsInDom.forEach((a) => {
      const prevColor = a.style.color;
      const prevTdColor = (a.style as any).textDecorationColor as string;
      const prevTextDecoration = a.style.textDecoration;
      const cs = window.getComputedStyle(a);
      const computedColor = cs.color;
      const computedTdColor = (cs as any).textDecorationColor || computedColor;
      a.style.color = computedColor;
      try { (a.style as any).textDecorationColor = computedTdColor; } catch (_) { }
      if ((cs.textDecorationLine || '').includes('underline') && !a.style.textDecoration) {
        a.style.textDecoration = 'underline';
      }
      restoreAnchorInlineStyles.push(() => {
        a.style.color = prevColor;
        try { (a.style as any).textDecorationColor = prevTdColor; } catch (_) { }
        a.style.textDecoration = prevTextDecoration;
      });
    });

    // 修复 antd Table 展开/收起图标（+/-）在 html2canvas 下的渲染异常：
    // 思路：隐藏原 ::before/::after 伪元素，用一个内联 SVG 覆盖，导出后再还原
    const cleanupExpandIconFixers: Array<() => void> = [];
    const styleTag = document.createElement('style');
    styleTag.setAttribute('data-pdf-export-fix', 'expand-icon');
    styleTag.textContent = `
      .ant-table-row-expand-icon.__pdf_export_fix::before,
      .ant-table-row-expand-icon.__pdf_export_fix::after {
        content: none !important;
        background: none !important;
        border: 0 !important;
      }
    `;
    document.head.appendChild(styleTag);
    cleanupExpandIconFixers.push(() => {
      try { document.head.removeChild(styleTag); } catch (_) { }
    });

    const expandButtons = Array.from(
      element.querySelectorAll('button.ant-table-row-expand-icon')
    ) as HTMLButtonElement[];
    expandButtons.forEach((btn) => {
      const cs = window.getComputedStyle(btn);
      const beforeStyle = window.getComputedStyle(btn, '::before');
      const afterStyle = window.getComputedStyle(btn, '::after');
      const isTransparent = (c: string | null | undefined) => !c || c === 'transparent' || c === 'rgba(0, 0, 0, 0)';
      const pickColor = (...colors: Array<string | null | undefined>) => colors.find((c) => !isTransparent(c));
      const strokeColor = (pickColor(
        beforeStyle.backgroundColor,
        (beforeStyle as any).borderColor,
        afterStyle.backgroundColor,
        (afterStyle as any).borderColor,
        cs.backgroundColor,
        cs.color,
        'rgba(0,0,0,0.45)'
      ) || 'rgba(0,0,0,0.45)') as string;
      const prevPosition = btn.style.position;
      const prevClassName = btn.className;
      btn.style.position = prevPosition || 'relative';
      if (!btn.classList.contains('__pdf_export_fix')) btn.classList.add('__pdf_export_fix');

      const overlay = document.createElement('span');
      overlay.style.position = 'absolute';
      overlay.style.inset = '0';
      overlay.style.display = 'flex';
      overlay.style.alignItems = 'center';
      overlay.style.justifyContent = 'center';
      overlay.style.pointerEvents = 'none';
      overlay.style.zIndex = '1';

      const expanded = btn.getAttribute('aria-expanded') === 'true';
      // 使用 16x16 视口绘制 + 或 -，线宽 1.5，颜色取自按钮 color
      const svg = expanded
        ? `<?xml version="1.0" encoding="UTF-8"?>
           <svg width="16" height="16" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
             <line x1="3" y1="8" x2="13" y2="8" stroke="${strokeColor}" stroke-width="1.5" stroke-linecap="round"/>
           </svg>`
        : `<?xml version="1.0" encoding="UTF-8"?>
           <svg width="16" height="16" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
             <line x1="3" y1="8" x2="13" y2="8" stroke="${strokeColor}" stroke-width="1.5" stroke-linecap="round"/>
             <line x1="8" y1="3" x2="8" y2="13" stroke="${strokeColor}" stroke-width="1.5" stroke-linecap="round"/>
           </svg>`;
      overlay.innerHTML = svg;
      btn.appendChild(overlay);

      cleanupExpandIconFixers.push(() => {
        try { btn.removeChild(overlay); } catch (_) { }
        try { btn.className = prevClassName; } catch (_) { }
        btn.style.position = prevPosition;
      });
    });

    try {

      // 调用 html2canvas。设置 scale 可以提高清晰度。
      const canvasScale = 2; // html2canvas 渲染比例，需要参与后续坐标换算
      const canvas = await html2canvas(element, {
        scale: canvasScale, // 提高分辨率
        useCORS: true, // 允许加载跨域图片
        logging: false, // 不在控制台打印日志
        backgroundColor: '#FFFFFF',
      });

      // 对原始画布做高质量下采样，必要时自适应压缩（针对 PNG 通过降低分辨率实现）
      const exportCanvas = document.createElement('canvas');
      const ctx = exportCanvas.getContext('2d');
      if (!ctx) throw new Error('无法获取 2D 上下文');

      const originalWidth = canvas.width;
      const originalHeight = canvas.height;
      let currentDownscale = Math.min(1, Math.max(0.5, downscaleRatio));
      const minDownscale = 0.6; // 限制最小降采样比例，避免明显模糊
      const maxFileSizeBytes = Math.max(1, Math.round((options.maxFileSizeKB ?? 320) * 1024));

      const redrawWithDownscale = (ratio: number) => {
        exportCanvas.width = Math.max(1, Math.round(originalWidth * ratio));
        exportCanvas.height = Math.max(1, Math.round(originalHeight * ratio));
        ctx.imageSmoothingEnabled = true;
        // @ts-ignore: 浏览器支持性检测
        if (ctx.imageSmoothingQuality) ctx.imageSmoothingQuality = 'high';
        ctx.clearRect(0, 0, exportCanvas.width, exportCanvas.height);
        ctx.drawImage(
          canvas,
          0,
          0,
          originalWidth,
          originalHeight,
          0,
          0,
          exportCanvas.width,
          exportCanvas.height
        );
      };

      // 初次绘制
      redrawWithDownscale(currentDownscale);

      // 针对 PNG，自适应降低分辨率以控制文件体积；JPEG 则交给质量参数处理
      const getPngBlob = async (): Promise<Blob> => new Promise((resolve, reject) => {
        try {
          exportCanvas.toBlob((blob) => {
            if (blob) resolve(blob);
            else reject(new Error('无法导出 PNG Blob'));
          }, 'image/png');
        } catch (e) {
          reject(e);
        }
      });

      let tentativePngBlob: Blob | undefined;
      for (let attempt = 0; attempt < 6; attempt += 1) {
        // 生成 PNG Blob 并检测体积
        // eslint-disable-next-line no-await-in-loop
        const blob = await getPngBlob();
        tentativePngBlob = blob;
        if (blob.size <= maxFileSizeBytes || currentDownscale <= minDownscale) {
          break;
        }
        // 进一步轻微缩小 8-12% 之间，尽量减少清晰度损失
        currentDownscale = Math.max(minDownscale, Math.round(currentDownscale * 0.9 * 100) / 100);
        redrawWithDownscale(currentDownscale);
      }

      const mime = imageType === 'png' ? 'image/png' : 'image/jpeg';
      const quality = imageType === 'png' ? undefined : Math.min(1, Math.max(0.5, jpegQuality));
      const imgData = exportCanvas.toDataURL(mime, quality as any);

      // 创建 jsPDF 实例 (A4 尺寸)
      const pdf = new jsPDF({
        orientation: 'portrait', // p: 纵向, l: 横向
        unit: 'mm',
        format: 'a4',
      });
      // console.log(canvas);

      // 计算 PDF 页面尺寸和图片尺寸
      const pdfWidth = pdf.internal.pageSize.getWidth();
      const pdfHeight = pdf.internal.pageSize.getHeight();
      const imgWidth = exportCanvas.width;
      const imgHeight = exportCanvas.height;

      // 设置边距：左右 36px，上下 20px（转换为毫米）
      const marginLeft = 36 * 0.264583; // 转换像素为毫米 (1px = 0.264583mm)
      const marginTop = 20 * 0.264583;

      // 计算考虑边距后的可用空间
      const availableWidth = pdfWidth - (marginLeft * 2);
      const availableHeight = pdfHeight - (marginTop * 2);

      // 重新计算比例以适应边距
      const ratioWithMargins = Math.min(availableWidth / imgWidth, availableHeight / imgHeight);
      const finalWidth = imgWidth * ratioWithMargins;
      const finalHeight = imgHeight * ratioWithMargins;

      // 计算图片在 PDF 页面中的位置（考虑边距）
      const x = marginLeft;
      const y = marginTop;

      // 将图片添加到 PDF
      const addImageType = imageType === 'png' ? 'PNG' : 'JPEG';
      pdf.addImage(imgData, addImageType as any, x, y, finalWidth, finalHeight);

      // 在 PDF 上叠加可点击链接区域
      // 思路：
      // 1) 遍历 element 内所有 <a> 标签
      // 2) 使用 getClientRects() 获取每个可见行的矩形（处理换行）
      // 3) 将 DOM CSS 像素 -> 画布像素（乘以 canvasScale）-> PDF 毫米（乘以 ratioWithMargins）
      // 4) 叠加到 (x, y) 的偏移位置
      const elementRect = element.getBoundingClientRect();
      // 使用 html2canvas 实际产出的画布尺寸与元素 CSS 尺寸，构建精准的 CSSpx->Canvaspx 比例
      const elementCssWidth = Math.max(1, element.scrollWidth || elementRect.width);
      const elementCssHeight = Math.max(1, element.scrollHeight || elementRect.height);
      const cssToCanvasScaleX = imgWidth / elementCssWidth;
      const cssToCanvasScaleY = imgHeight / elementCssHeight;

      // 由最终绘制尺寸得到 Canvaspx->PDFmm 的比例（分别保留 X/Y，避免浮点误差累积）
      const canvasToPdfScaleX = finalWidth / imgWidth;
      const canvasToPdfScaleY = finalHeight / imgHeight;

      // 辅助：累加从目标节点到根容器（element）之间所有可滚动祖先的滚动偏移
      const getAccumulatedScrollOffset = (node: Element, root: Element) => {
        let cur: Element | null = node.parentElement;
        let accLeft = 0;
        let accTop = 0;
        while (cur && cur !== root && cur !== document.body && cur !== document.documentElement) {
          const style = window.getComputedStyle(cur);
          const overflowY = style.overflowY;
          const overflowX = style.overflowX;
          const isScrollableY = overflowY === 'auto' || overflowY === 'scroll';
          const isScrollableX = overflowX === 'auto' || overflowX === 'scroll';
          if (isScrollableY) accTop += (cur as HTMLElement).scrollTop;
          if (isScrollableX) accLeft += (cur as HTMLElement).scrollLeft;
          cur = cur.parentElement;
        }
        return { accLeft, accTop };
      };
      const anchors = Array.from(element.querySelectorAll('a[href]')) as HTMLAnchorElement[];

      const isValidHref = (href: string | null): href is string => {
        if (!href) return false;
        const lowered = href.trim().toLowerCase();
        return (
          lowered.startsWith('http://') ||
          lowered.startsWith('https://') ||
          lowered.startsWith('mailto:') ||
          lowered.startsWith('tel:')
        );
      };

      anchors.forEach((anchor) => {
        if (!isValidHref(anchor.getAttribute('href'))) return;
        const url = anchor.getAttribute('href') as string;

        const clientRects = anchor.getClientRects();
        if (!clientRects || clientRects.length === 0) return;

        // 滚动累加（处理 antd Table 等内部可滚动容器）
        const { accLeft, accTop } = getAccumulatedScrollOffset(anchor, element);

        for (let i = 0; i < clientRects.length; i += 1) {
          const rect = clientRects[i];

          // DOM CSS px -> 相对 element 的 px
          // 额外加上所有中间可滚动容器的滚动偏移，映射到内容原点坐标系
          const relLeftPx = (rect.left - elementRect.left) + accLeft;
          const relTopPx = (rect.top - elementRect.top) + accTop;
          const widthPx = rect.width;
          const heightPx = rect.height;

          if (widthPx <= 0 || heightPx <= 0) continue;

          // CSS px -> 画布 px（使用实际比例，避免仅依赖配置 scale 导致的偏差）
          const leftCanvasPx = relLeftPx * cssToCanvasScaleX;
          const topCanvasPx = relTopPx * cssToCanvasScaleY;
          const widthCanvasPx = widthPx * cssToCanvasScaleX;
          const heightCanvasPx = heightPx * cssToCanvasScaleY;

          // 画布 px -> PDF mm，并考虑边距偏移 (x, y)
          const leftMm = x + leftCanvasPx * canvasToPdfScaleX;
          const topMm = y + topCanvasPx * canvasToPdfScaleY;
          const widthMm = widthCanvasPx * canvasToPdfScaleX;
          const heightMm = heightCanvasPx * canvasToPdfScaleY;
          const overlayHeightMm = heightMm * 2; // 扩大高度以增强可点击容错

          // 叠加链接注解（使用 any 以兼容类型定义差异）
          try {
            (pdf as any).link(leftMm, topMm, widthMm, overlayHeightMm, { url });
          } catch (e) {
            // 某些版本也可用 pdf.link(x, y, w, h, urlNumber) 或 textWithLink
            try {
              // 退化方案：放置一个透明的文本链接（尽量不影响视觉）
              const fontSize = 0.01; // 极小字号，尽量不可见
              const prevSize = (pdf as any).getFontSize?.() ?? 16;
              (pdf as any).setFontSize?.(fontSize);
              (pdf as any).textWithLink?.(' ', leftMm, topMm + fontSize, { url });
              (pdf as any).setFontSize?.(prevSize);
            } catch (_) {
              // 忽略
            }
          }
        }
      });


      if (isDownload) {
        // 保存 PDF
        pdf.save(`${fileName}.pdf`);
      }
      // 返回 PNG 图片文件（而非 PDF），若之前已进行自适应压缩则优先使用该 Blob
      const pngBlob: Blob = tentativePngBlob ?? await new Promise((resolve, reject) => {
        try {
          exportCanvas.toBlob((blob) => {
            if (blob) resolve(blob);
            else reject(new Error(`无法导出 ${imageType.toUpperCase()} Blob`));
          }, mime);
        } catch (e) {
          reject(e);
        }
      });
      const pngFile = new File([pngBlob], `${fileName}.${imageType}`, { type: mime });
      callback(pngFile);
      return pngFile;
    } catch (error) {
      console.error("生成 PDF 时出错:", error);
    } finally {
      // 还原 a 标签的临时内联颜色，避免影响真实页面
      try { restoreAnchorInlineStyles.forEach((fn) => fn()); } catch (_) { }
      // 还原 antd 展开图标修复
      try { cleanupExpandIconFixers.forEach((fn) => fn()); } catch (_) { }
      setIsLoading(false); // 结束生成，无论成功或失败都将加载状态设为 false
    }
    return undefined;
  }, []); // 空依赖数组意味着此函数在组件生命周期内不会改变

  // 4. 返回 ref、生成函数和加载状态，以便在组件中使用
  return { contentRef, generatePdf, isLoading };
};

Cursor Agent 初体验

Mon, 28 Jul 2025 00:00:00 GMT

背景

Cursor 是最近非常火的一款 AI 编程工具，本文主要介绍 Cursor Agent 的初体验。实现了完全使用自然语言进行编程，最终完成一个简单的 Web 项目，包含前端、后端、数据库、以及大语言模型的 Api 调用等。

虽然我使用 Cursor 已经有一段时间了，但是很少使用 Cursor Agent 功能，之前一直使用的是 Cursor Tab，最近刚好看到一个项目——HowToCook，是一个收集菜谱的项目，项目中包含了很多菜谱，使用 Markdown 格式存储，我这里使用 Cursor 的 Agent 功能，使用自然语言指示 Cursor 基于此项目将菜谱转换为一个 Web 项目，提供可视化界面，并提供菜谱的搜索功能。

项目实现流程

遍历项目中的所有菜谱，将菜谱传给大语言模型，由大语言模型生成菜谱的 JSON 格式数据，然后将 JSON 数据存入到 MongoDB 中。最终将 MongoDB 中的数据转换为前端可用的数据格式，并提供搜索功能。

上述所有流程均使用 Cursor Agent 完成，我提供自然语言的描述，Cursor Agent 会根据我的描述，自动生成代码，并执行。

Cursor 消耗

最终基本完成项目后使用 Cursor 的消耗如下：

:::tip 并不是提问题 338 次，而是一次提问会消耗多个次数，它是根据 Token 计数来计算的。 :::

项目代码

::github{repo="DevilC0822/HowToCook"}

项目在线地址：程序员做饭指南

总结

优势:

开发效率非常高，对于小产品，可以快速实现、迭代。

不足：

需要指导写出详细的提示词，如果只是一些简单的描述，Cursor Agent 生成的代码基本处于黑盒状态，无法进行精细的控制。
对于庞大的任务无法处理，需要将任务拆分成多个小任务，然后使用 Cursor Agent 完成。

哪吒探针添加脚本测试归档结果数据

Wed, 14 May 2025 00:00:00 GMT

背景

哪吒探针是一款开源的探针工具，支持多种操作系统，包括 Linux、Windows 等。它可以帮助用户监控服务器性能、网络状态、硬件信息等，并提供详细的报告和分析。

由于手里有多台 VPS，它们的测试数据需要归档，所以基于哪吒探针写了一个脚本，扩展其功能，实现在哪吒探针页面端归档结果数据。方便统一查看测试结果，如下图所示

如何配置

在哪吒探针管理端，自定义脚本处加入以下内容

<script>
const nodeCheckResult = {
  36: {  // 服务器节点 id 可通过节点详情页 url 获取；或者管理端服务器列表表格中查看
      remark: 'DMIT.EB.WEE', // 节点名称仅用于自我分辨
      NodeQuality: {
          type: 'iframe', // iframe | image
          url: 'https://nodequality.com/r/rki21soaA2SlcnF7vBd2jIuDKPfiS6fr', // 测试结果
      },
      Speedtest: {
          type: 'image', // iframe | image
          url: 'https://www.speedtest.net/result/17721869331.png', // 测试结果
          desc: '辽宁联通 1000M宽带测试', // 测试结果描述，可不填，仅在图片类型时有效
      },
      融合怪: {
          type: 'iframe', // iframe | image
          url: 'https://paste.spiritlhl.net/#/show/VKMWQ.txt', // 测试结果
      },
  },
  // 其他服务器节点...
};
</script>
<script
  defer
  src="https://cdn.jsdelivr.net/gh/DevilC0822/config/script/nezhaAgentNodeTestResult.js"></script>

脚本源代码

说明

仅在哪吒探针 V1 版本测试可用，且只支持官方主题。

macOS 网络调优

Mon, 12 May 2025 00:00:00 GMT

背景

最近购买了一些美国西部、德国等物理距离较远的服务器，使用 iperf3 以及 speedtest 测试，发现单线程下载速度限速严重(200Mbps左右,我发现限速规律大概随着延迟的增大呈现正相关，经过测试是160ms 延迟限速在200Mbps左右，150ms 延迟限速在220Mbps左右，随着延迟的增加，限速会逐渐增加，速率会逐渐降低)。

现在的默认值

从 macOS 10.5 开始，Apple 实施了“自我调整 TCP”，它会动态调整某些参数以优化性能。虽然默认设置随着时间推移有所改进，但仍需进行调整以充分利用高速连接。

最近的 macOS 版本带有以下默认设置（具体数值可能会根据版本略有不同）：

net.inet.tcp.win_scale_factor: 3
net.inet.tcp.autorcvbufmax: 4194304
net.inet.tcp.autosndbufmax: 4194304

高速连接的建议设置

为了在 1Gbps 或更快的网络上优化性能，请增加 TCP 窗口缩放因子和自动调整缓冲区的最大值。将以下设置添加到/etc/sysctl.conf 文件中（或使用 sysctl 命令动态应用）：

修改 net.inet.tcp.win_scale_factor 和 net.inet.tcp.autorcvbufmax 和 net.inet.tcp.autosndbufmax

修改方法

sudo nano /etc/sysctl.conf
添加如下内容

# Increase TCP window scaling factor (default is 3-6; increase to 8)
net.inet.tcp.win_scale_factor=8

# Increase maximum receive buffer for TCP autotuning to 32MB
net.inet.tcp.autorcvbufmax=33554432

# Increase maximum send buffer for TCP autotuning to 32MB
net.inet.tcp.autosndbufmax=33554432

保存后执行 sudo sysctl -f /etc/sysctl.conf

测试

默认情况下

iperf3 测试

speedtest 测试

修改后

iperf3 测试

speedtest 测试

:::warning

这些设置非常适合高性能使用场景，例如文件服务器、高吞吐量应用程序或研究环境。
如果这些设置导致不稳定或降低了您特定使用场景的性能，请恢复设置。
如果设置后发现 iperf3 Retr 数据包丢失严重，请调 macOS 整缓冲区大小，或者调整 VPS TCP 缓冲区大小。 :::

使用代理访问各AI平台的API

Mon, 28 Apr 2025 00:00:00 GMT

项目地址

LLM Proxy

背景

由于各个 AI 公司对于中国大陆限制了访问，导致我们无法直接访问这些地区的 API，所以需要使用代理来访问这些地区的 API。

比如 OpenAI 的 API 访问限制：

中国大陆地区无法访问
香港地区无法访问

解决方案

在一台美国服务器上部署一个代理，然后使用这个代理来访问 AI API。

部署

我这里添加了 mongoose 来存储请求记录，所以需要安装 mongoose，如果你不需要则跳过。

# 初始化项目
npm init -y
# 安装 mongoose
npm install mongoose

使用 pm2 来启动项目：

# 启动项目
pm2 start llm-proxy.js --name llm-proxy
# 使用环境变量
MONGODB_URI=mongodb://localhost:27017/llm-proxy PORT=8088 HOST=0.0.0.0 pm2 start llm-proxy.js --name llm-proxy
# 查看项目
pm2 list
# 停止项目
pm2 stop llm-proxy

代码

代理代码

// llm-proxy.js
// 导入 Node.js 内置模块
const http = require('http');
const https = require('https'); // 需要根据目标URL的协议选择 http 或 https
const fs = require('fs');
const path = require('path');
const { URL } = require('url');
const mongoose = require('mongoose');

// 获取环境变量
const PORT = process.env.PORT || 8088;
const HOST = process.env.HOST || '0.0.0.0';
const MONGODB_URI = process.env.MONGODB_URI || '';

// 如果 MONGODB_URI 存在，则使用 MongoDB 存储请求记录
let AiProxyUsage = null;
if (MONGODB_URI) {
  try {
    mongoose.connect(MONGODB_URI, { useNewUrlParser: true, useUnifiedTopology: true });
    const AiProxyUsageSchema = new mongoose.Schema({
      type: {
        type: String,
        required: true,
      },
      createTime: {
        type: String,
        required: true,
      },
    });
    AiProxyUsage = mongoose?.models?.AiProxyUsage || mongoose.model('AiProxyUsage', AiProxyUsageSchema);
  } catch (error) {
    console.error(`Error connecting to MongoDB: ${error}`);
  }
}

// API 路由映射
const apiMapping = {
  '/discord': 'https://discord.com/api',
  '/telegram': 'https://api.telegram.org',
  '/openai': 'https://api.openai.com',
  '/claude': 'https://api.anthropic.com',
  '/gemini': 'https://generativelanguage.googleapis.com',
  '/meta': 'https://www.meta.ai/api', // 注意：实际的Meta API可能不同
  '/groq': 'https://api.groq.com/openai',
  '/xai': 'https://api.x.ai',
  '/cohere': 'https://api.cohere.ai',
  '/huggingface': 'https://api-inference.huggingface.co',
  '/together': 'https://api.together.xyz',
  '/novita': 'https://api.novita.ai',
  '/portkey': 'https://api.portkey.ai',
  '/fireworks': 'https://api.fireworks.ai',
  '/openrouter': 'https://openrouter.ai/api'
};

// 允许转发到目标 API 的请求头列表（小写）
const allowedHeaders = ['accept', 'content-type', 'authorization'];

// 辅助函数：从路径名中提取匹配的前缀和剩余部分
function extractPrefixAndRest(pathname, prefixes) {
  for (const prefix of prefixes) {
    if (pathname.startsWith(prefix)) {
      return [prefix, pathname.slice(prefix.length)];
    }
  }
  return [null, null];
}

// 创建 HTTP 服务器
const server = http.createServer(async (req, res) => {
  // 解析请求 URL
  // Node.js 的 req.url 只包含路径和查询参数，需要结合 host 来构造完整 URL
  const requestUrl = new URL(req.url, `http://${req.headers.host}`);
  const pathname = requestUrl.pathname;

  // 1. 处理根路径和 index.html -> 提供本地 HTML 文件
  if (pathname === '/' || pathname === '/index.html') {
    const filePath = path.join(__dirname, 'index.html'); // 假设 index.html 在脚本同级目录下
    fs.readFile(filePath, (err, data) => {
      if (err) {
        console.error(`Error reading index.html: ${err}`);
        res.writeHead(500, { 'Content-Type': 'text/plain' });
        res.end('Internal Server Error - Could not read index.html');
      } else {
        res.writeHead(200, { 'Content-Type': 'text/html' });
        res.end(data);
      }
    });
    return; // 结束请求处理
  }

  // 2. 处理 robots.txt
  if (pathname === '/robots.txt') {
    res.writeHead(200, { 'Content-Type': 'text/plain' });
    res.end('User-agent: *\nDisallow: /');
    return; // 结束请求处理
  }

  // 3. 处理 API 代理
  const [prefix, rest] = extractPrefixAndRest(pathname, Object.keys(apiMapping));

  if (!prefix) {
    // 如果路径不匹配任何已知前缀，返回 404
    res.writeHead(404, { 'Content-Type': 'text/plain' });
    res.end('Not Found');
    return; // 结束请求处理
  }

  // 构建目标 API 的 URL
  const targetBaseUrl = apiMapping[prefix];
  const targetUrl = `${targetBaseUrl}${rest}${requestUrl.search}`; // 包含查询参数

  // 准备转发请求的选项
  const options = {
    method: req.method,
    headers: {},
    // agent: targetBaseUrl.startsWith('https') ? new https.Agent({ keepAlive: true }) : new http.Agent({ keepAlive: true }) // 可选：使用 agent 进行连接复用
  };

  // 复制允许的请求头
  for (const key in req.headers) {
    if (allowedHeaders.includes(key.toLowerCase())) {
      options.headers[key] = req.headers[key];
    }
  }
  // 确保 host 头部设置为目标主机，而不是代理服务器的主机
  options.headers['host'] = new URL(targetBaseUrl).host;


  // 选择 http 或 https 模块进行请求
  const protocol = targetBaseUrl.startsWith('https') ? https : http;

  // 创建代理请求
  const proxyReq = protocol.request(targetUrl, options, (proxyRes) => {
    // 设置响应头
    // 复制目标服务器的响应头到客户端响应
    const responseHeaders = { ...proxyRes.headers }; // 复制一份

    // 添加额外的安全响应头
    responseHeaders['X-Content-Type-Options'] = 'nosniff';
    responseHeaders['X-Frame-Options'] = 'DENY';
    responseHeaders['Referrer-Policy'] = 'no-referrer';
    // 可以选择性地删除或修改某些从目标服务器传来的头，例如 'transfer-encoding'
    // delete responseHeaders['transfer-encoding'];

    // 将目标服务器的状态码和处理后的响应头写入客户端响应
    res.writeHead(proxyRes.statusCode, responseHeaders);

    // 将目标服务器的响应体流式传输到客户端响应
    proxyRes.pipe(res, { end: true });
  });

  // 处理代理请求错误
  proxyReq.on('error', (err) => {
    console.error(`Proxy request error: ${err}`);
    if (!res.headersSent) {
      res.writeHead(502, { 'Content-Type': 'text/plain' }); // 502 Bad Gateway
    }
    res.end('Bad Gateway');
  });

  // 使用 MongoDB 存储请求记录
  if (MONGODB_URI && AiProxyUsage) {
    const usage = new AiProxyUsage({
      type: prefix,
      createTime: new Date().toISOString(),
    });
    usage.save();
  }

  // 将客户端请求体流式传输到代理请求
  // 对于 GET, HEAD 等没有 body 的请求，这不会做任何事
  req.pipe(proxyReq, { end: true });

});

// 启动服务器
server.listen(PORT, HOST, () => {
  console.log(`Node.js proxy server running on http://${HOST}:${PORT}`);
  console.log(`Root path serves './index.html'`);
  console.log('Proxying the following prefixes:');
  Object.keys(apiMapping).forEach(prefix => {
    console.log(`  ${prefix} -> ${apiMapping[prefix]}`);
  });
});

// 可选：更优雅地处理关闭信号，以便 pm2 reload/stop
process.on('SIGINT', () => {
  console.log('SIGINT signal received: closing HTTP server');
  server.close(() => {
    console.log('HTTP server closed');
    process.exit(0);
  });
});

前端页面

<!-- index.html -->
<!DOCTYPE html>
<html lang="zh-CN">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link rel="icon"
    href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><text y=%22.9em%22 font-size=%2290%22>🚀</text></svg>">
  <title>LLM Proxy - 简单、安全、高效</title>
  <!-- seo -->
  <meta name="description" content="LLM Proxy - 提供简单、安全、高效、免费的 API 代理服务，让您的 AI 应用更加稳定、快速。">
  <meta name="keywords" content="LLM Proxy, API Proxy, AI, 代理, 简单, 安全, 高效">
  <meta name="robots" content="index, follow">
  <meta name="googlebot" content="index, follow">
  <meta name="bingbot" content="index, follow">
  <script src="https://cdn.tailwindcss.com?plugins=forms,typography,aspect-ratio,line-clamp"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/highlight.min.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/highlight.js@11.9.0/lib/languages/javascript.min.js"></script>
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/highlight.js@11.9.0/styles/atom-one-light.min.css">
  <script>
    // Tailwind 配置
    tailwind.config = {
      theme: {
        extend: {
          fontFamily: {
            sans: ['-apple-system', 'BlinkMacSystemFont', 'SF Pro Display', 'SF Pro Text', 'Helvetica Neue', 'Arial', 'sans-serif'],
            mono: ['SF Mono', 'SFMono-Regular', 'Menlo', 'Monaco', 'Consolas', '"Liberation Mono"', '"Courier New"', 'monospace'],
          },
          maxWidth: {
            'screen-xl': '1280px',
          },
          colors: {
            'apple-blue': {
              50: '#E8F2FF',
              100: '#C9E0FF',
              200: '#A6CDFF',
              300: '#83BAFF',
              400: '#5FA7FF',
              500: '#3C94FF',
              600: '#0071E3', // Apple 按钮蓝
              700: '#0051A5',
              800: '#00356B',
              900: '#001A36',
            },
            'apple-gray': {
              50: '#F9F9F9', // 浅灰背景
              100: '#F5F5F7', // Apple 官网背景灰
              200: '#E8E8ED',
              300: '#D2D2D7',
              400: '#B1B1B6',
              500: '#86868B', // Apple 官网文字灰
              600: '#6E6E73',
              700: '#414144',
              800: '#2D2D2F',
              900: '#1D1D1F', // Apple 官网深色文字
            }
          },
          boxShadow: {
            'apple': '0 2px 5px -1px rgba(0, 0, 0, 0.1), 0 2px 5px -1px rgba(0, 0, 0, 0.06)',
            'apple-md': '0 4px 12px -2px rgba(0, 0, 0, 0.08), 0 2px 6px -1px rgba(0, 0, 0, 0.05)',
            'apple-lg': '0 10px 20px -5px rgba(0, 0, 0, 0.1), 0 5px 10px -5px rgba(0, 0, 0, 0.04)',
          },
          borderRadius: {
            'apple': '10px',
            'apple-sm': '6px'
          }
        }
      }
    }
  </script>
  <style type="text/tailwindcss">
    body {
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
      letter-spacing: -0.2px;
    }
    .copy-btn:disabled svg {
      color: theme('colors.green.500');
    }
    /* 苹果风格滚动条 */
    ::-webkit-scrollbar {
      width: 8px;
      height: 8px;
    }
    ::-webkit-scrollbar-track {
      background: #f3f4f6; /* gray-100 instead of apple-gray.100 */
      border-radius: 100px;
    }
    ::-webkit-scrollbar-thumb {
      background: #d1d5db; /* gray-300 instead of apple-gray.300 */
      border-radius: 100px;
    }
    ::-webkit-scrollbar-thumb:hover {
      background: #9ca3af; /* gray-400 instead of apple-gray.400 */
    }
    
    /* 代码高亮自定义样式 */
    pre {
      position: relative;
      background: #f9fafb; /* gray-50 instead of apple-gray.50 */
      border-radius: 0.375rem; /* rounded-md instead of borderRadius.apple-sm */
      margin: 0;
      padding: 1rem;
      overflow: auto;
    }
    pre code {
      font-family: theme('fontFamily.mono');
      font-size: 0.9rem;
      line-height: 1.5;
      display: block;
      padding: 0;
    }
    /* 关键词高亮样式 */
    .hljs-keyword {
      color: #0033cc;
      font-weight: 500;
    }
    /* 字符串高亮样式 */
    .hljs-string {
      color: #067d17;
    }
    /* 注释高亮样式 */
    .hljs-comment {
      color: #888888;
      font-style: italic;
    }
    /* 函数高亮样式 */
    .hljs-function {
      color: #6f42c1;
    }
    /* 数字高亮样式 */
    .hljs-number {
      color: #986801;
    }
    /* 属性高亮样式 */
    .hljs-attr, .hljs-property {
      color: #e36209;
    }
    .code-container {
      position: relative;
      border-radius: 0.375rem; /* rounded-md instead of borderRadius.apple-sm */
      box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06); /* shadow-sm instead of boxShadow.apple */
      overflow: hidden;
      width: 100%;
      max-width: 100%;
      margin: 0 auto;
    }
    .code-header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 0.5rem 1rem;
      background: #f3f4f6; /* gray-100 instead of apple-gray.100 */
      border-bottom: 1px solid #e5e7eb; /* gray-200 instead of apple-gray.200 */
    }
    .code-title {
      font-size: 0.85rem;
      font-weight: 500;
      color: #4b5563; /* gray-600 instead of apple-gray.600 */
    }
    .code-copy-btn {
      background: transparent;
      border: none;
      cursor: pointer;
      padding: 0.25rem;
      border-radius: 4px;
      color: #6b7280; /* gray-500 instead of apple-gray.500 */
      transition: all 0.2s;
    }
    .code-copy-btn:hover {
      color: #2563eb; /* blue-600 instead of apple-blue.600 */
      background: rgba(0, 0, 0, 0.05);
    }
  </style>
  <script>
    // 确保highlight.js在页面加载完成后立即执行高亮
    window.onload = function () {
      hljs.configure({
        languages: ['javascript']
      });
      hljs.highlightAll();
    };
  </script>
</head>

<body class="bg-apple-gray-50 text-apple-gray-900 font-sans flex flex-col items-center min-h-screen py-8 px-4">

  <div class="w-full max-w-screen-xl space-y-6 md:space-y-8">

    <div class="bg-gradient-to-br from-blue-600 to-blue-400 rounded-apple shadow-apple-lg text-center p-8 md:p-12">
      <h1 class="text-4xl md:text-6xl font-medium tracking-tight mb-2 md:mb-3 text-white">LLM Proxy</h1>
      <h2 class="text-xl md:text-2xl font-light mb-6 md:mb-8 text-white/90">简单、安全、高效</h2>
      <p class="text-base md:text-xl leading-relaxed font-light text-white/90 mx-auto">
        使用美国西部服务器，免费提供简单、安全、高效的 API 代理服务，让您的 AI 应用更加稳定、快速。
      </p>
    </div>

    <div class="bg-white rounded-apple shadow-apple-md p-6 md:p-8">
      <h2 class="text-xl md:text-2xl font-medium text-apple-gray-900 mb-3 text-left">可用端点</h2>
      <p class="text-sm md:text-base font-light text-apple-gray-600 mb-6">选择并配置您需要的 AI 服务接口</p>
      <div class="overflow-x-auto rounded-apple-sm">
        <table class="w-full text-left text-sm md:text-base table-fixed">
          <thead>
            <tr>
              <th class="w-[18%] pb-3 pt-2 px-3 md:px-4 font-medium text-apple-gray-600 border-b border-apple-gray-200">
                服务
              </th>
              <th class="w-[42%] pb-3 pt-2 px-3 md:px-4 font-medium text-apple-gray-600 border-b border-apple-gray-200">
                代理地址
              </th>
              <th class="w-[40%] pb-3 pt-2 px-3 md:px-4 font-medium text-apple-gray-600 border-b border-apple-gray-200">
                原始地址</th>
            </tr>
          </thead>
          <tbody class="divide-y divide-apple-gray-200">
            <tr>
              <td class="py-3.5 px-3 md:px-4 font-medium text-apple-gray-800 align-middle">OpenAI</td>
              <td class="py-3.5 px-3 md:px-4 align-middle">
                <div class="flex items-center gap-1">
                  <span
                    class="font-mono text-apple-gray-600 break-words min-w-0 text-sm">https://llm-proxy.mihouo.com/openai</span>
                  <button
                    class="copy-btn flex-shrink-0 p-1.5 rounded-full text-apple-gray-500 hover:bg-apple-gray-100 hover:text-apple-blue-600 focus:outline-none focus:ring-1 focus:ring-apple-blue-500 transition-colors duration-150"
                    data-copy-text="https://llm-proxy.mihouo.com/openai" aria-label="复制地址">
                  </button>
                </div>
              </td>
              <td class="py-3.5 px-3 md:px-4 align-middle">
                <a href="https://platform.openai.com/docs/api-reference" target="_blank" rel="noopener noreferrer"
                  class="font-mono text-apple-blue-600 hover:underline break-words text-sm">https://api.openai.com</a>
              </td>
            </tr>
            <tr>
              <td class="py-3.5 px-3 md:px-4 font-medium text-apple-gray-800 align-middle">Anthropic Claude</td>
              <td class="py-3.5 px-3 md:px-4 align-middle">
                <div class="flex items-center gap-1">
                  <span
                    class="font-mono text-apple-gray-600 break-words min-w-0 text-sm">https://llm-proxy.mihouo.com/claude</span>
                  <button
                    class="copy-btn flex-shrink-0 p-1.5 rounded-full text-apple-gray-500 hover:bg-apple-gray-100 hover:text-apple-blue-600 focus:outline-none focus:ring-1 focus:ring-apple-blue-500 transition-colors duration-150"
                    data-copy-text="https://llm-proxy.mihouo.com/claude" aria-label="复制地址">
                  </button>
                </div>
              </td>
              <td class="py-3.5 px-3 md:px-4 align-middle">
                <a href="https://docs.anthropic.com/claude/reference/getting-started-with-the-api" target="_blank"
                  rel="noopener noreferrer"
                  class="font-mono text-apple-blue-600 hover:underline break-words text-sm">https://api.anthropic.com</a>
              </td>
            </tr>
            <tr>
              <td class="py-3.5 px-3 md:px-4 font-medium text-apple-gray-800 align-middle">Google Gemini</td>
              <td class="py-3.5 px-3 md:px-4 align-middle">
                <div class="flex items-center gap-1">
                  <span
                    class="font-mono text-apple-gray-600 break-words min-w-0 text-sm">https://llm-proxy.mihouo.com/gemini</span>
                  <button
                    class="copy-btn flex-shrink-0 p-1.5 rounded-full text-apple-gray-500 hover:bg-apple-gray-100 hover:text-apple-blue-600 focus:outline-none focus:ring-1 focus:ring-apple-blue-500 transition-colors duration-150"
                    data-copy-text="https://llm-proxy.mihouo.com/gemini" aria-label="复制地址">
                  </button>
                </div>
              </td>
              <td class="py-3.5 px-3 md:px-4 align-middle">
                <a href="https://ai.google.dev/api/rest" target="_blank" rel="noopener noreferrer"
                  class="font-mono text-apple-blue-600 hover:underline break-words text-sm">https://generativelanguage.googleapis.com</a>
              </td>
            </tr>
            <tr>
              <td class="py-3.5 px-3 md:px-4 font-medium text-apple-gray-800 align-middle">Groq</td>
              <td class="py-3.5 px-3 md:px-4 align-middle">
                <div class="flex items-center gap-1">
                  <span
                    class="font-mono text-apple-gray-600 break-words min-w-0 text-sm">https://llm-proxy.mihouo.com/groq</span>
                  <button
                    class="copy-btn flex-shrink-0 p-1.5 rounded-full text-apple-gray-500 hover:bg-apple-gray-100 hover:text-apple-blue-600 focus:outline-none focus:ring-1 focus:ring-apple-blue-500 transition-colors duration-150"
                    data-copy-text="https://llm-proxy.mihouo.com/groq" aria-label="复制地址">
                  </button>
                </div>
              </td>
              <td class="py-3.5 px-3 md:px-4 align-middle">
                <a href="https://console.groq.com/docs/api-reference" target="_blank" rel="noopener noreferrer"
                  class="font-mono text-apple-blue-600 hover:underline break-words text-sm">https://api.groq.com</a>
              </td>
            </tr>
            <tr>
              <td class="py-3.5 px-3 md:px-4 font-medium text-apple-gray-800 align-middle">Meta AI</td>
              <td class="py-3.5 px-3 md:px-4 align-middle">
                <div class="flex items-center gap-1">
                  <span
                    class="font-mono text-apple-gray-600 break-words min-w-0 text-sm">https://llm-proxy.mihouo.com/meta</span>
                  <button
                    class="copy-btn flex-shrink-0 p-1.5 rounded-full text-apple-gray-500 hover:bg-apple-gray-100 hover:text-apple-blue-600 focus:outline-none focus:ring-1 focus:ring-apple-blue-500 transition-colors duration-150"
                    data-copy-text="https://llm-proxy.mihouo.com/meta" aria-label="复制地址">
                  </button>
                </div>
              </td>
              <td class="py-3.5 px-3 md:px-4 align-middle">
                <a href="https://developers.facebook.com/docs/graph-api" target="_blank" rel="noopener noreferrer"
                  class="font-mono text-apple-blue-600 hover:underline break-words text-sm">https://developers.facebook.com/docs/graph-api</a>
              </td>
            </tr>
            <tr>
              <td class="py-3.5 px-3 md:px-4 font-medium text-apple-gray-800 align-middle">Cohere</td>
              <td class="py-3.5 px-3 md:px-4 align-middle">
                <div class="flex items-center gap-1">
                  <span
                    class="font-mono text-apple-gray-600 break-words min-w-0 text-sm">https://llm-proxy.mihouo.com/cohere</span>
                  <button
                    class="copy-btn flex-shrink-0 p-1.5 rounded-full text-apple-gray-500 hover:bg-apple-gray-100 hover:text-apple-blue-600 focus:outline-none focus:ring-1 focus:ring-apple-blue-500 transition-colors duration-150"
                    data-copy-text="https://llm-proxy.mihouo.com/cohere" aria-label="复制地址">
                  </button>
                </div>
              </td>
              <td class="py-3.5 px-3 md:px-4 align-middle">
                <a href="https://docs.cohere.com/reference/about" target="_blank" rel="noopener noreferrer"
                  class="font-mono text-apple-blue-600 hover:underline break-words text-sm">https://api.cohere.ai</a>
              </td>
            </tr>
            <tr>
              <td class="py-3.5 px-3 md:px-4 font-medium text-apple-gray-800 align-middle">Together AI</td>
              <td class="py-3.5 px-3 md:px-4 align-middle">
                <div class="flex items-center gap-1">
                  <span
                    class="font-mono text-apple-gray-600 break-words min-w-0 text-sm">https://llm-proxy.mihouo.com/together</span>
                  <button
                    class="copy-btn flex-shrink-0 p-1.5 rounded-full text-apple-gray-500 hover:bg-apple-gray-100 hover:text-apple-blue-600 focus:outline-none focus:ring-1 focus:ring-apple-blue-500 transition-colors duration-150"
                    data-copy-text="https://llm-proxy.mihouo.com/together" aria-label="复制地址">
                  </button>
                </div>
              </td>
              <td class="py-3.5 px-3 md:px-4 align-middle">
                <a href="https://docs.together.ai/reference/inference" target="_blank" rel="noopener noreferrer"
                  class="font-mono text-apple-blue-600 hover:underline break-words text-sm">https://api.together.xyz</a>
              </td>
            </tr>
            <tr>
              <td class="py-3.5 px-3 md:px-4 font-medium text-apple-gray-800 align-middle">X.ai (Grok)</td>
              <td class="py-3.5 px-3 md:px-4 align-middle">
                <div class="flex items-center gap-1">
                  <span
                    class="font-mono text-apple-gray-600 break-words min-w-0 text-sm">https://llm-proxy.mihouo.com/xai</span>
                  <button
                    class="copy-btn flex-shrink-0 p-1.5 rounded-full text-apple-gray-500 hover:bg-apple-gray-100 hover:text-apple-blue-600 focus:outline-none focus:ring-1 focus:ring-apple-blue-500 transition-colors duration-150"
                    data-copy-text="https://llm-proxy.mihouo.com/xai" aria-label="复制地址">
                  </button>
                </div>
              </td>
              <td class="py-3.5 px-3 md:px-4 align-middle">
                <a href="https://docs.x.ai/" target="_blank" rel="noopener noreferrer"
                  class="font-mono text-apple-blue-600 hover:underline break-words text-sm">https://api.x.ai</a>
              </td>
            </tr>
            <tr>
              <td class="py-3.5 px-3 md:px-4 font-medium text-apple-gray-800 align-middle">Hugging Face</td>
              <td class="py-3.5 px-3 md:px-4 align-middle">
                <div class="flex items-center gap-1">
                  <span
                    class="font-mono text-apple-gray-600 break-words min-w-0 text-sm">https://llm-proxy.mihouo.com/huggingface</span>
                  <button
                    class="copy-btn flex-shrink-0 p-1.5 rounded-full text-apple-gray-500 hover:bg-apple-gray-100 hover:text-apple-blue-600 focus:outline-none focus:ring-1 focus:ring-apple-blue-500 transition-colors duration-150"
                    data-copy-text="https://llm-proxy.mihouo.com/huggingface" aria-label="复制地址">
                  </button>
                </div>
              </td>
              <td class="py-3.5 px-3 md:px-4 align-middle">
                <a href="https://huggingface.co/docs/api-inference/index" target="_blank" rel="noopener noreferrer"
                  class="font-mono text-apple-blue-600 hover:underline break-words text-sm">https://api-inference.huggingface.co</a>
              </td>
            </tr>
            <tr>
              <td class="py-3.5 px-3 md:px-4 font-medium text-apple-gray-800 align-middle">OpenRouter</td>
              <td class="py-3.5 px-3 md:px-4 align-middle">
                <div class="flex items-center gap-1">
                  <span
                    class="font-mono text-apple-gray-600 break-words min-w-0 text-sm">https://llm-proxy.mihouo.com/openrouter</span>
                  <button
                    class="copy-btn flex-shrink-0 p-1.5 rounded-full text-apple-gray-500 hover:bg-apple-gray-100 hover:text-apple-blue-600 focus:outline-none focus:ring-1 focus:ring-apple-blue-500 transition-colors duration-150"
                    data-copy-text="https://llm-proxy.mihouo.com/openrouter" aria-label="复制地址">
                  </button>
                </div>
              </td>
              <td class="py-3.5 px-3 md:px-4 align-middle">
                <a href="https://openrouter.ai/docs" target="_blank" rel="noopener noreferrer"
                  class="font-mono text-apple-blue-600 hover:underline break-words text-sm">https://openrouter.ai/api</a>
              </td>
            </tr>
            <tr>
              <td class="py-3.5 px-3 md:px-4 font-medium text-apple-gray-800 align-middle">Fireworks AI</td>
              <td class="py-3.5 px-3 md:px-4 align-middle">
                <div class="flex items-center gap-1">
                  <span
                    class="font-mono text-apple-gray-600 break-words min-w-0 text-sm">https://llm-proxy.mihouo.com/fireworks</span>
                  <button
                    class="copy-btn flex-shrink-0 p-1.5 rounded-full text-apple-gray-500 hover:bg-apple-gray-100 hover:text-apple-blue-600 focus:outline-none focus:ring-1 focus:ring-apple-blue-500 transition-colors duration-150"
                    data-copy-text="https://llm-proxy.mihouo.com/fireworks" aria-label="复制地址">
                  </button>
                </div>
              </td>
              <td class="py-3.5 px-3 md:px-4 align-middle">
                <a href="https://readme.fireworks.ai/reference/introduction" target="_blank" rel="noopener noreferrer"
                  class="font-mono text-apple-blue-600 hover:underline break-words text-sm">https://api.fireworks.ai</a>
              </td>
            </tr>
            <tr>
              <td class="py-3.5 px-3 md:px-4 font-medium text-apple-gray-800 align-middle">Portkey AI</td>
              <td class="py-3.5 px-3 md:px-4 align-middle">
                <div class="flex items-center gap-1">
                  <span
                    class="font-mono text-apple-gray-600 break-words min-w-0 text-sm">https://llm-proxy.mihouo.com/portkey</span>
                  <button
                    class="copy-btn flex-shrink-0 p-1.5 rounded-full text-apple-gray-500 hover:bg-apple-gray-100 hover:text-apple-blue-600 focus:outline-none focus:ring-1 focus:ring-apple-blue-500 transition-colors duration-150"
                    data-copy-text="https://llm-proxy.mihouo.com/portkey" aria-label="复制地址">
                  </button>
                </div>
              </td>
              <td class="py-3.5 px-3 md:px-4 align-middle">
                <a href="https://portkey.ai/docs/api-reference/introduction" target="_blank" rel="noopener noreferrer"
                  class="font-mono text-apple-blue-600 hover:underline break-words text-sm">https://api.portkey.ai</a>
              </td>
            </tr>
            <tr>
              <td class="py-3.5 px-3 md:px-4 font-medium text-apple-gray-800 align-middle">Novita AI</td>
              <td class="py-3.5 px-3 md:px-4 align-middle">
                <div class="flex items-center gap-1">
                  <span
                    class="font-mono text-apple-gray-600 break-words min-w-0 text-sm">https://llm-proxy.mihouo.com/novita</span>
                  <button
                    class="copy-btn flex-shrink-0 p-1.5 rounded-full text-apple-gray-500 hover:bg-apple-gray-100 hover:text-apple-blue-600 focus:outline-none focus:ring-1 focus:ring-apple-blue-500 transition-colors duration-150"
                    data-copy-text="https://llm-proxy.mihouo.com/novita" aria-label="复制地址">
                  </button>
                </div>
              </td>
              <td class="py-3.5 px-3 md:px-4 align-middle">
                <a href="https://docs.novita.ai/api-reference" target="_blank" rel="noopener noreferrer"
                  class="font-mono text-apple-blue-600 hover:underline break-words text-sm">https://api.novita.ai</a>
              </td>
            </tr>
            <tr>
              <td class="py-3.5 px-3 md:px-4 font-medium text-apple-gray-800 align-middle">Discord</td>
              <td class="py-3.5 px-3 md:px-4 align-middle">
                <div class="flex items-center gap-1">
                  <span
                    class="font-mono text-apple-gray-600 break-words min-w-0 text-sm">https://llm-proxy.mihouo.com/discord</span>
                  <button
                    class="copy-btn flex-shrink-0 p-1.5 rounded-full text-apple-gray-500 hover:bg-apple-gray-100 hover:text-apple-blue-600 focus:outline-none focus:ring-1 focus:ring-apple-blue-500 transition-colors duration-150"
                    data-copy-text="https://llm-proxy.mihouo.com/discord" aria-label="复制地址">
                  </button>
                </div>
              </td>
              <td class="py-3.5 px-3 md:px-4 align-middle">
                <a href="https://discord.com/developers/docs/intro" target="_blank" rel="noopener noreferrer"
                  class="font-mono text-apple-blue-600 hover:underline break-words text-sm">https://discord.com/api</a>
              </td>
            </tr>
            <tr>
              <td class="py-3.5 px-3 md:px-4 font-medium text-apple-gray-800 align-middle">Telegram</td>
              <td class="py-3.5 px-3 md:px-4 align-middle">
                <div class="flex items-center gap-1">
                  <span
                    class="font-mono text-apple-gray-600 break-words min-w-0 text-sm">https://llm-proxy.mihouo.com/telegram</span>
                  <button
                    class="copy-btn flex-shrink-0 p-1.5 rounded-full text-apple-gray-500 hover:bg-apple-gray-100 hover:text-apple-blue-600 focus:outline-none focus:ring-1 focus:ring-apple-blue-500 transition-colors duration-150"
                    data-copy-text="https://llm-proxy.mihouo.com/telegram" aria-label="复制地址">
                  </button>
                </div>
              </td>
              <td class="py-3.5 px-3 md:px-4 align-middle">
                <a href="https://core.telegram.org/bots/api" target="_blank" rel="noopener noreferrer"
                  class="font-mono text-apple-blue-600 hover:underline break-words text-sm">https://core.telegram.org/bots/api</a>
              </td>
            </tr>
          </tbody>
        </table>
      </div>
    </div>

    <!-- 使用示例 -->
    <div class="bg-white rounded-apple shadow-apple-md p-6 md:p-8 text-center">
      <h2 class="text-xl md:text-2xl font-medium mb-4 text-apple-gray-800">使用示例</h2>
      <p class="text-base md:text-lg font-light text-apple-gray-600 mb-6">通过几行简单的代码，即可轻松连接到 API 服务</p>

      <div class="code-container mx-auto text-left">
        <div class="code-header">
          <span class="code-title">JavaScript</span>
          <button class="code-copy-btn" aria-label="复制代码">
            <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="w-4 h-4"
              viewBox="0 0 16 16">
              <path
                d="M4 1.5H3a2 2 0 0 0-2 2V14a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V3.5a2 2 0 0 0-2-2h-1v1h1a1 1 0 0 1 1 1V14a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V3.5a1 1 0 0 1 1-1h1v-1z">
              </path>
              <path
                d="M9.5 1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-3a.5.5 0 0 1-.5-.5v-1a.5.5 0 0 1 .5-.5h3zm-3-1A1.5 1.5 0 0 0 5 1.5v1A1.5 1.5 0 0 0 6.5 4h3A1.5 1.5 0 0 0 11 2.5v-1A1.5 1.5 0 0 0 9.5 0h-3z">
              </path>
            </svg>
          </button>
        </div>
        <pre><code class="language-javascript">// 导入 OpenAI 库
const { OpenAI } = require('openai');

// 创建 API 客户端实例
const openai = new OpenAI({
  apiKey: 'sk-**************************************',
  baseURL: 'https://llm-proxy.mihouo.com/openai/v1',
});

// 发送请求示例
async function generateResponse() {
  const response = await openai.chat.completions.create({
    model: "gpt-3.5-turbo",
    messages: [
      { role: "system", content: "你是一个专业的AI助手。" },
      { role: "user", content: "你好，请介绍一下自己。" }
    ],
    temperature: 0.7,
  });
  
  console.log(response.choices[0].message.content);
}</code></pre>
      </div>
    </div>

    <div class="bg-white rounded-apple shadow-apple-md p-6 text-center">
      <div class="flex flex-col md:flex-row items-center justify-center space-y-2 md:space-y-0 md:space-x-8">
        <p class="flex items-center text-apple-gray-500 text-sm">
          <span class="inline-block w-2.5 h-2.5 bg-green-500 rounded-full mr-2"></span>
          <span class="font-light">状态：</span>
          <span class="text-apple-gray-700 font-medium ml-1">运行中</span>
        </p>
        <p class="text-sm text-apple-gray-500">
          <span class="font-light">北京时间：</span>
          <span id="live-time" class="font-medium text-apple-gray-700 ml-1">加载中...</span>
        </p>
      </div>
    </div>

  </div>
  <script>
    // 时间更新脚本
    function updateLiveTime() {
      const timeElement = document.getElementById('live-time');
      if (timeElement) {
        const now = new Date();
        const beijingTime = now.toLocaleString('zh-CN', {
          timeZone: 'Asia/Shanghai',
          hour12: false,
          year: 'numeric', month: '2-digit', day: '2-digit',
          hour: '2-digit', minute: '2-digit', second: '2-digit'
        });
        timeElement.textContent = beijingTime.replace(/[\/]/g, '-').replace(/\s+/g, ' ').trim();
      }
    }
    updateLiveTime();
    setInterval(updateLiveTime, 1000);

    // --- 复制按钮脚本 ---
    document.addEventListener('DOMContentLoaded', () => {
      const copyButtons = document.querySelectorAll('.copy-btn');

      // 确保在DOM加载完成后再次尝试高亮
      hljs.configure({
        languages: ['javascript']
      });
      hljs.highlightAll();

      // 代码块复制功能
      const codeBlock = document.querySelector('pre code');
      const codeCopyBtn = document.querySelector('.code-copy-btn');

      if (codeBlock && codeCopyBtn) {
        codeCopyBtn.addEventListener('click', () => {
          const code = codeBlock.textContent;

          navigator.clipboard.writeText(code).then(() => {
            // 复制成功反馈
            const originalSvg = codeCopyBtn.innerHTML;

            // 替换为成功图标
            codeCopyBtn.innerHTML = `<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="w-4 h-4 text-green-500" viewBox="0 0 16 16"><path d="M12.736 3.97a.733.733 0 0 1 1.047 0c.286.289.29.756.01 1.05L7.88 12.01a.733.733 0 0 1-1.065.02L3.217 8.384a.757.757 0 0 1 0-1.06.733.733 0 0 1 1.047 0l3.052 3.093 5.4-6.425z"/></svg>`;

            // 1.5秒后恢复原始图标
            setTimeout(() => {
              codeCopyBtn.innerHTML = originalSvg;
            }, 1500);
          }).catch(err => {
            console.error('无法复制代码: ', err);
            alert('复制失败，请手动复制。');
          });
        });
      }

      // SVG Icons - 苹果风格图标
      const originalIconSvg = `<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="w-4 h-4" viewBox="0 0 16 16"><path d="M4 1.5H3a2 2 0 0 0-2 2V14a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V3.5a2 2 0 0 0-2-2h-1v1h1a1 1 0 0 1 1 1V14a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V3.5a1 1 0 0 1 1-1h1v-1z"/><path d="M9.5 1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-3a.5.5 0 0 1-.5-.5v-1a.5.5 0 0 1 .5-.5h3zm-3-1A1.5 1.5 0 0 0 5 1.5v1A1.5 1.5 0 0 0 6.5 4h3A1.5 1.5 0 0 0 11 2.5v-1A1.5 1.5 0 0 0 9.5 0h-3z"/></svg>`;
      const successIconSvg = `<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="w-4 h-4" viewBox="0 0 16 16"><path d="M12.736 3.97a.733.733 0 0 1 1.047 0c.286.289.29.756.01 1.05L7.88 12.01a.733.733 0 0 1-1.065.02L3.217 8.384a.757.757 0 0 1 0-1.06.733.733 0 0 1 1.047 0l3.052 3.093 5.4-6.425z"/></svg>`;

      copyButtons.forEach(button => {
        button.innerHTML = originalIconSvg; // 设置初始图标

        button.addEventListener('click', () => {
          const textToCopy = button.dataset.copyText;

          if (!textToCopy) {
            console.error('无复制内容');
            return;
          }
          if (!navigator.clipboard) {
            console.error('剪贴板 API 不可用');
            alert('抱歉，您的浏览器不支持或未启用剪贴板功能。');
            return;
          }

          navigator.clipboard.writeText(textToCopy).then(() => {
            // 成功反馈 - 苹果风格的平滑过渡
            button.innerHTML = successIconSvg;
            button.disabled = true;

            setTimeout(() => {
              button.innerHTML = originalIconSvg; // 恢复图标
              button.disabled = false;
            }, 1500); // 1.5秒后恢复

          }).catch(err => {
            console.error('无法复制文本: ', err);
            alert('复制失败，请手动复制。');
          });
        });
      });
    });
  </script>
</body>

</html>

Bage 德国机器留档测试

Sun, 27 Apr 2025 00:00:00 GMT

机器详情

CPU 1 vCPU
内存 1 GiB
存储 10 GiB
带宽 2 Gbps
流量 2 TB

IP Check

bash <(curl -Ls IP.Check.Place)

详情

########################################################################
                      IP质量体检报告：193.160.*.*
                    bash <(curl -sL Check.Place) -I
                   https://github.com/xykt/IPQuality
        报告时间：2025-04-27 14:54:05 CST  脚本版本：v2025-04-24
########################################################################
一、基础信息（Maxmind 数据库）
自治系统号：            AS63150
组织：                  BAGE
坐标：                  9°29′28″E, 51°17′57″N
地图：                  https://check.place/51.2993,9.491,15,cn
城市：                  N/A
使用地：                [DE]德国, [EU]欧洲
注册地：                [DE]德国
时区：                  Europe/Berlin
IP类型：                 原生IP 
二、IP类型属性
数据库：      IPinfo    ipregistry    ipapi     AbuseIPDB  IP2LOCATION 
使用类型：     家宽        家宽        机房        家宽        机房    
公司类型：     家宽        家宽        机房    
三、风险评分
风险等级：      极低         低       中等       高         极高
SCAMALYTICS：   3|低风险
ipapi：    0.00%|极低风险
AbuseIPDB：    0|低风险
IPQS：         0|低风险
Cloudflare：   0|低风险
DB-IP：         |低风险
四、风险因子
库： IP2LOCATION ipapi ipregistry IPQS SCAMALYTICS ipdata IPinfo IPWHOIS
地区：    [DE]    [DE]    [DE]    [DE]    [DE]    [DE]    [DE]    [DE]
代理：     否      否      否      否      否      否      否      否 
Tor：      否      否      否      否      否      否      否      否 
VPN：      否      否      否      否      否      无      否      否 
服务器：   是      是      否      无      否      否      否      否 
滥用：     否      否      否      否      无      否      无      无 
机器人：   否      否      无      否      否      无      无      无 
五、流媒体及AI服务解锁检测
服务商：  TikTok   Disney+  Netflix Youtube  AmazonPV  Spotify  ChatGPT 
状态：     解锁     解锁     解锁     解锁     解锁     屏蔽     解锁   
地区：     [DE]     [DE]     [DE]     [DE]     [DE]              [DE]   
方式：     原生     原生     原生     原生     原生              原生   
六、邮局连通性及黑名单检测
本地25端口：阻断
IP地址黑名单数据库：  有效 439   正常 423   已标记 16   黑名单 0
========================================================================
今日IP检测量：591；总检测量：210022。感谢使用xy系列脚本！ 
报告链接：https://Report.Check.Place/ip/1KTBKJG38.svg

########################################################################
                 IP质量体检报告：2602:f988:84:*:*:*:*:*
                    bash <(curl -sL Check.Place) -I
                   https://github.com/xykt/IPQuality
        报告时间：2025-04-27 14:54:05 CST  脚本版本：v2025-04-24
########################################################################
一、基础信息（Maxmind 数据库）
自治系统号：            AS63150
组织：                  BAGE
坐标：                  8°34′27″E, 50°2′18″N
地图：                  https://check.place/50.0383,8.5743,15,cn
城市：                  黑森州, 法兰克福, 60549
使用地：                [DE]德国, [EU]欧洲
注册地：                [US]美国
时区：                  Europe/Berlin
IP类型：                 广播IP 
二、IP类型属性
数据库：      IPinfo    ipregistry    ipapi     AbuseIPDB  IP2LOCATION 
使用类型：     家宽        家宽        机房        家宽        机房    
公司类型：     家宽        家宽        机房    
三、风险评分
风险等级：      极低         低       中等       高         极高
SCAMALYTICS：   3|低风险
ipapi：    0.00%|极低风险
AbuseIPDB：    0|低风险
IPQS：         0|低风险
Cloudflare：   0|低风险
DB-IP：         |低风险
四、风险因子
库： IP2LOCATION ipapi ipregistry IPQS SCAMALYTICS ipdata IPinfo IPWHOIS
地区：    [DE]    [DE]    [DE]    [DE]    [DE]    [DE]    [DE]    [DE]
代理：     否      否      否      否      否      否      否      否 
Tor：      否      否      否      否      否      否      否      否 
VPN：      否      否      否      否      否      无      否      否 
服务器：   是      是      否      无      否      否      否      否 
滥用：     否      否      否      否      无      否      无      无 
机器人：   否      否      无      否      否      无      无      无 
五、流媒体及AI服务解锁检测
服务商：  TikTok   Disney+  Netflix Youtube  AmazonPV  Spotify  ChatGPT 
状态：     失败     解锁     解锁     解锁     屏蔽     屏蔽     失败   
地区：              [DE]     [DE]     [DE]                              
方式：              原生     原生     原生                              
六、邮局连通性及黑名单检测
本地25端口：阻断
========================================================================
今日IP检测量：593；总检测量：210024。感谢使用xy系列脚本！ 
报告链接：https://Report.Check.Place/ip/2KEI8BGVI.svg

融合怪

一键脚本

::github{repo="spiritLHLS/ecs"}

curl -L https://gitlab.com/spiritysdx/za/-/raw/main/ecs.sh -o ecs.sh && chmod +x ecs.sh && bash ecs.sh

详情

--------------------- A Bench Script By spiritlhl ----------------------
                   测评频道: https://t.me/vps_reviews                    
VPS融合怪版本：2025.04.12
Shell项目地址：https://github.com/spiritLHLS/ecs
Go项目地址 [推荐]：https://github.com/oneclickvirt/ecs
---------------------基础信息查询--感谢所有开源项目---------------------
 CPU 型号          : AMD Ryzen 9 7950X 16-Core Processor
 CPU 核心数        : 1
 CPU 频率          : 4491.540 MHz
 CPU 缓存          : L1: 64.00 KB / L2: 512.00 KB / L3: 16.00 MB
 AES-NI指令集      : ✔ Enabled
 VM-x/AMD-V支持    : ✔ Enabled
 内存              : 190.27 MiB / 960.69 MiB
 Swap              : 268 KiB / 2.00 GiB
 硬盘空间          : 4.03 GiB / 9.76 GiB
 启动盘路径        : /dev/vda1
 系统在线时间      : 0 days, 4 hour 43 min
 负载              : 0.53, 0.28, 0.11
 系统              : Debian GNU/Linux 12 (bookworm) (x86_64)
 架构              : x86_64 (64 Bit)
 内核              : 6.1.0-33-amd64
 TCP加速方式       : bbr
 虚拟化架构        : KVM
 NAT类型           : Full Cone
 IPV4 ASN          : AS63150 BAGE CLOUD LLC
 IPV4 位置         : Frankfurt am Main / Hesse / DE
 IPV6 ASN          : AS63150 BAGE
 IPV6 位置         : Frankfurt am Main / Hesse / Germany
 IPV6 子网掩码     : 128
----------------------CPU测试--通过sysbench测试-------------------------
 -> CPU 测试中 (Fast Mode, 1-Pass @ 5sec)
 1 线程测试(单核)得分:          5812 Scores
---------------------内存测试--感谢lemonbench开源-----------------------
 -> 内存测试 Test (Fast Mode, 1-Pass @ 5sec)
 单线程读测试:          70247.97 MB/s
 单线程写测试:          38884.14 MB/s
------------------磁盘dd读写测试--感谢lemonbench开源--------------------
 -> 磁盘IO测试中 (4K Block/1M Block, Direct Mode)
 测试操作               写速度                                  读速度
 100MB-4K Block         55.7 MB/s (13.60 IOPS, 1.88s))          82.2 MB/s (20078 IOPS, 1.27s)
 1GB-1M Block           11.1 GB/s (10.57 IOPS, 0.09s))          17.1 GB/s (16303 IOPS, 0.06s)
---------------------磁盘fio读写测试--感谢yabs开源----------------------
Block Size | 4k            (IOPS) | 64k           (IOPS)
  ------   | ---            ----  | ----           ---- 
Read       | 198.20 MB/s  (49.5k) | 791.39 MB/s  (12.3k)
Write      | 198.72 MB/s  (49.6k) | 795.55 MB/s  (12.4k)
Total      | 396.92 MB/s  (99.2k) | 1.58 GB/s    (24.7k)
           |                      |                     
Block Size | 512k          (IOPS) | 1m            (IOPS)
  ------   | ---            ----  | ----           ---- 
Read       | 1.18 GB/s     (2.3k) | 1.16 GB/s     (1.1k)
Write      | 1.25 GB/s     (2.4k) | 1.24 GB/s     (1.2k)
Total      | 2.43 GB/s     (4.7k) | 2.40 GB/s     (2.3k)
------------流媒体解锁--基于oneclickvirt/CommonMediaTests开源-----------
以下测试的解锁地区是准确的，但是不是完整解锁的判断可能有误，这方面仅作参考使用
----------------Netflix-----------------
[IPV4]
您的出口IP完整解锁Netflix，支持非自制剧的观看
NF所识别的IP地域信息：德国
[IPV6]
您的出口IP完整解锁Netflix，支持非自制剧的观看
NF所识别的IP地域信息：德国
----------------Youtube-----------------
[IPV4]
连接方式: Youtube Video Server
视频缓存节点地域: 德国法兰克福(FRA15S37)
[IPV6]
连接方式: Youtube Video Server
视频缓存节点地域: 德国法兰克福(FRA16S31)
---------------DisneyPlus---------------
[IPV4]
当前IPv4出口所在地区即将开通DisneyPlus
[IPV6]
当前IPv4出口所在地区即将开通DisneyPlus
解锁Netflix，Youtube，DisneyPlus上面和下面进行比较，不同之处自行判断
----------------流媒体解锁--感谢RegionRestrictionCheck开源--------------
 以下为IPV4网络测试，若无IPV4网络则无输出
============[ Multination ]============
 Dazn:                                  Yes (Region: DE)
 Disney+:                               Yes (Region: DE)
 Netflix:                               Yes (Region: DE)
 YouTube Premium:                       Yes (Region: DE)
 Amazon Prime Video:                    Yes (Region: DE)
 TVBAnywhere+:                          Yes
 Spotify Registration:                  No
 OneTrust Region:                       DE [Unknown]
 iQyi Oversea Region:                   DE
 Bing Region:                           DE
 Apple Region:                          DE
 YouTube CDN:                           Frankfurt
 Netflix Preferred CDN:                 Frankfurt
 ChatGPT:                               Yes
 Google Gemini:                         No
 Claude:                                No
 Wikipedia Editability:                 Yes
 Google Play Store:                     Germany 
 Google Search CAPTCHA Free:            Yes
 Steam Currency:                        EUR
 ---Forum---
 Reddit:                                Yes
 ---Game---
 SD Gundam G Generation Eternal:        Yes
=======================================
 以下为IPV6网络测试，若无IPV6网络则无输出
============[ Multination ]============
 Dazn:                                  IPv6 Is Not Currently Supported
 Disney+:                               IPv6 Is Not Currently Supported
 Netflix:                               Yes (Region: DE)
 YouTube Premium:                       Yes (Region: DE)
 Amazon Prime Video:                    IPv6 Is Not Currently Supported
 TVBAnywhere+:                          IPv6 Is Not Currently Supported
 Spotify Registration:                  No
 OneTrust Region:                       DE [Hesse]
 iQyi Oversea Region:                   IPv6 Is Not Currently Supported
 Bing Region:                           DE
 Apple Region:                          DE
 YouTube CDN:                           Frankfurt
 Netflix Preferred CDN:                 Frankfurt
 ChatGPT:                               Failed (Network Connection)
 Google Gemini:                         No
 Claude:                                No
 Wikipedia Editability:                 Yes
 Google Play Store:                     Germany 
 Google Search CAPTCHA Free:            Yes
 Steam Currency:                        IPv6 Is Not Currently Supported
 ---Forum---
 Reddit:                                IPv6 Is Not Currently Supported
 ---Game---
 SD Gundam G Generation Eternal:        Failed (Network Connection)
=======================================
---------------TikTok解锁--感谢lmc999的源脚本及fscarmen PR--------------
 Tiktok Region:         Failed
-------------IP质量检测--基于oneclickvirt/securityCheck使用-------------
数据仅作参考，不代表100%准确，如果和实际情况不一致请手动查询多个数据库比对
以下为各数据库编号，输出结果后将自带数据库来源对应的编号
ipinfo数据库  [0] | scamalytics数据库 [1] | virustotal数据库   [2] | abuseipdb数据库   [3] | ip2location数据库    [4]
ip-api数据库  [5] | ipwhois数据库     [6] | ipregistry数据库   [7] | ipdata数据库      [8] | db-ip数据库          [9]
ipapiis数据库 [A] | ipapicom数据库    [B] | bigdatacloud数据库 [C] | cheervision数据库 [D] | ipqualityscore数据库 [E]
IPV4:
安全得分:
声誉(越高越好): 0 [2] 
信任得分(越高越好): 92 [8] 
VPN得分(越低越好): 4 [8] 
代理得分(越低越好): 18 [8] 
社区投票-无害: 0 [2] 
社区投票-恶意: 0 [2] 
威胁得分(越低越好): 2 [8] 
欺诈得分(越低越好): 3 [1] 0 [E]
滥用得分(越低越好): 0 [3] 
ASN滥用得分(越低越好): 0.0017 (Low) [A] 
公司滥用得分(越低越好): 0 (Very Low) [A] 
威胁级别: low [9] 
黑名单记录统计:(有多少黑名单网站有记录):
无害记录数: 0 [2]  恶意记录数: 0 [2]  可疑记录数: 0 [2]  无记录数: 94 [2]  
安全信息:
使用类型: isp [0 7] FixedLineISP [3] hosting [A] unknown [C] consumer [9]
公司类型: hosting [A] isp [0 7]
是否云提供商: No [7 D] 
是否数据中心: No [0 5 6 8 C] Yes [1 A]
是否移动设备: No [A C] Yes [5 E]
是否代理: No [0 1 4 5 6 7 8 9 A C D E] 
是否VPN: No [0 1 6 7 A C D E] 
是否Tor: No [0 1 3 6 7 8 A C D E] 
是否Tor出口: No [1 7 D] 
是否网络爬虫: No [9 A E] 
是否匿名: No [1 6 7 8 D] 
是否攻击者: No [7 8 D] 
是否滥用者: No [7 8 A C D E] 
是否威胁: No [7 8 C D] 
是否中继: No [0 7 8 C D] 
是否Bogon: No [7 8 A C D] 
是否机器人: No [E] 
DNS-黑名单: 313(Total_Check) 0(Clean) 0(Blacklisted) 0(Other) 
IPV6:
安全得分:
欺诈得分(越低越好): 3 [1] 
滥用得分(越低越好): 0 [3]
ASN滥用得分(越低越好): 0.0017 (Low) [A] 
公司滥用得分(越低越好): 0 (Very Low) [A] 
安全信息:
使用类型: hosting [A] FixedLineISP [3]
公司类型: hosting [A] 
是否云提供商: No [D] 
是否数据中心: Yes [1 A] 
是否移动设备: No [A] 
是否代理: No [1 A D] 
是否VPN: No [1 A D] 
是否Tor: No [1 3 A D] 
是否Tor出口: No [1 D] 
是否网络爬虫: No [A] 
是否匿名: No [1 D] 
是否攻击者: No [D] 
是否滥用者: No [A D] 
是否威胁: No [D] 
是否中继: No [D] 
是否Bogon: No [A D] 
DNS-黑名单: 313(Total_Check) 0(Clean) 0(Blacklisted) 313(Other) 
Google搜索可行性：NO
-------------邮件端口检测--基于oneclickvirt/portchecker开源-------------
Platform  SMTP  SMTPS POP3  POP3S IMAP  IMAPS
LocalPort ✔     ✔     ✔     ✔     ✔     ✔    
QQ        ✘     ✔     ✔     ✘     ✔     ✘    
163       ✘     ✔     ✔     ✘     ✔     ✘    
Sohu      ✘     ✔     ✔     ✘     ✔     ✘    
Yandex    ✘     ✔     ✔     ✘     ✔     ✘    
Gmail     ✘     ✔     ✘     ✘     ✘     ✘    
Outlook   ✘     ✘     ✔     ✘     ✔     ✘    
Office365 ✘     ✘     ✔     ✘     ✔     ✘    
Yahoo     ✘     ✔     ✘     ✘     ✘     ✘    
MailCOM   ✘     ✔     ✔     ✘     ✔     ✘    
MailRU    ✘     ✔     ✘     ✘     ✔     ✘    
AOL       ✘     ✔     ✘     ✘     ✘     ✘    
GMX       ✘     ✘     ✔     ✘     ✔     ✘    
Sina      ✘     ✔     ✔     ✘     ✔     ✘    
Apple     ✘     ✔     ✘     ✘     ✘     ✘    
FastMail  ✘     ✔     ✘     ✘     ✘     ✘    
ProtonMail✘     ✘     ✘     ✘     ✘     ✘    
MXRoute   ✘     ✘     ✔     ✘     ✔     ✘    
Namecrane ✘     ✔     ✔     ✘     ✔     ✘    
XYAMail   ✘     ✘     ✘     ✘     ✘     ✘    
ZohoMail  ✘     ✔     ✘     ✘     ✘     ✘    
Inbox_eu  ✘     ✔     ✔     ✘     ✘     ✘    
Free_fr   ✘     ✔     ✔     ✘     ✔     ✘    
----------------三网回程--基于oneclickvirt/backtrace开源----------------
北京电信v4 219.141.140.10           电信163    [普通线路] 
北京联通v4 202.106.195.68           联通4837   [普通线路] 
北京移动v4 221.179.155.161          移动CMI    [普通线路] 
上海电信v4 202.96.209.133           电信163    [普通线路] 
上海联通v4 210.22.97.1              联通4837   [普通线路] 
上海移动v4 211.136.112.200          移动CMI    [普通线路] 
广州电信v4 58.60.188.222            电信163    [普通线路] 
广州联通v4 210.21.196.6             联通4837   [普通线路] 
广州移动v4 120.196.165.24           移动CMI    [普通线路] 
成都电信v4 61.139.2.69              电信163    [普通线路] 
成都联通v4 119.6.6.6                联通4837   [普通线路] 
成都移动v4 211.137.96.205           移动CMI    [普通线路] 移动CMIN2  [精品线路] 
北京电信v6 2400:89c0:1053:3::69     电信163    [普通线路] 
北京联通v6 2400:89c0:1013:3::54     联通4837   [普通线路] 
北京移动v6 2409:8c00:8421:1303::55  移动CMIN2  [精品线路] 移动CMI    [普通线路] 
上海电信v6 240e:e1:aa00:4000::24    电信163    [普通线路] 
上海联通v6 2408:80f1:21:5003::a     联通4837   [普通线路] 
上海移动v6 2409:8c1e:75b0:3003::26  移动CMIN2  [精品线路] 移动CMI    [普通线路] 
广州电信v6 240e:97c:2f:3000::44     电信163    [普通线路] 
广州联通v6 2408:8756:f50:1001::c    联通4837   [普通线路] 
广州移动v6 2409:8c54:871:1001::12   移动CMI    [普通线路] 
准确线路自行查看详细路由，本测试结果仅作参考
同一目标地址多个线路时，可能检测已越过汇聚层，除了第一个线路外，后续信息可能无效
---------------------回程路由--感谢fscarmen开源及PR---------------------
依次测试电信/联通/移动经过的地区及线路，核心程序来自nexttrace，请知悉!
广州电信 58.60.188.222
0.46 ms         AS63150 德国 图林根州 埃尔福特 bagevm.com
0.79 ms         AS58212 德国 黑森 美因河畔法兰克福 dataforest.net
1.81 ms         AS4134 德国 黑森州 美因河畔法兰克福 www.chinatelecom.com.cn
230.01 ms       AS4134 [CHINANET-BB] 中国 广东 广州 www.chinatelecom.com.cn
235.42 ms       AS4134 [CHINANET-BB] 中国 广东 广州 www.chinatelecom.com.cn 电信
238.49 ms       AS4134 中国 广东 深圳 福田区 www.chinatelecom.com.cn 电信
广州联通 210.21.196.6
0.43 ms         AS63150 德国 图林根州 埃尔福特 bagevm.com
0.65 ms         AS58212 德国 黑森 美因河畔法兰克福 dataforest.net
1.14 ms         AS4837 [CU169-BACKBONE] 德国 黑森州 美因河畔法兰克福 chinaunicom.cn
135.39 ms       AS4837 [CU169-BACKBONE] 中国 北京 X-I chinaunicom.cn 联通
154.08 ms       AS4837 [CU169-BACKBONE] 中国 北京 chinaunicom.cn 联通
156.50 ms       AS4837 [CU169-BACKBONE] 中国 北京 chinaunicom.cn 联通
182.91 ms       AS17816 [APNIC-AP] 中国 广东 深圳 chinaunicom.cn 联通
194.24 ms       AS17623 [APNIC-AP] 中国 广东 深圳 chinaunicom.cn 联通
189.54 ms       AS17623 中国 广东 深圳 宝安区 chinaunicom.cn 联通
广州移动 120.196.165.24
0.44 ms         AS63150 德国 图林根州 埃尔福特 bagevm.com
0.58 ms         AS58212 德国 黑森 美因河畔法兰克福 dataforest.net
51.36 ms        AS6453 德国 黑森 美因河畔法兰克福 tatacommunications.com
2.34 ms         AS6453 [TATA-R] 德国 黑森 美因河畔法兰克福 tatacommunications.com
18.74 ms        AS58453 [CMI-INT] 德国 黑森 美茵河畔法兰克福 cmi.chinamobile.com 移动
216.19 ms       AS9808 [CMNET] 中国 广东 广州 chinamobileltd.com 移动
* ms    AS9808 [CMNET] 中国 广东 广州 I-C chinamobileltd.com 移动
213.70 ms       AS9808 [CMNET] 中国 广东 广州 chinamobileltd.com 移动
215.81 ms       AS56040 [APNIC-AP] 中国 广东 深圳 gd.10086.cn 移动
--------------------自动更新测速节点列表--本脚本原创--------------------
位置             上传速度        下载速度        延迟
Speedtest.net    1271.67Mbps     1715.19Mbps     1.194.003.00ms
法兰克福         1329.86Mbps     1681.26Mbps     1.694.004.00ms
洛杉矶           36.24Mbps       66.25Mbps       151.09140.00139.00ms
联通上海5G       31.53Mbps       59.91Mbps       168.67165.00167.00ms
电信Zhenjiang5G  1.66Mbps        36.56Mbps       236.06520.00319.00ms
电信Suzhou5G     23.81Mbps       63.92Mbps       226.78356.00244.00ms
移动Chengdu      12.49Mbps       41.88Mbps       225.50248.00229.00ms
移动杭州5G       27.15Mbps       41.52Mbps       242.95193.00248.00ms
------------------------------------------------------------------------
 总共花费      : 6 分 12 秒
 时间          : Sun Apr 27 15:01:32 CST 2025
------------------------------------------------------------------------
  短链:
    https://paste.spiritlhl.net/#/show/BF4RE.txt
    http://hpaste.spiritlhl.net/#/show/BF4RE.txt

Emby 302 直链播放

Fri, 18 Apr 2025 00:00:00 GMT

前言

之前分享过Emby 开心版安装和使用，那里使用的是使用 rclone 将网盘挂载本地，然后通过 Emby 添加媒体库播放。这种不单配置较为麻烦，而且还会在播放时占用服务器带宽。

相较于上篇，这里的配置更为简单，且对低配置服务器更为友好。

准备

一台服务器
一个域名（可选）
网盘

大致流程

使用 Alist 挂载网盘，然后通过 AutoFilm 项目将 Alist 中的内容遍历生成 Strm 文件，在通过 Emby 添加本地媒体库，最后再通过 Nginx 转发实现 302 播放。

安装

使用 docker-compose 安装，docker-compose.yml 文件如下：

services:
  embyserver:
    image: amilys/embyserver
    platform: linux/amd64   # 强制使用 amd64 架构（我这里使用的是 arm64 版本，如果使用 amd64 版本，请删除此行）
    container_name: emby-happy
    privileged: true
    network_mode: bridge
    volumes:
      - ./config:/config
      - ./Movies:/movies:rslave
    ports:
      - 8096:8096
    restart: unless-stopped

  alist:
    image: xhofe/alist:latest
    container_name: alist
    volumes:
        - ./alist:/opt/alist/data
    network_mode: bridge
    ports:
        - 5244:5244
    environment:
        - PUID=0
        - PGID=0
        - UMASK=022
    restart: unless-stopped

  nginx:
    image: nginx:latest
    container_name: nginx
    network_mode: host
    volumes:
      - ./nginx/conf.d:/etc/nginx/conf.d
      - ./nginx/nginx.conf:/etc/nginx/nginx.conf
      - ./nginx/embyCache:/var/cache/nginx/emby
      - ./nginx/logs:/var/log/nginx
    restart: unless-stopped

这时可以在浏览器中访问 http://localhost:8096 即可访问 Emby。

Alist 挂载

访问 http://127.0.0.1:5244,默认账号为 admin，密码需要通过 docker logs alist 查看。

也可以通过 docker exec -it alist /bin/bash 进入容器手动设置 ./alist admin set password。

挂载参考官方教程

如果你使用的是阿里云盘可以参考获取阿里云盘 TV 版的 token实现不限速挂载。

需要记录内容:

Alist 地址 http://192.168.2.3:5244
Alist Token 进入管理后台，设置 -> 其他 -> 令牌
Alist 账号密码

AutoFilm 生成 Strm 文件

::github{repo="Akimio521/AutoFilm"}

AutoFilm 也可以通过 docker 部署，我这里需要修改配置文件，所以选择通过源码运行。

git clone https://github.com/Akimio521/AutoFilm.git
cd AutoFilm

参考 /config/config.example.yaml 文件，配置 config/config.yaml 文件。

:::important 我这里在使用 AutoFilm 时运行会报错，经过修改后可以正常运行。 :::

Emby 配置

将 AutoFilm 生成的 Strm 文件放入映射目录 Movies 中。然后进入 http://127.0.0.1:8096 ，点击 媒体库 -> 新增媒体库 -> 文件夹选择 movies 。

Nginx 配置

接下来下载此压缩包，解压后得到一个nginx文件夹，其中有conf.d文件夹及nginx.conf文件，此为nginx相关配置文件。配置文件来源nanako。

需要修改的文件有：

conf.d/constant.js
conf.d/emby.conf (可选，修改 Emby反代端口)

具体配置注释都有详细说明，这里不再赘述。配置完成后重启 Nginx 服务。

使用

如果你未更改 conf.d/emby.conf 文件，则直接访问 http://127.0.0.1:8091 即可访问 Emby。

Strm 暂时无法使用网页端播放，需要使用客户端播放。

测试

浏览测试

可以看到浏览时流量走的 emby.mihouo.com 域名。

播放测试

播放时的流量走的是 aliyundrive.cloud 域名。

总结

使用 Emby 302 直链播放可以避免服务器带宽被占用(只有浏览emby 时加载的一些影片信息会产生流量，播放时走的 302 直链)，也能大幅提升播放速度。

DMIT EB WEE 美国机器留档测试

Fri, 11 Apr 2025 00:00:00 GMT

机器详情

CPU 1 vCPU
内存 1 GiB
存储 20 GiB
带宽 1000 Mbps
流量 1024 GB

IP Check

bash <(curl -Ls IP.Check.Place)

详情

########################################################################
                    IP质量体检报告(Lite)：154.17.*.*
                    bash <(curl -sL IP.Check.Place)
                   https://github.com/xykt/IPQuality
        报告时间：2025-04-11 10:50:13 CST  脚本版本：v2025-03-25
########################################################################
一、基础信息（IPinfo 数据库）
自治系统号：            ASAS906
组织：                  DMIT Cloud Services
坐标：                  118°15′60″W, 34°3′21″N
地图：                  https://check.place/34.0559,-118.2666,12,cn
城市：                  Los Angeles, 90017
使用地：                [US]United States of America, Americas
注册地：                [US]United States of America
IP类型：                 原生IP 
二、IP类型属性
数据库：      IPinfo      ipapi    IP2LOCATION 
使用类型：     机房        机房        机房    
公司类型：     商业        机房    
三、风险评分
风险等级：      极低         低       中等       高         极高
SCAMALYTICS：             19|低风险
ipapi：        0.22%|低风险
Cloudflare：   0|低风险
四、风险因子
库： IP2LOCATION ipapi SCAMALYTICS IPinfo IPWHOIS
地区：    [US]    [US]    [US]    [US]    [US]
代理：     否      否      否      否      否 
Tor：      否      否      否      否      否 
VPN：      否      否      否      否      否 
服务器：   是      否      否      否      否 
滥用：     否      否      无      无      无 
机器人：   否      否      否      无      无 
五、流媒体及AI服务解锁检测
服务商：  TikTok   Disney+  Netflix Youtube  AmazonPV  Spotify  ChatGPT 
状态：     解锁     屏蔽     解锁     解锁     解锁     屏蔽     解锁   
地区：     [US]              [US]     [US]     [US]              [US]   
方式：     原生              原生     原生     原生              原生   
六、邮局连通性及黑名单检测
本地25端口：阻断
IP地址黑名单数据库：  有效 439   正常 391   已标记 48   黑名单 0
========================================================================
今日IP检测量：171；总检测量：175277。感谢使用xy系列脚本！ 

########################################################################
              IP质量体检报告(Lite)：2605:52c0:1:*:*:*:*:*
                    bash <(curl -sL IP.Check.Place)
                   https://github.com/xykt/IPQuality
        报告时间：2025-04-11 10:50:13 CST  脚本版本：v2025-03-25
########################################################################
一、基础信息（IPinfo 数据库）
自治系统号：            ASAS906
组织：                  DMIT Cloud Services
坐标：                  118°15′60″W, 34°3′21″N
地图：                  https://check.place/34.0559,-118.2666,12,cn
城市：                  Los Angeles, 90017
使用地：                [US]United States of America, Americas
注册地：                [US]United States of America
IP类型：                 原生IP 
二、IP类型属性
数据库：      IPinfo      ipapi    IP2LOCATION 
使用类型：     机房        机房        机房    
公司类型：     机房        机房    
三、风险评分
风险等级：      极低         低       中等       高         极高
SCAMALYTICS：             19|低风险
ipapi：    0.00%|极低风险
Cloudflare：   0|低风险
四、风险因子
库： IP2LOCATION ipapi SCAMALYTICS IPinfo IPWHOIS
地区：    [US]    [US]    [US]    [US]    [US]
代理：     否      否      否      否      否 
Tor：      否      否      否      否      否 
VPN：      否      否      否      否      否 
服务器：   是      是      否      是      否 
滥用：     否      否      无      无      无 
机器人：   否      否      否      无      无 
五、流媒体及AI服务解锁检测
服务商：  TikTok   Disney+  Netflix Youtube  AmazonPV  Spotify  ChatGPT 
状态：     失败     屏蔽     解锁     解锁     屏蔽     屏蔽     失败   
地区：                       [US]     [US]                              
方式：                       原生     原生                              
六、邮局连通性及黑名单检测
本地25端口：阻断
========================================================================
今日IP检测量：175；总检测量：175281。感谢使用xy系列脚本！

融合怪

一键脚本

::github{repo="spiritLHLS/ecs"}

curl -L https://gitlab.com/spiritysdx/za/-/raw/main/ecs.sh -o ecs.sh && chmod +x ecs.sh && bash ecs.sh

详情

--------------------- A Bench Script By spiritlhl ----------------------
                   测评频道: https://t.me/vps_reviews                    
VPS融合怪版本：2025.03.29
Shell项目地址：https://github.com/spiritLHLS/ecs
Go项目地址：https://github.com/oneclickvirt/ecs
---------------------基础信息查询--感谢所有开源项目---------------------
 CPU 型号          : AMD EPYC 9654 96-Core Processor
 CPU 核心数        : 1
 CPU 频率          : 2396.398 MHz
 CPU 缓存          : L1: 64.00 KB / L2: 512.00 KB / L3: 16.00 MB
 AES-NI指令集      : ✔ Enabled
 VM-x/AMD-V支持    : ❌ Disabled
 内存              : 214.25 MiB / 958.71 MiB
 Swap              : 0 KiB / 1024.00 MiB
 硬盘空间          : 3.49 GiB / 19.60 GiB
 启动盘路径        : /dev/vda1
 系统在线时间      : 0 days, 15 hour 43 min
 负载              : 0.94, 0.32, 0.12
 系统              : Debian GNU/Linux 12 (bookworm) (x86_64)
 架构              : x86_64 (64 Bit)
 内核              : 6.1.0-21-amd64
 TCP加速方式       : bbr
 虚拟化架构        : KVM
 NAT类型           : Full Cone
 IPV4 ASN          : AS906 DMIT Cloud Services
 IPV4 位置         : Los Angeles / California / US
 IPV6 ASN          : AS906 DMIT
 IPV6 位置         : Los Angeles / California / United States
 IPV6 子网掩码     : 64
----------------------CPU测试--通过sysbench测试-------------------------
 -> CPU 测试中 (Fast Mode, 1-Pass @ 5sec)
 1 线程测试(单核)得分:          4455 Scores
---------------------内存测试--感谢lemonbench开源-----------------------
 -> 内存测试 Test (Fast Mode, 1-Pass @ 5sec)
 单线程读测试:          50454.01 MB/s
 单线程写测试:          29464.37 MB/s
------------------磁盘dd读写测试--感谢lemonbench开源--------------------
 -> 磁盘IO测试中 (4K Block/1M Block, Direct Mode)
 测试操作               写速度                                  读速度
 100MB-4K Block         87.0 MB/s (21.24 IOPS, 1.21s))          24.5 MB/s (5987 IOPS, 4.28s)
 1GB-1M Block           1.2 GB/s (1111 IOPS, 0.90s)             1.2 GB/s (1111 IOPS, 0.90s)
---------------------磁盘fio读写测试--感谢yabs开源----------------------
Block Size | 4k            (IOPS) | 64k           (IOPS)
  ------   | ---            ----  | ----           ---- 
Read       | 62.54 MB/s   (15.6k) | 1.06 GB/s    (16.6k)
Write      | 62.65 MB/s   (15.6k) | 1.07 GB/s    (16.7k)
Total      | 125.20 MB/s  (31.2k) | 2.13 GB/s    (33.4k)
           |                      |                     
Block Size | 512k          (IOPS) | 1m            (IOPS)
  ------   | ---            ----  | ----           ---- 
Read       | 1.02 GB/s     (2.0k) | 1.01 GB/s      (987)
Write      | 1.07 GB/s     (2.1k) | 1.07 GB/s     (1.0k)
Total      | 2.10 GB/s     (4.1k) | 2.08 GB/s     (2.0k)
------------流媒体解锁--基于oneclickvirt/CommonMediaTests开源-----------
以下测试的解锁地区是准确的，但是不是完整解锁的判断可能有误，这方面仅作参考使用
----------------Netflix-----------------
[IPV4]
您的出口IP完整解锁Netflix，支持非自制剧的观看
NF所识别的IP地域信息：美国
[IPV6]
您的出口IP完整解锁Netflix，支持非自制剧的观看
NF所识别的IP地域信息：美国
----------------Youtube-----------------
[IPV4]
连接方式: Youtube Video Server
视频缓存节点地域: 美国  洛杉机(LAX31S13)
[IPV6]
连接方式: Youtube Video Server
视频缓存节点地域: 美国  洛杉机(LAX17S56)
---------------DisneyPlus---------------
[IPV4]
当前IPv4出口所在地区即将开通DisneyPlus
[IPV6]
当前IPv4出口所在地区即将开通DisneyPlus
解锁Netflix，Youtube，DisneyPlus上面和下面进行比较，不同之处自行判断
----------------流媒体解锁--感谢RegionRestrictionCheck开源--------------
 以下为IPV4网络测试，若无IPV4网络则无输出
============[ Multination ]============
 Dazn:                                  Yes (Region: US)
 Disney+:                               No (IP Banned By Disney+ 1)
 Netflix:                               Yes (Region: US)
 YouTube Premium:                       Yes (Region: US)
 Amazon Prime Video:                    Yes (Region: US)
 TVBAnywhere+:                          Yes
 Spotify Registration:                  No
 OneTrust Region:                       US [California]
 iQyi Oversea Region:                   US
 Bing Region:                           US (Risky)
 Apple Region:                          US
 YouTube CDN:                           Los Angeles, CA
 Netflix Preferred CDN:                 Los Angeles, CA
 ChatGPT:                               Yes
 Google Gemini:                         Yes (Region: USA)
 Claude:                                No
 Wikipedia Editability:                 No
 Google Play Store:                     United States 
 Google Search CAPTCHA Free:            Yes
 Steam Currency:                        USD
 ---Forum---
 Reddit:                                No
=======================================
 以下为IPV6网络测试，若无IPV6网络则无输出
============[ Multination ]============
 Dazn:                                  IPv6 Is Not Currently Supported
 Disney+:                               IPv6 Is Not Currently Supported
 Netflix:                               Yes (Region: US)
 YouTube Premium:                       Yes (Region: US)
 Amazon Prime Video:                    IPv6 Is Not Currently Supported
 TVBAnywhere+:                          IPv6 Is Not Currently Supported
 Spotify Registration:                  No
 OneTrust Region:                       US [California]
 iQyi Oversea Region:                   IPv6 Is Not Currently Supported
 Bing Region:                           US (Risky)
 Apple Region:                          US
 YouTube CDN:                           Los Angeles, CA
 Netflix Preferred CDN:                 Dallas, TX
 ChatGPT:                               Failed (Network Connection)
 Google Gemini:                         Yes (Region: USA)
 Claude:                                No
 Wikipedia Editability:                 No
 Google Play Store:                     United States 
 Google Search CAPTCHA Free:            Yes
 Steam Currency:                        IPv6 Is Not Currently Supported
 ---Forum---
 Reddit:                                IPv6 Is Not Currently Supported
=======================================
---------------TikTok解锁--感谢lmc999的源脚本及fscarmen PR--------------
 Tiktok Region:         【US】
-------------IP质量检测--基于oneclickvirt/securityCheck使用-------------
数据仅作参考，不代表100%准确，如果和实际情况不一致请手动查询多个数据库比对
以下为各数据库编号，输出结果后将自带数据库来源对应的编号
ipinfo数据库  [0] | scamalytics数据库 [1] | virustotal数据库   [2] | abuseipdb数据库   [3] | ip2location数据库    [4]
ip-api数据库  [5] | ipwhois数据库     [6] | ipregistry数据库   [7] | ipdata数据库      [8] | db-ip数据库          [9]
ipapiis数据库 [A] | ipapicom数据库    [B] | bigdatacloud数据库 [C] | cheervision数据库 [D] | ipqualityscore数据库 [E]
IPV4:
安全得分:
声誉(越高越好): 0 [2] 
信任得分(越高越好): 0 [8] 
VPN得分(越低越好): 99 [8] 
代理得分(越低越好): 100 [8] 
社区投票-无害: 0 [2] 
社区投票-恶意: 0 [2] 
威胁得分(越低越好): 100 [8] 
欺诈得分(越低越好): 65 [E] 19 [1]
滥用得分(越低越好): 0 [3] 
ASN滥用得分(越低越好): 0.0014 (Low) [A]
公司滥用得分(越低越好): 0.0022 (Low) [A] 
黑名单记录统计:(有多少黑名单网站有记录):
无害记录数: 0 [2]  恶意记录数: 0 [2]  可疑记录数: 0 [2]  无记录数: 94 [2]  
安全信息:
使用类型: hosting [0 7 A] business [8] hosting - high probability [C] DataCenter/WebHosting/Transit [3]
公司类型: business [0 A] isp [7]
是否云提供商: Yes [7 D] 
是否数据中心: No [0 5 6 8 A] Yes [1 C]
是否移动设备: No [5 A C] Yes [E]
是否代理: Yes [E] No [0 1 4 5 6 7 8 A C D]
是否VPN: Yes [E] No [0 1 6 7 A C D]
是否Tor: No [0 1 3 6 7 8 A C D E] 
是否Tor出口: No [1 7 D] 
是否网络爬虫: No [A E] 
是否匿名: No [1 6 7 8 D] 
是否攻击者: No [7 8 D] 
是否滥用者: No [7 8 A C D E] 
是否威胁: No [7 8 C D] 
是否中继: No [0 7 8 C D] 
是否Bogon: No [7 8 A C D] 
是否机器人: No [E] 
DNS-黑名单: 313(Total_Check) 0(Clean) 6(Blacklisted) 22(Other) 
IPV6:
安全得分:
欺诈得分(越低越好): 19 [1]
滥用得分(越低越好): 0 [3] 
ASN滥用得分(越低越好): 0.0014 (Low) [A] 
公司滥用得分(越低越好): 0 (Very Low) [A] 
安全信息:
使用类型: hosting [A] DataCenter/WebHosting/Transit [3]
公司类型: hosting [A] 
是否云提供商: Yes [D] 
是否数据中心: Yes [1 A]
是否移动设备: No [A] 
是否代理: No [1 A D] 
是否VPN: No [1 A D] 
是否TorExit: No [1 D] 
是否Tor出口: No [1 D] 
是否网络爬虫: No [A] 
是否匿名: No [1 D] 
是否攻击者: No [D] 
是否滥用者: No [A D] 
是否威胁: No [D] 
是否中继: No [D] 
是否Bogon: No [A D] 
DNS-黑名单: 313(Total_Check) 0(Clean) 0(Blacklisted) 313(Other) 
Google搜索可行性：NO
-------------邮件端口检测--基于oneclickvirt/portchecker开源-------------
Platform  SMTP  SMTPS POP3  POP3S IMAP  IMAPS
LocalPort ✔     ✔     ✔     ✔     ✔     ✔    
QQ        ✔     ✔     ✔     ✘     ✔     ✘    
163       ✘     ✔     ✔     ✘     ✔     ✘    
Sohu      ✘     ✔     ✔     ✘     ✔     ✘    
Yandex    ✔     ✔     ✔     ✘     ✔     ✘    
Gmail     ✔     ✔     ✘     ✘     ✘     ✘    
Outlook   ✔     ✘     ✔     ✘     ✔     ✘    
Office365 ✔     ✘     ✔     ✘     ✔     ✘    
Yahoo     ✘     ✔     ✘     ✘     ✘     ✘    
MailCOM   ✘     ✔     ✔     ✘     ✔     ✘    
MailRU    ✔     ✔     ✘     ✘     ✔     ✘    
AOL       ✘     ✔     ✘     ✘     ✘     ✘    
GMX       ✘     ✘     ✔     ✘     ✔     ✘    
Sina      ✘     ✔     ✔     ✘     ✔     ✘    
Apple     ✘     ✘     ✘     ✘     ✘     ✘    
FastMail  ✘     ✔     ✘     ✘     ✘     ✘    
ProtonMail✘     ✘     ✘     ✘     ✘     ✘    
MXRoute   ✘     ✘     ✔     ✘     ✔     ✘    
Namecrane ✘     ✔     ✔     ✘     ✔     ✘    
XYAMail   ✘     ✘     ✘     ✘     ✘     ✘    
ZohoMail  ✘     ✔     ✘     ✘     ✘     ✘    
Inbox_eu  ✘     ✔     ✔     ✘     ✘     ✘    
Free_fr   ✘     ✔     ✔     ✘     ✔     ✘    
----------------三网回程--基于oneclickvirt/backtrace开源----------------
北京电信v4 219.141.140.10           移动CMIN2  [精品线路] 
北京联通v4 202.106.195.68           联通9929   [优质线路] 联通4837   [普通线路] 
北京移动v4 221.179.155.161          移动CMIN2  [精品线路] 
上海电信v4 202.96.209.133           移动CMIN2  [精品线路] 
上海联通v4 210.22.97.1              联通9929   [优质线路] 联通4837   [普通线路] 
上海移动v4 211.136.112.200          移动CMIN2  [精品线路] 
广州电信v4 58.60.188.222            移动CMIN2  [精品线路] 
广州联通v4 210.21.196.6             联通9929   [优质线路] 联通4837   [普通线路] 
广州移动v4 120.196.165.24           移动CMIN2  [精品线路] 
成都电信v4 61.139.2.69              移动CMIN2  [精品线路] 电信163    [普通线路] 
成都联通v4 119.6.6.6                联通9929   [优质线路] 联通4837   [普通线路] 
成都移动v4 211.137.96.205           移动CMIN2  [精品线路] 
准确线路自行查看详细路由，本测试结果仅作参考
同一目标地址多个线路时，可能检测已越过汇聚层，除了第一个线路外，后续信息可能无效
---------------------回程路由--感谢fscarmen开源及PR---------------------
依次测试电信/联通/移动经过的地区及线路，核心程序来自nexttrace，请知悉!
广州电信 58.60.188.222
0.19 ms         AS906 [DMIT-BB] Anycast Anycast DMIT.com
0.57 ms         AS906 [DMIT-BB] 美国 加利福尼亚 洛杉矶 DMIT.com
0.65 ms         AS906 [DMIT-BB] 美国 加利福尼亚 洛杉矶 DMIT.com
126.64 ms       AS58807 [CMIN2-NET] 美国 加利福尼亚 洛杉矶 cmi.chinamobile.com 移动
126.04 ms       AS58807 [CMIN2-NET] 中国 上海 cmi.chinamobile.com 移动
126.19 ms       AS9808 [CMNET] 中国 上海 chinamobileltd.com 移动
126.31 ms       AS9808 [CMNET] 中国 上海 chinamobileltd.com 移动
127.76 ms       AS9808 [CMNET] 中国 上海 chinamobileltd.com 移动
154.36 ms       AS9808 [CMNET] 中国 广东 广州 chinamobileltd.com 移动
157.80 ms       AS9808 [CMNET] 中国 广东 广州 chinamobileltd.com 移动
207.12 ms       AS4134 [CHINANET-BB] 中国 广东 广州 www.chinatelecom.com.cn 电信
159.14 ms       AS134774 [CHINANET-GD] 中国 广东 深圳 chinatelecom.cn 电信
158.41 ms       AS4134 中国 广东 深圳 福田区 www.chinatelecom.com.cn 电信
广州联通 210.21.196.6
0.28 ms         AS906 [DMIT-BB] Anycast Anycast DMIT.com
0.59 ms         AS906 [DMIT-BB] 美国 加利福尼亚 洛杉矶 DMIT.com
0.79 ms         * [CUG-ASIA] 美国 加利福尼亚 洛杉矶 中国联通（香港）
131.95 ms       AS10099 [CUG-BACKBONE] 中国 上海 chinaunicomglobal.com 联通
132.73 ms       AS9929 [CNC-BACKBONE] 中国 上海 chinaunicom.cn 联通 CUII
154.84 ms       AS9929 [CNC-BACKBONE] 中国 广东 广州 chinaunicom.cn 联通 CUII
156.85 ms       * [CNC-BACKBONE] 中国 广东 广州
159.59 ms       AS4837 [CU169-BACKBONE] 中国 广东 广州 chinaunicom.cn 联通
159.67 ms       AS17816 [UNICOM-GD] 中国 广东 深圳 chinaunicom.cn 联通
162.08 ms       AS17623 [APNIC-AP] 中国 广东 深圳 chinaunicom.cn 联通
159.13 ms       AS17623 中国 广东 深圳 宝安区 chinaunicom.cn 联通
广州移动 120.196.165.24
0.20 ms         AS906 [DMIT-BB] Anycast Anycast DMIT.com
0.52 ms         AS906 [DMIT-BB] 美国 加利福尼亚 洛杉矶 DMIT.com
0.72 ms         AS906 [DMIT-BB] 美国 加利福尼亚 洛杉矶 DMIT.com
127.19 ms       AS58807 [CMIN2-NET] 美国 加利福尼亚 洛杉矶 cmi.chinamobile.com 移动
126.29 ms       AS58807 [CMIN2-NET] 中国 上海 cmi.chinamobile.com 移动
127.58 ms       AS9808 [CMNET] 中国 上海 chinamobileltd.com 移动
139.62 ms       AS9808 [CMNET] 中国 上海 chinamobileltd.com 移动
127.25 ms       AS9808 [CMNET] 中国 上海 chinamobileltd.com
153.16 ms       AS9808 [CMNET] 中国 北京 chinamobileltd.com 移动
152.66 ms       AS9808 [CMNET] 中国 北京 chinamobileltd.com 移动
254.89 ms       AS9808 [CMNET] 中国 北京 chinamobileltd.com 移动
154.79 ms       AS56040 [APNIC-AP] 中国 广东 深圳 gd.10086.cn 移动
--------------------自动更新测速节点列表--本脚本原创--------------------
位置             上传速度        下载速度        延迟     丢包率
Speedtest.net    1045.13 Mbps    998.75 Mbps     0.48     0.0%
洛杉矶           1039.58 Mbps    987.83 Mbps     0.76     0.0%
日本东京         825.27 Mbps     641.68 Mbps     102.90   2.3%
联通上海5G       928.55 Mbps     441.58 Mbps     130.17   0.0%
电信浙江         656.77 Mbps     689.40 Mbps     140.71   NULL
电信浙江         646.85 Mbps     932.02 Mbps     138.04   NULL
移动Chengdu      740.06 Mbps     373.02 Mbps     160.52   NULL
------------------------------------------------------------------------
 总共花费      : 5 分 46 秒
 时间          : Fri Apr 11 10:57:30 CST 2025
------------------------------------------------------------------------
  短链:
    https://paste.spiritlhl.net/#/show/DRkoI.txt
    http://hpaste.spiritlhl.net/#/show/DRkoI.txt

LLM 结构化输出

Tue, 08 Apr 2025 00:00:00 GMT

什么是结构化输出？

通常情况下，LLM 的输出是自然语言，但是有时候我们需要 LLM 输出特定的结构化数据，比如 JSON、XML 等。

让大语言模型（LLM）输出格式清晰、结构明确的数据，而不是一大段自然语言描述。

如何使用结构化输出？

1. Prompt 中指定输出格式

import OpenAI from 'openai';

const openai = new OpenAI({
  apiKey: process.env.OPENAI_API_KEY,
});

const completion = await openai.chat.completions.create({
  model: 'gpt-4o-mini',
  messages: [
    {
      role: 'system',
      content: '你是一个专业的历史学家，你应该能够以简洁和准确的方式总结一个人的生活。',
    },
    {
      role: 'user',
      content: `请总结10个${name}生活中的重要事件。
      以 JSON 格式输出，字段包括：
      {
      "name": "string", // name
      "gender": "string", // gender
      "type": "string", // type
      "profile": "string", // profile 100 words
      "timeline": [
        {
          "year": "string", // year
          "title": "string", // title
          "description": "string", // description 50 words
        }
      ]
    }
    `,
    },
  ],
});


// 期望输出
```json
{
  "name": "string", // name
  "gender": "string", // gender
  "type": "string", // type
  "profile": "string", // profile 100 words
  "timeline": [
    {
      "year": "string", // year
      "title": "string", // title
      "description": "string", // description 50 words
    }
  ]
}

2. 使用 zod 定义结构，配合 OpenAI 的 `zodResponseFormat` 函数

import OpenAI from 'openai';
import { zodResponseFormat } from 'openai/helpers/zod';
import { z } from 'zod';

const openai = new OpenAI({
  apiKey: process.env.OPENAI_API_KEY,
});

const BiographySchema = z.object({
  name: z.string(),
  gender: z.string(),
  type: z.string(),
  profile: z.string(),
  timeline: z.array(z.object({ year: z.string(), title: z.string(), description: z.string() })),
});


const completion = await openai.chat.completions.create({
  model: 'gpt-4o-mini',
  messages: [
    {
      role: 'system',
      content: '你是一个专业的历史学家，你应该能够以简洁和准确的方式总结一个人的生活。',
    },
    {
      role: 'user',
      content: `请总结10个${name}生活中的重要事件。`,
    },
  ],
  response_format: zodResponseFormat(BiographySchema, 'biography'),
});

// 期望输出
{
  "name": "string", // name
  "gender": "string", // gender
  "type": "string", // type
  "profile": "string", // profile 100 words
  "timeline": [
    {
      "year": "string", // year
      "title": "string", // title
      "description": "string", // description 50 words
    }
  ]
}

其他

部分兼容 openai sdk 的服务不支持 `zodResponseFormat` 函数

deepseek-chat 模型不支持 zodResponseFormat 函数

解决方法：response_format: model.includes('deepseek-chat') ? { type: 'json_object' } : zodResponseFormat(BiographySchema, 'biography'),
deepseek-reasoner 模型不支持 json_object

解决方法：response_format: model.includes('deepseek-reasoner') ? { type: 'text' } : zodResponseFormat(BiographySchema, 'biography'),

最终处理

const response_format = model.includes('deepseek') ? 
  { type: model.includes('chat') ? 'json_object' : 'text', }
  : zodResponseFormat(BiographySchema, 'biography'),

总结

方法	优点	缺点
Prompt 中指定输出格式	简单易用，自然语言输入	1. 如果输出格式复杂，可能需要多次调整 <br/>2. 不同的模型可能对于输出格式的理解不同导致输出格式错误 <br/>3. 输出的文本一般被 ```jsonn ``` 包裹，需要自行匹配真正的 JSON 文本[^1]
`zod` + `zodResponseFormat`	结构清晰，易于维护，支持复杂类型，高可控	需要额外引入 `zod`

[^1]: 匹配方法 text.match(/```json\s*([\s\S]*?)\s*```/)?.[1] || ''

SSE 在大语言模型中的流式数据处理简单封装

Tue, 01 Apr 2025 00:00:00 GMT

效果展示

<video controls> <source src="/videos/preview-sse-2025-04-01.mp4" type="video/mp4"> Your browser does not support the video tag. </video>

背景

最近我在使用大语言模型做一些简单、好玩的工具应用，比如算命、生成名人大事记等，然而大语言模型返回的数据量比较大，如果一次性返回，那么用户体验会比较差，所以需要使用 SSE 来实现流式数据传输，提升用户体验。

SSE 是什么？

SSE（Server-Sent Events）是一种单向服务器推送技术，即：

服务器 → 客户端

• 长连接（保持 HTTP 连接） • 逐步推送数据，适用于流式响应（如大模型返回 Token）

与 WebSocket 的区别

特性	SSE	WebSocket
连接方向	单向(服务器到客户端)	双向
适用场景	流式数据	实时聊天、多人协作
兼容性	所有现代浏览器	需要服务器和客户端都支持
连接数	受浏览器限制	无限制

LLM 中的 SSE 工作流程

应用场景：ChatGPT、DeepSeek Chat、Gemini 等对话模型返回数据逐步传输，而不是一次性返回整个 JSON。

步骤

客户端发起请求 • 使用 EventSource（浏览器）或 fetch + ReadableStream（Node.js）创建 SSE 连接
服务器逐步返回数据 • 服务器端不断向 SSE 连接推送 Token
客户端逐步解析数据 • 浏览器或前端代码监听 SSE 事件，逐步渲染消息

SSE 代码示例

服务端 Node.js 代码示例

import OpenAI from 'openai';

const openai = new OpenAI({
  baseURL: 'https://api.deepseek.com',
  apiKey: process.env.DEEPSEEK_KEY,
});

const stream = await openai.chat.completions.create({
  model: "deepseek-chat",
  messages: [{ role: "user", content: "Hello, world!" }],
  stream: true,
});

客户端代码示例 JavaScript

const stream = await fetch('http://localhost:3000/sse', {
  method: 'GET',
}).then(res => res.body);

const reader = stream?.getReader();
const decoder = new TextDecoder();
while (true) {
  const { done, value } = await reader!.read();
  if (done) break;
  const text = decoder.decode(value);
  console.log(text);
}

简单封装

基于大模型返回的 SSE 数据，进行简单封装，实现流式数据传输以及页面渲染，包含思考模型处理。

服务端

函数定义

// @/utils/server.ts

/**
 * 获取大模型响应流
 * @param completion 大模型响应流 await service.chat.completions.create 返回的流式数据 create({ stream: true })
 * @param model 模型名称
 * @param type 类型
 * @returns 流式数据
 */
export const getStreamData = (completion: Stream<ChatCompletionChunk>) => {
  let count = 0;
  let thinkingCount = 0;
  const stream = new ReadableStream({
    async start(controller) {
      try {
        console.log('Starting stream processing...');
        for await (const chunk of completion) {
          const { choices } = chunk;
          const delta = choices[0]?.delta as Delta ?? {};
          
          if (!delta) continue;

          const { reasoning_content = null, content = null } = delta;
          // 添加 thinking 标签
          if (count === 0 && reasoning_content) {
            controller.enqueue(new TextEncoder().encode('<thinking>'));
            // 等待 100ms 后避免批处理
            await new Promise(resolve => setTimeout(resolve, 100));
          }
          if (reasoning_content) {
            count++;
            thinkingCount++;
            controller.enqueue(new TextEncoder().encode(reasoning_content));
          }
          if (count - thinkingCount === 0 && thinkingCount !== 0 && content) {
            controller.enqueue(new TextEncoder().encode('</thinking>'));
            // 等待 100ms 后避免批处理
            await new Promise(resolve => setTimeout(resolve, 100));
          }
          if (content) {
            count++;
            controller.enqueue(new TextEncoder().encode(content));
          }
        }
      } catch (error) {
        console.error('Stream processing error:', error);
        controller.error(error);
      } finally {
        if (count === 0) {
          controller.enqueue(new TextEncoder().encode('[服务器繁忙，请稍后再试。]'));
        } else {
          controller.enqueue(new TextEncoder().encode('[DONE]'));
        }
        controller.close();
      }
    },
  });
  return stream;
};

使用

import OpenAI from 'openai';
import { getStreamData } from '@/utils/server';

const openai = new OpenAI({
  baseURL: 'https://api.deepseek.com',
  apiKey: process.env.DEEPSEEK_KEY,
});

const completion = await openai.chat.completions.create({
  model: "deepseek-chat",
  messages: [{ role: "user", content: "Hello, world!" }],
  stream: true,
});
const stream = await getStreamData(completion);

// 返回流式数据
return new Response(stream, {
  headers: {
    'Content-Type': 'text/event-stream',
  },
});

客户端

函数定义

// @/utils/client.ts

/**
 * 解析流式数据
 * @param stream 流式数据 ReadableStream
 * @param options 选项
 * @param options.output 输出类型 默认 text 如果 output 为 json 则onResult 的 result 返回解析后的 json 对象
 * @param options.onStart 流式数据开始
 * @param options.onEnd 流式数据结束 形参 thinking 为思考内容，result 为结果
 * @param options.onchange 实时更新最新内容 形参 thinking 为思考内容，result 为结果
 * @param options.onThinkingStart 如果是思考模型，则 onThinkingStart 会触发
 * @param options.onThinkingEnd 如果是思考模型，则 onThinkingEnd 会触发
 */
export const parseReadableStream = async (stream: ReadableStream<Uint8Array<ArrayBufferLike>>, options: {
  output?: 'text' | 'json';
  onStart?: () => void;
  onEnd?: (thinking: string, result: string | Record<string, unknown>) => void;
  onchange?: (thinking: string, result: string) => void;
  onThinkingStart?: () => void;
  onThinkingEnd?: () => void;
}) => {
  const { output = 'text', onStart = () => {}, onEnd = () => {}, onThinkingStart = () => {}, onThinkingEnd = () => {}, onchange = () => {} } = options;
  const reader = stream?.getReader();
  const decoder = new TextDecoder();
  let isReasoning = false;
  let thinking = '';
  let content = '';
  onStart();
  while (true) {
    const { done, value } = await reader!.read();
    if (done) break;
    const text = decoder.decode(value);
    if (text.includes('<thinking>')) {
      isReasoning = true;
      onThinkingStart();
      continue;
    }
    if (text.includes('</thinking>')) {
      isReasoning = false;
      onThinkingEnd();
      continue;
    }
    if (text.includes('[DONE]')) {
      let result = content;
      if (output === 'json') {
        // 取出 ```json 和 ``` 之间的内容
        const jsonContent = result.match(/```json\s*([\s\S]*?)\s*```/)?.[1] || '';
        try {
          result = JSON.parse(jsonContent);
        } catch (error) {
          console.error(error);
        }
      }
      onEnd(thinking, result);
      break;
    }
    if (isReasoning) {
      thinking += text;
    } else {
      content += text;
    }
    onchange(thinking, content);
  }
};

使用

import { parseReadableStream } from '@/utils/client';

const stream = await fetch('http://localhost:3000/sse', {
  method: 'GET',
}).then(res => res.body);

try {
  parseReadableStream(stream, {
  output: 'json',
  onStart: () => {
    console.log('开始');
  },
  onEnd: (thinking, result) => {
    console.log('结束', thinking, result);
  },
  onchange: (thinking, result) => {
    // 如果 output 为 json 则 result 为 已经解析后对象
    console.log('实时更新', thinking, result);
  },
  onThinkingStart: () => {
    console.log('思考开始');
  },
    onThinkingEnd: () => {
      console.log('思考结束');
    },
  });
} catch (error) {
  console.error(error);
}

Emby 开心版安装、使用

Tue, 25 Mar 2025 00:00:00 GMT

安装

使用 docker-compose 安装，docker-compose.yml 文件如下：

version: '3.8'
services:
  embyserver-happy:
    image: amilys/embyserver
    platform: linux/amd64   # 强制使用 amd64 架构（我这里使用的是 arm64 版本，如果使用 amd64 版本，请删除此行）
    container_name: emby-happy
    privileged: true
    volumes:
      - ./emby/config:/config # 配置文件
      - ./emby/webdav:/docker/webdav # 挂载 webdav 目录
      - ./emby/local:/docker/local # 本机影音文件目录
    ports:
      - 8096:8096
    restart: unless-stopped

在浏览器中访问 http://localhost:8096 即可访问 Emby。

挂载目录

挂载目录为 ./emby/local，目录结构如下：

在 ./emby/local 目录下存放你的影音文件，然后在浏览器访问 emby 服务，进入 设置 -> 服务器 -> 媒体库 -> 添加媒体库 -> 选择 从文件夹添加，然后选择 /docker/local 目录，然后扫描，等待扫描完成后，你就可以在首页中看到你的影音文件了。

第三方播放

使用 Infuse、Forward、VidHub、Senplay 等第三方播放器，可以播放 emby 中的影音文件。

局限

随着影视资源库的不断扩充，对于本地存储的容量要求也越来越高，此时有两条路可以选择

使用 NAS 存储
使用云盘挂载

对于 NAS 存储，这需要一笔不小的开支，而且需要考虑电费、散热、噪音等问题。

而我之前使用的是阿里云盘，且开通了它的三年会员，所以就自然而然选择了云盘挂载。

云盘挂载

总体思路是将云盘转换成 webdav 服务，然后在将 webdav 挂载为本地目录。

1.云盘转 webdav

使用 alist 很方便的将云盘转换成 webdav 服务，只需要在 alist 中添加阿里云盘即可。

:::tip 如果你没有阿里云盘的第三方权益会员，可以参考 alist 挂载阿里云盘实现获取阿里云盘 TV token 解除限速。 :::

2.1 使用 Rclone 挂载为本地目录

可以使用 Rclone 挂载 webdav 为本地目录，然后使用 emby 添加此目录。

安装 Rclone

macos 不能使用brew 安装，需要使用源码安装。

curl https://rclone.org/install.sh | sudo bash

配置 Rclone

rclone config

根据提示创建 remote -> 输入名称 -> 选择 webdav -> 输入 url -> 选择 Other site/service or software -> 输入用户名 -> 选择 Yes, type in my own password -> 输入两次密码 -> 回车完成配置

:::tip url 为 alist 的 webdav 地址，例如：https://example.com/dav/，用户名密码为你的 alist 用户名密码。 :::

挂载 webdav

# 直接后台挂载
rclone mount mywebdav:/ ~/docker/emby/webdav --network-mode --cache-dir cache --vfs-cache-mode full --header "Referer:" --daemon

# 使用 tmux 挂载
tmux new-session -d -s mount-rclone rclone mount mywebdav:/ ~/docker/emby/webdav --network-mode --cache-dir cache --vfs-cache-mode full --header "Referer:" --daemon

# 关闭挂载
#macos 使用
umount ~/docker/emby/webdav

#windows、linux 使用
fusermount -u ~/docker/emby/webdav

:::tip rclone mount: 挂载命令

mywebdav:: 刚刚配置的 remote 名称

~/docker/emby/webdav: 你的挂载目录

--network-mode: 启用网络模式，该模式会让 rclone mount 使用网络流量来访问和同步文件，而不是使用本地缓存。这可以有效减少磁盘占用，但会使文件访问速度依赖于网络连接。

--cache-dir cache: 设置本地缓存目录。在此命令中，cache 是一个相对路径或绝对路径，指定 rclone 存储本地缓存的地方。缓存的文件可以加速后续访问操作，尤其是针对大量小文件或频繁访问的情况。

--vfs-cache-mode full: FS（虚拟文件系统）缓存模式。在 rclone mount 中，full 模式表示 rclone 将缓存文件的全部内容。这对于大型文件（例如视频文件）的操作尤其重要，因为它将所有文件数据保存在本地缓存中，从而提高性能。该模式确保每个文件都完全缓存并能够进行读取和修改。

--header "Referer:" : 必须加上，否则无法播放

--daemon: 后台运行 :::

:::warning 由于缓存的原因，可能导致挂载后再网盘处编辑文件，挂载的目录不会同步更新，此时需要手动关闭挂载，重新挂载。 :::

2.2 使用 strm 文件模拟本地目录

思路来自于：

::github{repo="xtxt19931207/emby-alist"}

大体思路就是在 emby 的挂载目录中存放和 alist 1:1 一样的目录结构，但是文件内容由 mp4 -> strm 文件。

且 strm 文件内容为 webdav 的 url 地址，emby 会自动识别 strm 文件，并进行播放。

我在使用 emby-alist 仓库的代码时发现它存在一个 bug 无法识别所有的文件目录，因此我对它进行了修改，并添加了下载字幕的功能。

:::important

# 替换 webdav_url、save_mulu、username、password 为你自己的参数
webdav_url = 'https://example.com/dav/folder/'  # alist webdav 地址 folder 为你的文件夹名称
save_mulu = './'  # 输出路径
username = ''  # 用户名 alist 用户名
password = ''  # 密码 alist 密码
download_subtitle = False  # 是否下载字幕文件

:::

from webdav3.client import Client
import os, time, requests

def list_files(webdav_url, username, password):
	# 创建WebDAV客户端
	options = {
		'webdav_hostname': webdav_url,
		'webdav_login': username,
		'webdav_password': password
	}
	
	client = Client(options)
	mulu = []
	wenjian = []
	q = 1
	while q < 15:
		try:		   
		  # 获取WebDAV服务器上的文件列表
			files = client.list()
		except:
			q += 1
			print('连接失败，1秒后重试...')
			time.sleep(1)
		else:
			if q > 1:
				print('重连成功...')
			break

	if q >= 15:
		print(f"连接 {webdav_url} 失败，已达到最大重试次数")
		return [], []
		
	for file in files[1:]:
		if file[-1] == '/':
			mulu.append(file)
		else:
			wenjian.append(file)
	return mulu, wenjian

def traverse_webdav(base_url, username, password, max_depth=10, current_depth=0):
	"""
	递归遍历WebDAV目录，获取所有目录和文件
	
	Args:
		base_url: WebDAV基础URL
		username: 用户名
		password: 密码
		max_depth: 最大递归深度，防止无限递归
		current_depth: 当前递归深度
		
	Returns:
		tuple: (所有目录列表, 所有文件URL列表)
	"""
	if current_depth >= max_depth:
		print(f"警告: 达到最大递归深度 {max_depth}，停止在 {base_url} 的递归")
		return [], []
	
	print(f"扫描目录: {base_url}")
	
	# 获取当前目录下的文件和子目录
	directories, files = list_files(base_url, username, password)
	
	all_directories = [base_url]
	all_files = [base_url + f for f in files]
	
	# 递归处理子目录
	for directory in directories:
		dir_url = base_url + directory
		sub_dirs, sub_files = traverse_webdav(dir_url, username, password, max_depth, current_depth + 1)
		all_directories.extend(sub_dirs)
		all_files.extend(sub_files)
	
	return all_directories, all_files

def process_media_file(file_url, save_path, webdav_url):
	"""处理媒体文件，创建.strm文件"""
	if not os.path.exists(save_path + file_url.replace(webdav_url, '')[:-3] + 'strm'):
		print('正在处理：' + file_url.replace(webdav_url, ''))
		try:
			os.makedirs(os.path.dirname(save_path + file_url.replace(webdav_url, '')[:-3] + 'strm'), exist_ok=True)
			with open(save_path + file_url.replace(webdav_url, '')[:-3] + 'strm', "w", encoding='utf-8') as f:
				f.write(file_url.replace('/dav', '/d'))
		except:
			try:
				# 处理包含冒号等特殊字符的文件名
				os.makedirs(os.path.dirname(save_path + file_url.replace(webdav_url, '').replace('：', '.')[:-3] + 'strm'), exist_ok=True)
				with open(save_path + file_url.replace(webdav_url, '').replace('：', '.')[:-3] + 'strm', "w", encoding='utf-8') as f:
					f.write(file_url.replace('/dav', '/d'))
			except Exception as e:
				print(f"处理失败: {file_url.replace(webdav_url, '')} - 错误: {str(e)}")
				print(f"{file_url.replace(webdav_url, '')}处理失败，文件名包含特殊符号，建议重命名！")

def download_subtitle_file(file_url, save_path, webdav_url):
	"""下载字幕文件"""
	if not os.path.exists(save_path + file_url.replace(webdav_url, '')):
		p = 1
		while p < 10:
			try:
				print('正在下载：' + save_path + file_url.replace(webdav_url, ''))
				r = requests.get(file_url.replace('/dav', '/d'))
				os.makedirs(os.path.dirname(save_path + file_url.replace(webdav_url, '')), exist_ok=True)
				with open(save_path + file_url.replace(webdav_url, ''), 'wb') as f:
					f.write(r.content)
			except Exception as e:
				p += 1
				print(f'下载失败，1秒后重试... 错误: {str(e)}')
				time.sleep(1)
			else:
				if p > 1:
					print('重新下载成功！')
				break
		if p >= 10:
			print(f"下载失败: {file_url.replace(webdav_url, '')} - 已达到最大重试次数")

# 主程序
if __name__ == "__main__":
	# 输入WebDAV地址、用户名和密码
	webdav_url = 'https://example.com/dav/folder/'  # alist webdav 地址 folder 为你的文件夹名称
	save_mulu = './'  # 输出路径
	username = ''  # 用户名 alist 用户名
	password = ''  # 密码 alist 密码
	
	# 控制是否下载字幕文件
	download_subtitle = False  # 设置为 False 将不会下载字幕文件
	
	# 设置最大递归深度
	max_depth = 10  # 可以根据实际需求调整
	
	print(f"开始遍历 WebDAV 目录: {webdav_url}")
	print(f"字幕下载功能: {'已启用' if download_subtitle else '已禁用'}")
	start_time = time.time()
	
	# 递归遍历所有目录和文件
	all_directories, all_files = traverse_webdav(webdav_url, username, password, max_depth)
	
	print(f"遍历完成，共发现 {len(all_directories)} 个目录，{len(all_files)} 个文件")
	print(f"遍历耗时: {time.time() - start_time:.2f} 秒")
	
	# 处理所有文件
	processed_count = 0
	media_count = 0
	subtitle_count = 0
	
	for file_url in all_files:
		extension = file_url.split('.')[-1].upper() if '.' in file_url else ''
		
		if extension in ['MP4', 'MKV', 'FLV', 'AVI']:
			process_media_file(file_url, save_mulu, webdav_url)
			processed_count += 1
			media_count += 1
		elif extension in ['ASS', 'SRT', 'SSA'] and download_subtitle:
			# 只有当 download_subtitle 为 True 时才下载字幕文件
			download_subtitle_file(file_url, save_mulu, webdav_url)
			processed_count += 1
			subtitle_count += 1
	
	print(f'处理完毕！共处理 {processed_count} 个文件（媒体文件: {media_count}, 字幕文件: {subtitle_count}）')
	print(f'字幕下载功能: {"已启用" if download_subtitle else "已禁用"}')
	input('按任意键退出...')

:::tip 经测试无法通过 emby 播放 strm 文件，但是通过第三方播放器则可以正常播放。 :::

emby 添加资源库

在 emby 中添加资源库，选择 从文件夹添加，然后选择 /docker/emby 目录，然后扫描，等待扫描完成后，你就可以在首页中看到你的影音文件了。

Next.js 在 Safari 浏览器中异常的水合错误

Tue, 04 Mar 2025 00:00:00 GMT

问题描述

我在使用 Next.js(v15.1.7) 开发时，使用 HeroUI 组件库的 ListBox 组件时，遇到了水合错误。

一开始在 Chromium 内核的浏览器中一切正常，但是当我在开发者工具中切换到移动端(iphone系列)时，发现组件使用正常但是控制台报水合错误，我一开始的第一反应是移动端代码有问题，经过排查发现并不是，而是 Next.js 在 Safari 浏览器中对于标签嵌套的渲染有问题。

问题排查

经过排查，发现问题出在 ListBox 和 ListItem 的标签渲染上，ListBox 默认渲染为 ul 标签，ListItem 默认渲染为 li 标签，虽然这一切看着正常，但是可能是 Next.js 在 Safari 浏览器中对于组件的渲染有问题，导致水合错误。

伪代码如下：

// Sidebar.tsx
import { Listbox, ListboxItem } from "@heroui/react";

export default function Sidebar() {
  return (
    <Listbox as="ul">
      <ListboxItem as="li" />
    </Listbox>
  )
}

解决方案

按照如下组合尝试修改：

ListBox -> ul && ListboxItem -> li
ListBox -> ol && ListboxItem -> li
ListBox -> div && ListboxItem -> div
ListBox -> div && ListboxItem -> p
ListBox -> p && ListboxItem -> p

对于 chromium 内核的浏览器只有使用 p 标签嵌套 p 标签才会出现水合错误，其他标签组合则不会出现水合错误。

而对于 Safari 浏览器，则所有标签组合都会出现水合错误。

因此，可见 Next.js 在 Safari 浏览器中对于组件的渲染有问题，为了解决这个问题(在应对水合错误时,官方推荐的解决方案之一)，可以使用 dynamic 组件来动态渲染组件，跳过 Next.js 的预渲染。

// Layout.tsx
import dynamic from "next/dynamic";

const Sidebar = dynamic(() => import("@/components/Sidebar"), { ssr: false });

Grok API 充值 $5, 获取每月 $150 的 API 额度

Thu, 20 Feb 2025 00:00:00 GMT

背景

最近马斯克发布了 Grok 模型，但是 Grok3 的api 还未发布就已经出了 5 刀的充值活动，虽然如此但是我体验过后网页端的 Grok3 后发现回答速度以及质量都非常不错，因此我还是比较愿意给马斯克贡献这 5 刀的。

活动

活动地址

注意事项

需要使用信用卡充值
需要数据共享，也就是使用数据换取 API 额度
账单地址非欧盟地区
每月可以获取 $150 的 API 额度，毕竟活动最终解释权归马斯克所有

充值

先填写账单地址，然后绑定信用卡，然后充值 $5 即可。

以下是网友分享的充值经验：

银行卡：用的国内中行的2张，Visa和Master，都可以。一张付了2次可以。

地址选择：

账号选美区，付款账单地址美区，成功

账号选美区，付款账单地址中国，成功

账号选中国，付款账单地址中国，成功

:::tip 绑定信用卡有延迟，请稍作等待后再进行查看充值。(我大概等了 10 分钟) :::

领取额度

确认共享数据后，即可领取额度。

使用

我这里使用的是本地部署的 open web ui 进行测试的，使用方式如下：

在 open web ui 管理员界面，进入设置 -> 外部连接 -> 管理 OpenAI API 处添加一个即可。

URL 填写：https://api.x.ai/v1

API Key 生成后填写，然后保存进入首页测试。

FRP 内网穿透

Wed, 19 Feb 2025 00:00:00 GMT

我的需求

我家里的服务器上部署了很多的服务，比如 alist、openwebui、以及一些我的小项目。

我之前才用的方案是使用 DDNS 将我的动态公网 IP 地址固定下来，然后使用 Nginx Proxy Manager 来反向代理到我的内网服务。

但是由于家庭宽带的一些端口的限制，比如 http(80)、https(443) 等端口被封锁，导致我只能使用 https://alist.mihouo.com:8443 来访问我的 alist 服务。

因为 443 端口被封锁了，所以我在使用 Nginx Proxy Manager 的时候，使用 8443 端口代理 443 端口。

我的最终需求也很简单，就是消灭掉 8443 端口，让我可以像 https://alist.mihouo.com 一样访问我的 alist 服务。

什么是 FRP

FRP (Fast Reverse Proxy) 是一个高性能的反向代理应用，主要用于内网穿透。它能够帮助用户将局域网内的服务暴露到公网上，解决 NAT 和防火墙限制的问题。FRP 由两个部分组成：frps（服务端）和 frpc（客户端）。其原理类似于将一个内网服务通过代理的方式暴露到外网，让外部网络能够访问内网服务。

FRP 的基本工作原理

客户端 (frpc)：通常在内网运行，负责将本地服务的请求通过代理转发到公网。
服务端 (frps)：通常运行在有公网 IP 的服务器上，负责接收来自客户端的请求，并将请求转发到对应的本地服务。

frpc 和 frps 之间通过一个 TCP 连接进行通信，frps 作为代理服务器，接收来自外部的请求，转发到内网的对应服务上，而 frpc 则接收来自 frps 的请求并将其传递给本地服务。

FRP 配置

FRP 版本：v0.61.1

首先需要在两个服务器上分别下载 FRP。

wget https://github.com/fatedier/frp/releases/download/v0.61.1/frp_0.61.1_linux_amd64.tar.gz

解压下载的文件，并进入解压后的文件夹。

tar -zxvf frp_0.61.1_linux_amd64.tar.gz
cd frp_0.61.1_linux_amd64

:::tip 注意自己的服务器是 windows、linux、macos(darwin) 等，然后选择对应的版本下载。

也需要注意自己的 CPU 架构，比如 arm64、amd64 等，然后选择对应的版本下载。 :::

配置 FRPS

使用 nano 命令编辑 frps.toml 文件，并添加以下内容：

[common]
# frp监听的端口，默认是7000，可以改成其他的
bind_port = 7000
# 授权码，请改成更复杂的 # 这个token之后在客户端会用到
token = token

# frp管理后台端口，请按自己需求更改
dashboard_port = 7500
# frp管理后台用户名和密码，请改成自己的
dashboard_user = user
dashboard_pwd = password
enable_prometheus = true

# frp日志配置
log_file = ./frps.log
log_level = info
log_max_days = 3

可选项: 创建 systemd 服务

sudo nano /etc/systemd/system/frps.service

添加以下内容：

[Unit]
Description=FRP Server
After=network.target

[Service]
Type=simple
ExecStart=/opt/frp_0.61.1_linux_amd64/frps -c /opt/frp_0.61.1_linux_amd64/frps.toml
Restart=on-failure
User=root

[Install]
WantedBy=multi-user.target

启动服务

sudo systemctl start frps
sudo systemctl stop frps

查看服务状态

sudo systemctl status frps

如果启动失败可能是没有权限，使用 sudo chmod +x /opt/frp_0.61.1_linux_amd64/frps 赋予权限。

:::tip 启动状态为 active (running)，则表示服务启动成功。启动失败可使用 journalctl -u frps.service 查看详细日志。

想要开机自启动，可以执行 sudo systemctl enable frps。 :::

进入 frp Dashboard

通过你的公网 IP 和 dashboard_port 访问 frp Dashboard。

http://8.218.x.x:7500

FRPC 配置

在你的另一台需要进行穿透的服务器上，使用 nano 命令编辑 frpc.toml 文件，并添加以下内容：

#【公网服务端地址】
serverAddr = "8.218.x.x"
#【公网服务端端口】
serverPort = 7000
#【令牌，与公网服务端保持一致】
auth.token = "token"

[[proxies]]
name = "alist"
type = "tcp"
# 本地服务地址
localIP = "127.0.0.1"
# 本地服务端口
localPort = 5244
# 穿透的端口
remotePort = 5244

可选项: 创建服务

根据 frps 的配置，创建 frpc 的 systemd 服务。(基本只需要将 frps 更改为 frpc 即可)

我这里的终端设备是 macos，因此我使用的是 launchd 来创建用户级服务。

nano ~/Library/LaunchAgents/frpc.plist

添加以下内容：

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs$
<plist version="1.0">
  <dict>
    <key>Label</key>
    <string>com.frpc</string>
    <key>ProgramArguments</key>
    <array>
      <string>~/opt/frp_0.61.1_darwin_arm64/frpc</string>
      <string>-c</string>
      <string>~/opt/frp_0.61.1_darwin_arm64/frpc.toml</string>
    </array>
    <key>RunAtLoad</key>
    <true/>
    <key>KeepAlive</key>
    <true/>
    <key>StandardErrorPath</key>
    <string>/tmp/frpc.err</string>
    <key>StandardOutPath</key>
    <string>/tmp/frpc.out</string>
  </dict>
</plist>

加载服务

launchctl load ~/Library/LaunchAgents/frpc.plist

卸载服务

launchctl unload ~/Library/LaunchAgents/frpc.plist

启动服务

launchctl start com.frp.client

停止服务

launchctl stop com.frp.client

查看服务状态

launchctl list | grep frpc

:::tip 不知为何，我使用 launchctl 启动服务后，总是提示 failed: 5: Input/output error，但是我的配置文件并无问题，最终我使用 tmux 来启动服务。

tmux new-session -d -s frpc '~/opt/frp_0.61.1_darwin_arm64/frpc -c ~/opt/frp_0.61.1_darwin_arm64/frpc.toml'

:::

如果 frpc 启动正常，则可以通过 Dashboard 查看服务状态。

这时应该可以通过 8.218.x.x:5244 访问我的 alist 服务了。

但是到这一步还没有到达我的最终需求，还需要在使用 Nginx Proxy Manager 将 5244 端口反向代理到 https://alist.mihouo.com。

Nginx Proxy Manager 配置参考

DeepSeek 本地部署

Fri, 07 Feb 2025 00:00:00 GMT

背景

在 2025 的新年中，DeepSeek 推出了R1 模型，对标 openai 的 o1 模型，并提供了本地部署方案，本文主要介绍本地部署方案。

部署

我这里是使用的 macmini 部署的，配置如下：

处理器：M4
内存：16GB
硬盘：512GB

主要用到以下工具

Docker: 容器化部署
Ollama: 本地部署模型
Open Web UI: 本地部署 UI

安装 Docker

官网安装

Docker 官网

使用 Homebrew 安装

brew install docker

验证

docker --version

安装 Ollama

官网安装

Ollama 官网

使用 Homebrew 安装

brew install ollama

验证

ollama --version

配置

创建并编辑配置文件

nano ~/Library/LaunchAgents/com.user.ollama.service.plist

添加以下内容：配置文件中写入下面内容；定义了服务方式运行，以及做了跨域设置。使得内网其他的网络访问被允许

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
    <key>Label</key>
    <string>com.user.ollama.service</string>
    <key>ProgramArguments</key>
    <array>
        <string>/usr/local/bin/ollama</string>
        <string>serve</string>
    </array>
    <key>RunAtLoad</key>
    <true/>
    <key>KeepAlive</key>
    <true/>
    <key>StandardErrorPath</key>
    <string>/tmp/ollama.err</string>
    <key>StandardOutPath</key>
    <string>/tmp/ollama.out</string>
    <key>EnvironmentVariables</key>
    <dict>
        <key>OLLAMA_HOST</key>
        <string>0.0.0.0</string>
        <key>Ollama_ORIGINS</key>
        <string>*</string>
    </dict>
</dict>
</plist>

赋予权限，启动服务

chmod 644 ~/Library/LaunchAgents/com.user.ollama.service.plist
launchctl load ~/Library/LaunchAgents/com.user.ollama.service.plist

安装 Open Web UI

docker-compose.yml 文件如下：

services:
  open-webui:
    image: ghcr.io/open-webui/open-webui:main
    restart: always
    ports:
      - "3000:8080"
    volumes:
      - ./open-webui:/app/backend/data

  watchtower:
    image: containrrr/watchtower
    restart: always
    volumes:
      - /var/run/docker.sock:/var/run/docker.sock
    command: --interval 300 open-webui
    depends_on:
      - open-webui

启动

docker-compose up -d

验证

docker-compose ps

安装模型

如果上述内容都安装成功，那么进入浏览器输入 http://localhost:3000 即可看到 Open Web UI 的 UI 界面。

设置 open web ui 关联 ollama

进入 open web ui 的界面，点击左下角头像，进入设置界面，选择 管理员设置 -> 外部链接 选项，在管理Ollama API连接选项下填写地址 http://host.docker.internal:11434，确保按钮启用，点击 保存 按钮，即可完成设置。

拉取模型

进入ollama 模型官网，搜索 deepseek 模型，选择 deepseek-r1 模型，选择模型大小，根据你的机器性能选择，我这里选择 14b 模型，点击复制命令，进入终端执行命令，即可拉取模型。

ollama pull deepseek-r1:14b

:::note

模型大小选择，根据你机器的可用内存，选择合适的模型。通常情况下可以这样计算，你机器的可用内存需要大于模型占用的硬盘存储空间。注意：这里计算的是机器内存和占用硬盘存储空间

:::

测试模型

进入 open web ui 的界面，左上角选择模型，选择 deepseek-r1 模型，进行对话测试。

使用 Realm 转发流量，实现落地代理

Mon, 20 Jan 2025 00:00:00 GMT

背景

虽然在使用使用 Alice DNS 解锁服务器访问限制中，已经实现了使用 Alice DNS 解锁服务器访问限制，但是，由于 Alice DNS 是公共 DNS，存在高峰期访问不稳定的问题，因此我这次使用的是 Alice 香港的机器作为落地机。

准备材料

线路优化的机器，但 ip 脏的机器，作为中转，通过 GFW，例如 Claw 香港的机器
一台 Alice 香港的机器，作为落地机，不通过 GFW，但是需要 IP 干净，例如 Alice 香港的机器

示意图

实现

中转机

中转机使用 Realm 转发流量，实现落地代理。

# 一键 Realm 脚本
wget -N https://raw.githubusercontent.com/qqrrooty/EZrealm/main/realm.sh && chmod +x realm.sh && ./realm.sh

进入面板后，先安装 realm，然后添加 realm 转发规则

本地监听端口: 1-65535，随便输入一个
需要转发的IP: 落地机 IP
需要转发端口: 1-65535，这个端口需要是落地机接收流量的端口(稍后配置落地机代理协议时生成的端口，例如 28175)

落地机

正常使用脚本搭建代理协议即可，例如我使用 ss 协议，则使用以下脚本

# 一键 ss 脚本
wget -O ss-rust.sh --no-check-certificate https://raw.githubusercontent.com/xOS/Shadowsocks-Rust/master/ss-rust.sh && chmod +x ss-rust.sh && ./ss-rust.sh

:::important

如果使用 SS 协议，请选择加密方式为 2022 的，否则 ip 会被 GFW 封锁。

:::

添加好代理协议后会返回信息，如下：

# 以下信息已经做了脱敏处理，请不要尝试直接使用
Shadowsocks Rust 配置：
——————————————————————————————————
 地址：173.152.108.142
 地址：2a12:2813:321::69
 端口：28175 # 中转机转发端口
 密码：QiHQ2B0j6dsya1982xE1uVbElK6pn5x8HNfmm+Mzky394=
 加密：2022-blake3-aes-256-gcm
 TFO ：true
——————————————————————————————————
 链接  [IPv4]：ss://MjAyMi1ibGFrZTMtYWV23hsjda8213HUS12nd1oWHkreEUxdVZiRWxLNnBuNXg4SE5mbW0rTXpreTM5ND1AMTU3LjI1NC4yMS4xNDI6MjgxNzU 
 二维码[IPv4]：https://cli.im/api/qrcode/code?text=ss://MjAyMi1ibGFrZTMtYWV23hsjda8213HUS12nd1oWHkreEUxdVZiRWxLNnBuNXg4SE5mbW0rTXpreTM5ND1AMTU3LjI1NC4yMS4xNDI6MjgxNzU
 链接  [IPv6]：ss://MjAyMi1ibGFrZTMtYWV23hsjda8213HUS12nd1oWHkreEUxdVZiRWxLNnBuNXg4SE5mbW0rTXpreTM5ND1AMmExNDo2N2MwOjMwMzo6Njk6MjgxNzU 
 二维码[IPv6]：https://cli.im/api/qrcode/code?text=ss://MjAyMi1ibGFrZTMtYWV23hsjda8213HUS12nd1oWHkreEUxdVZiRWxLNnBuNXg4SE5mbW0rTXpreTM5ND1AMmExNDo2N2MwOjMwMzo6Njk6MjgxNzU
—————————————————————————
[信息] Surge 配置：
Const0822.alice.ws = ss,173.152.108.142,28175,encrypt-method=2022-blake3-aes-256-gcm,password=QiHQ2B0j6dsya1982xE1uVbElK6pn5x8HNfmm+Mzky394=,tfo=true,udp-relay=true,ecn=true
—————————————————————————

测试

首先测试直接通过链接落地机的代理协议访问。

新建一个代理，信息和落地机代理一样，然后将 ip 和端口修改为中转机的 ip 和端口，进行测试，结果如下：

:::tip

我这里使用的测试工具是 Surge 的网络信息模块

:::

Alice 香港落地机融合怪测试

Thu, 16 Jan 2025 00:00:00 GMT

机器详情

CPU 1 vCPU
内存 512 MiB
存储 5 GiB
带宽 1000 Mbps
流量 1024 GB

IP Check

bash <(curl -Ls IP.Check.Place)

详情

########################################################################
                      IP质量体检报告：157.254.*.*
                    bash <(curl -sL IP.Check.Place)
                   https://github.com/xykt/IPQuality
        报告时间：2025-04-11 10:32:31 CST  脚本版本：v2025-03-25
########################################################################
一、基础信息（Maxmind 数据库）
自治系统号：            AS202662
组织：                  Hytron Network Services Limited
坐标：                  114°10′33″E, 22°17′3″N
地图：                  https://check.place/22.2842,114.1759,15,cn
城市：                  N/A, 香港
使用地：                [HK]香港, [AS]亚洲
注册地：                [US]美国
时区：                  Asia/Hong_Kong
IP类型：                 广播IP 
二、IP类型属性
数据库：      IPinfo    ipregistry    ipapi     AbuseIPDB  IP2LOCATION 
使用类型：     机房        机房        机房        机房        机房    
公司类型：     机房        机房        机房    
三、风险评分
风险等级：      极低         低       中等       高         极高
SCAMALYTICS：  0|低风险
ipapi：      0.11%|低风险
AbuseIPDB：    0|低风险
IPQS：                                          87|存在风险
Cloudflare：   0|低风险
DB-IP：         |低风险
四、风险因子
库： IP2LOCATION ipapi ipregistry IPQS SCAMALYTICS ipdata IPinfo IPWHOIS
地区：    [HK]    [HK]    [HK]    [HK]    [HK]    [HK]    [HK]    [HK]
代理：     否      否      否      是      否      否      否      否 
Tor：      否      否      否      否      否      否      否      否 
VPN：      否      否      否      是      否      无      否      否 
服务器：   是      是      是      无      否      否      是      否 
滥用：     否      否      否      是      无      否      无      无 
机器人：   否      否      无      否      否      无      无      无 
五、流媒体及AI服务解锁检测
服务商：  TikTok   Disney+  Netflix Youtube  AmazonPV  Spotify  ChatGPT 
状态：     解锁     解锁     解锁     解锁     解锁     屏蔽     解锁   
地区：     [SG]     [HK]     [HK]     [HK]     [HK]              [SG]   
方式：      DNS      DNS      DNS     原生      DNS               DNS   
六、邮局连通性及黑名单检测
本地25端口：阻断
IP地址黑名单数据库：  有效 439   正常 428   已标记 11   黑名单 0
========================================================================
今日IP检测量：137；总检测量：175243。感谢使用xy系列脚本！ 
报告链接：https://Report.Check.Place/IP/3DPKHP3QH.svg

融合怪

一键脚本

::github{repo="spiritLHLS/ecs"}

curl -L https://gitlab.com/spiritysdx/za/-/raw/main/ecs.sh -o ecs.sh && chmod +x ecs.sh && bash ecs.sh

详情

--------------------- A Bench Script By spiritlhl ----------------------
                   测评频道: https://t.me/vps_reviews                    
VPS融合怪版本：2025.01.02
Shell项目地址：https://github.com/spiritLHLS/ecs
Go项目地址：https://github.com/oneclickvirt/ecs
---------------------基础信息查询--感谢所有开源项目---------------------
 CPU 型号          : Intel Core Processor (Broadwell, IBRS)
 CPU 核心数        : 1
 CPU 频率          : 2399.996 MHz
 CPU 缓存          : L1: 32.00 KB / L2: 4.00 MB / L3: 16.00 MB
 AES-NI指令集      : ✔ Enabled
 VM-x/AMD-V支持    : ✔ Enabled
 内存              : 186.70 MiB / 422.59 MiB
 Swap              : [ no swap partition or swap file detected ]
 硬盘空间          : 1.74 GiB / 4.82 GiB
 启动盘路径        : /dev/vda3
 系统在线时间      : 0 days, 0 hour 14 min
 负载              : 0.70, 0.18, 0.06
 系统              : Debian GNU/Linux 12 (bookworm) (x86_64)
 架构              : x86_64 (64 Bit)
 内核              : 6.1.0-30-amd64
 TCP加速方式       : bbr
 虚拟化架构        : KVM
 NAT类型           : Full Cone
 IPV4 ASN          : AS202662 Hytron Network Services Limited
 IPV4 位置         : Hong Kong / Hong Kong / HK
 IPV6 ASN          : AS215355 Alice Networks
 IPV6 位置         : Kai Yi Wan / Hong Kong
 IPV6 子网掩码     : 128
----------------------CPU测试--通过sysbench测试-------------------------
 -> CPU 测试中 (Fast Mode, 1-Pass @ 5sec)
 1 线程测试(单核)得分:          899 Scores
---------------------内存测试--感谢lemonbench开源-----------------------
 -> 内存测试 Test (Fast Mode, 1-Pass @ 5sec)
 单线程读测试:          18953.98 MB/s
 单线程写测试:          14265.00 MB/s
------------------磁盘dd读写测试--感谢lemonbench开源--------------------
 -> 磁盘IO测试中 (4K Block/1M Block, Direct Mode)
 测试操作               写速度                                  读速度
 100MB-4K Block         17.0 MB/s (4158 IOPS, 6.16s)            22.7 MB/s (5535 IOPS, 4.62s)
 1GB-1M Block           160 MB/s (152 IOPS, 6.57s)              159 MB/s (151 IOPS, 6.59s)
---------------------磁盘fio读写测试--感谢yabs开源----------------------
Block Size | 4k            (IOPS) | 64k           (IOPS)
  ------   | ---            ----  | ----           ---- 
Read       | 52.08 MB/s   (13.0k) | 153.94 MB/s   (2.4k)
Write      | 52.16 MB/s   (13.0k) | 154.75 MB/s   (2.4k)
Total      | 104.25 MB/s  (26.0k) | 308.69 MB/s   (4.8k)
           |                      |                     
Block Size | 512k          (IOPS) | 1m            (IOPS)
  ------   | ---            ----  | ----           ---- 
Read       | 146.93 MB/s    (286) | 145.07 MB/s    (141)
Write      | 154.74 MB/s    (302) | 154.73 MB/s    (151)
Total      | 301.68 MB/s    (588) | 299.80 MB/s    (292)
------------流媒体解锁--基于oneclickvirt/CommonMediaTests开源-----------
以下测试的解锁地区是准确的，但是不是完整解锁的判断可能有误，这方面仅作参考使用
----------------Netflix-----------------
[IPV4]
您的出口IP完整解锁Netflix，支持非自制剧的观看
NF所识别的IP地域信息：中国香港
[IPV6]
您的网络可能没有正常配置IPv6，或者没有IPv6网络接入
----------------Youtube-----------------
[IPV4]
连接方式: Youtube Video Server
视频缓存节点地域: 中国香港(HKG07S42)
Youtube识别地域: 中国香港(HK)
[IPV6]
连接方式: Youtube Video Server
视频缓存节点地域: 中国香港(HKG07S42)
Youtube识别地域: 中国香港(HK)
---------------DisneyPlus---------------
[IPV4]
当前出口所在地区解锁DisneyPlus
区域：SG 区
[IPV6]
当前出口所在地区解锁DisneyPlus
区域：SG 区
解锁Netflix，Youtube，DisneyPlus上面和下面进行比较，不同之处自行判断
----------------流媒体解锁--感谢RegionRestrictionCheck开源--------------
 以下为IPV4网络测试，若无IPV4网络则无输出
============[ Multination ]============
 Dazn:                                  Yes (Region: SG)
 Disney+:                               Yes (Region: SG)
 Netflix:                               Yes (Region: HK)
 YouTube Premium:                       Yes (Region: HK)
 Amazon Prime Video:                    Yes (Region: HK)
 TVBAnywhere+:                          No
 Spotify Registration:                  No
 OneTrust Region:                       HK [Unknown]
 iQyi Oversea Region:                   HK
 Bing Region:                           HK (Risky)
 YouTube CDN:                           Hong Kong
 Netflix Preferred CDN:                 [Alice Networks] in [Hong Kong]
 ChatGPT:                               Yes
 Google Gemini:                         Yes (Region: SGP)
 Wikipedia Editability:                 No
 Google Play Store:                     Hong Kong 
 Google Search CAPTCHA Free:            Yes
 Steam Currency:                        HKD
 ---Forum---
 Reddit:                                No
=======================================
 以下为IPV6网络测试，若无IPV6网络则无输出
============[ Multination ]============
 Dazn:                                  IPv6 Is Not Currently Supported
 Disney+:                               IPv6 Is Not Currently Supported
 Netflix:                               Failed (Network Connection)
 YouTube Premium:                       Yes (Region: HK)
 Amazon Prime Video:                    IPv6 Is Not Currently Supported
 TVBAnywhere+:                          IPv6 Is Not Currently Supported
 Spotify Registration:                  No
 OneTrust Region:                       Failed (Network Connection)
 iQyi Oversea Region:                   IPv6 Is Not Currently Supported
 Bing Region:                           HK (Risky)
 YouTube CDN:                           Hong Kong
 Netflix Preferred CDN:                 Failed (CDN IP Not Found)
 ChatGPT:                               Failed (Network Connection)
 Google Gemini:                         No
 Wikipedia Editability:                 Yes
 Google Play Store:                     Hong Kong 
 Google Search CAPTCHA Free:            Yes
 Steam Currency:                        IPv6 Is Not Currently Supported
 ---Forum---
 Reddit:                                IPv6 Is Not Currently Supported
=======================================
---------------TikTok解锁--感谢lmc999的源脚本及fscarmen PR--------------
 Tiktok Region:         【SG】
-------------IP质量检测--基于oneclickvirt/securityCheck使用-------------
数据仅作参考，不代表100%准确，如果和实际情况不一致请手动查询多个数据库比对
以下为各数据库编号，输出结果后将自带数据库来源对应的编号
ipinfo数据库  [0] | scamalytics数据库 [1] | virustotal数据库   [2] | abuseipdb数据库   [3] | ip2location数据库    [4]
ip-api数据库  [5] | ipwhois数据库     [6] | ipregistry数据库   [7] | ipdata数据库      [8] | db-ip数据库          [9]
ipapiis数据库 [A] | ipapicom数据库    [B] | bigdatacloud数据库 [C] | cheervision数据库 [D] | ipqualityscore数据库 [E]
IPV4:
安全得分:
声誉(越高越好): 0 [2] 
信任得分(越高越好): 1 [8] 
VPN得分(越低越好): 99 [8] 
代理得分(越低越好): 100 [8]
社区投票-无害: 0 [2] 
社区投票-恶意: 0 [2] 
威胁得分(越低越好): 99 [8] 
欺诈得分(越低越好): 93 [E] 0 [1]
滥用得分(越低越好): 0 [3] 
ASN滥用得分(越低越好): 0.0019 (Low) [A] 
公司滥用得分(越低越好): 0.0014 (Low) [A] 
威胁级别: low [9 B] 
黑名单记录统计:(有多少黑名单网站有记录):
无害记录数: 60 [2]  恶意记录数: 2 [2]  可疑记录数: 0 [2]  无记录数: 32 [2]  
安全信息:
使用类型: business [8] hosting - high probability [C] hosting [0 7 A] DataCenter/WebHosting/Transit [3] corporate [9]
公司类型: hosting [0 7] business [A]
是否云提供商: No [D] Yes [7]
是否数据中心: Yes [0 1 A C] No [5 6 8]
是否移动设备: No [5 A C] Yes [E]
是否代理: No [0 1 4 5 6 7 8 9 A B C D] Yes [E]
是否VPN: Yes [E] No [0 1 6 7 A C D]
是否Tor: No [0 1 3 6 7 8 A B C D E] 
是否Tor出口: No [1 7 D] 
是否网络爬虫: No [9 A B E] 
是否匿名: No [1 6 7 8 D] 
是否攻击者: No [7 8 D] 
是否滥用者: Yes [E] No [7 8 A C D]
是否威胁: No [7 8 C D] 
是否中继: No [0 7 8 C D] 
是否Bogon: No [7 8 A C D] 
是否机器人: No [E] 
DNS-黑名单: 314(Total_Check) 0(Clean) 6(Blacklisted) 18(Other) 
IPV6:
安全得分:
欺诈得分(越低越好): 17 [1] 
滥用得分(越低越好): 0 [3]
ASN滥用得分(越低越好): 0.0021 (Low) [A] 
公司滥用得分(越低越好): 0 (Very Low) [A] 
威胁级别: low [B] 
安全信息:
使用类型: business [A] DataCenter/WebHosting/Transit [3]
公司类型: business [A] 
是否云提供商: No [D] 
是否数据中心: Yes [1 A] 
是否移动设备: No [A] 
是否代理: No [1 A B D] 
是否VPN: No [1 A D] 
是否TorExit: No [1 D] 
是否Tor出口: No [1 D] 
是否网络爬虫: No [A B] 
是否匿名: No [1 D] 
是否攻击者: No [D] 
是否滥用者: No [A D] 
是否威胁: No [D] 
是否中继: No [D] 
是否Bogon: No [A D] 
DNS-黑名单: 314(Total_Check) 0(Clean) 0(Blacklisted) 314(Other) 
Google搜索可行性：YES
-------------邮件端口检测--基于oneclickvirt/portchecker开源-------------
Platform  SMTP  SMTPS POP3  POP3S IMAP  IMAPS
LocalPort ✔     ✔     ✔     ✔     ✔     ✔    
QQ        ✔     ✔     ✔     ✘     ✔     ✘    
163       ✔     ✔     ✔     ✘     ✔     ✘    
Sohu      ✔     ✔     ✔     ✘     ✔     ✘    
Yandex    ✔     ✔     ✔     ✘     ✔     ✘    
Gmail     ✔     ✔     ✘     ✘     ✘     ✘    
Outlook   ✔     ✘     ✔     ✘     ✔     ✘    
Office365 ✔     ✘     ✔     ✘     ✔     ✘    
Yahoo     ✔     ✔     ✘     ✘     ✘     ✘    
MailCOM   ✔     ✔     ✔     ✘     ✔     ✘    
MailRU    ✔     ✔     ✘     ✘     ✔     ✘    
AOL       ✔     ✔     ✘     ✘     ✘     ✘    
GMX       ✔     ✘     ✔     ✘     ✔     ✘    
Sina      ✘     ✘     ✔     ✘     ✔     ✘    
----------------三网回程--基于oneclickvirt/backtrace开源----------------
北京电信 219.141.140.10  电信163    [普通线路] 
北京联通 202.106.195.68  检测不到回程路由节点的IP地址
北京移动 221.179.155.161 检测不到回程路由节点的IP地址
上海电信 202.96.209.133  电信163    [普通线路] 
上海联通 210.22.97.1     检测不到回程路由节点的IP地址
上海移动 211.136.112.200 检测不到回程路由节点的IP地址
广州电信 58.60.188.222   电信163    [普通线路] 
广州联通 210.21.196.6    检测不到回程路由节点的IP地址
广州移动 120.196.165.24  检测不到回程路由节点的IP地址
成都电信 61.139.2.69     电信163    [普通线路] 
成都联通 119.6.6.6       联通4837   [普通线路] 
成都移动 211.137.96.205  检测不到回程路由节点的IP地址
准确线路自行查看详细路由，本测试结果仅作参考
同一目标地址多个线路时，可能检测已越过汇聚层，除了第一个线路外，后续信息可能无效
---------------------回程路由--感谢fscarmen开源及PR---------------------
依次测试电信/联通/移动经过的地区及线路，核心程序来自ipip.net或nexttrace，请知悉!
广州电信 58.60.188.222
0.49 ms         AS202662 美国 加利福尼亚州 洛杉矶 hytron.io
0.50 ms         * RFC1918
149.45 ms       * [NSFNET-T3] 美国 加利福尼亚 圣何塞
258.27 ms       AS701 [UU-152] 美国 加利福尼亚 圣何塞 verizon.com
407.04 ms       AS4134 [CHINANET-BB] 中国 广东 广州 www.chinatelecom.com.cn 电信
* ms    AS4134 [CHINANET-BB] 中国 广东 广州 www.chinatelecom.com.cn 电信
* ms    AS4134 [CHINANET-BB] 中国 广东 广州 www.chinatelecom.com.cn 电信
* ms    AS4134 [APNIC-AP] 中国 广东 深圳 www.chinatelecom.com.cn 电信
406.77 ms       AS4134 中国 广东 深圳 福田区 www.chinatelecom.com.cn 电信
广州联通 210.21.196.6
0.48 ms         AS202662 美国 加利福尼亚州 洛杉矶 hytron.io
3.82 ms         * RFC1918
10.82 ms        * RFC1918
214.02 ms       AS17816 [APNIC-AP] 中国 广东 茂名市 chinaunicom.cn 联通
207.98 ms       AS17623 [APNIC-AP] 中国 广东 深圳 chinaunicom.cn 联通
256.05 ms       AS17623 中国 广东 深圳 宝安区 chinaunicom.cn 联通
广州移动 120.196.165.24
0.35 ms         AS202662 美国 加利福尼亚州 洛杉矶 hytron.io
0.73 ms         * RFC1918
0.98 ms         * RFC1918
59.95 ms        AS9808 [CMNET] 中国 广东 广州 chinamobileltd.com 移动
63.88 ms        AS9808 [CMNET] 中国 广东 广州 chinamobileltd.com 移动
62.99 ms        AS56040 [APNIC-AP] 中国 广东 深圳 gd.10086.cn 移动
--------------------自动更新测速节点列表--本脚本原创--------------------
位置             上传速度        下载速度        延迟     丢包率
Speedtest.net    1039.11 Mbps    931.86 Mbps     0.53     0.0%
中国香港         1023.97 Mbps    943.80 Mbps     0.60     0.0%
新加坡           1036.78 Mbps    668.36 Mbps     34.53    0.0%
联通WuXi         1118.52 Mbps    96.38 Mbps      67.28    10.7%
联通成都         1.72 Mbps       3.32 Mbps       955.25   NULL
电信浙江         20.23 Mbps      501.61 Mbps     395.99   NULL
电信Suzhou5G     60.58 Mbps      346.14 Mbps     404.59   NULL
移动Beijing      11.82 Mbps      342.64 Mbps     591.90   20.4%
------------------------------------------------------------------------
 总共花费      : 8 分 45 秒
 时间          : Wed Jan 15 03:14:35 GMT 2025
------------------------------------------------------------------------

关闭哪吒探针 Agent 的 SSH 登录

Tue, 14 Jan 2025 00:00:00 GMT

背景

哪吒探针 Agent 的 SSH 登录默认是开启的，但是有时候我们需要关闭它，比如在某些情况下，我们需要关闭 SSH 登录，以防止被攻击。

关闭哪吒探针 Agent 的 SSH 登录

V0

编辑 /etc/systemd/system/nezha-agent.service

nano /etc/systemd/system/nezha-agent.service

在 ExecStart= 后加上 --disable-command-execute

重启Agent

systemctl daemon-reload
systemctl restart nezha-agent

V1

编辑 /opt/nezha/agent/config.yml
```
nano /opt/nezha/agent/config.yml
```
在 disable_command_execute 参数改为 true
重启Agent
```
systemctl restart nezha-agent
```

使用 Alice DNS 解锁服务器访问限制

Mon, 13 Jan 2025 00:00:00 GMT

背景

由于某些国家或者地区的服务器(比如香港地区)有很多服务无法正常访问，可以通过使用 Alice DNS 解锁。

配置

# 查看当前 DNS
cat /etc/resolv.conf

# 设置 DNS 为 Alice DNS 的 DNS IP
echo -e "nameserver 154.12.177.22\nnameserver 1.1.1.1" | sudo tee /etc/resolv.conf > /dev/null

配置优化

默认情况下，所有网站都走了 Alice DNS 解析，但是我们只需要访问我们服务器未解锁的服务时才走 Alice DNS 解析，其他网站还是走默认的 DNS 解析。所以需要配置 DNS 分流。

# 一键分流脚本
wget https://raw.githubusercontent.com/Jimmyzxk/DNS-Alice-Unlock/refs/heads/main/dns-unlock.sh && bash dns-unlock.sh

# 检测脚本
bash <(curl -L -s media.ispvps.com)

解锁前

ipv4

 ** 正在测试IPv4解锁情况 
--------------------------------
 ** 您的网络为: Alibaba (8.218.*.*) 


============[ Multination ]============
 Dazn:                                  Unsupport
 TikTok:                                Failed
 Disney+:                               No
 Netflix:               原生解锁        Originals Only (Region: SG)
 YouTube Premium:       原生解锁        Yes (Region: HK)
 Amazon Prime Video:    原生解锁        Yes (Region: HK)
 TVBAnywhere+:                          No
 iQyi Oversea Region:   原生解锁        HK
 YouTube CDN:                           Hong Kong 
 Netflix Preferred CDN:                 Hong Kong  
 Spotify Registration:                  No
 Steam Currency:                        HKD
 ChatGPT:               原生解锁        APP Only (Region: HK)
 Google Gemini:                         No
 Bing Region:                           HK
 Wikipedia Editability:                 No
 Instagram Licensed Audio:              Failed
 ---Forum---
 Reddit:                                No
=======================================

ipv6

** 正在测试IPv6解锁情况 
--------------------------------
 ** 您的网络为: Alibaba (240b:4001:278:*:*) 


============[ Multination ]============
 Dazn:                                  Failed (Network Connection)
 TikTok:                                Failed
 Disney+:                               No
 Netflix:               原生解锁        Originals Only (Region: SG)
 YouTube Premium:       原生解锁        Yes (Region: HK)
 Amazon Prime Video:                    Unsupported
 TVBAnywhere+:                          Failed (Network Connection)
 iQyi Oversea Region:                   Failed
 YouTube CDN:                           Hong Kong 
 Netflix Preferred CDN:                 Hong Kong  
 Spotify Registration:                  No
 Steam Currency:                        Failed (Network Connection)
 ChatGPT:                               Failed
 Google Gemini:                         No
 Bing Region:                           HK
 Wikipedia Editability:                 No
 Instagram Licensed Audio:              Failed
 ---Forum---
 Reddit:                                No
=======================================

解锁后

ipv4

 ** 正在测试IPv4解锁情况 
--------------------------------
 ** 您的网络为: Alibaba (8.218.*.*) 


============[ Multination ]============
 Dazn:                                  No
 TikTok:                DNS 解锁        Yes (Region: SG)
 Disney+:               DNS 解锁        Yes (Region: SG)
 Netflix:               DNS 解锁        Yes (Region: SG)
 YouTube Premium:       原生解锁        Yes (Region: HK)
 Amazon Prime Video:    原生解锁        Yes (Region: HK)
 TVBAnywhere+:                          No
 iQyi Oversea Region:   原生解锁        HK
 YouTube CDN:                           Hong Kong 
 Netflix Preferred CDN:                 Associated with [Alice Networks] in [Hong Kong ]
 Spotify Registration:                  No
 Steam Currency:                        HKD
 ChatGPT:               DNS 解锁        Yes (Region: SG)
 Google Gemini:         DNS 解锁        Yes (Region: SGP)
 Bing Region:                           HK
 Wikipedia Editability:                 No
 Instagram Licensed Audio:              Failed
 ---Forum---
 Reddit:                                No
=======================================

ipv6

 ** 正在测试IPv6解锁情况 
--------------------------------
 ** 您的网络为: Alibaba (240b:4001:278:*:*) 


============[ Multination ]============
 Dazn:                                  Failed (Network Connection)
 TikTok:                DNS 解锁        Yes (Region: SG)
 Disney+:                               No
 Netflix:                               Failed (Network Connection)
 YouTube Premium:       原生解锁        Yes (Region: HK)
 Amazon Prime Video:                    Unsupported
 TVBAnywhere+:                          Failed (Network Connection)
 iQyi Oversea Region:                   Failed
 YouTube CDN:                           Hong Kong 
 Netflix Preferred CDN:                 Associated with [] in [Hong Kong ]
 Spotify Registration:                  No
 Steam Currency:                        Failed (Network Connection)
 ChatGPT:                               Failed
 Google Gemini:                         No
 Bing Region:                           HK
 Wikipedia Editability:                 No
 Instagram Licensed Audio:              Failed
 ---Forum---
 Reddit:                                Failed (Network Connection)
=======================================

ClawCloud 香港机器留档测试

Fri, 10 Jan 2025 00:00:00 GMT

机器详情

CPU 1 vCPU
内存 1 GiB
存储 20 GiB
带宽 1000 Mbps
流量 500 GB

IP Check

bash <(curl -Ls IP.Check.Place)

详情

########################################################################
                    IP质量体检报告(Lite)：8.218.*.*
                    bash <(curl -sL IP.Check.Place)
                   https://github.com/xykt/IPQuality
        报告时间：2025-04-11 10:24:12 CST  脚本版本：v2025-03-25
########################################################################
一、基础信息（IPinfo 数据库）
自治系统号：            ASAS45102
组织：                  Alibaba (US) Technology Co., Ltd.
坐标：                  114°10′29″E, 22°16′42″N
地图：                  https://check.place/22.2783,114.1747,12,cn
城市：                  Hong Kong, 999077
使用地：                [HK]Hong Kong, Asia
注册地：                [SG]Singapore
IP类型：                 广播IP 
二、IP类型属性
数据库：      IPinfo      ipapi    IP2LOCATION 
使用类型：     机房        机房        机房    
公司类型：     机房        机房    
三、风险评分
风险等级：      极低         低       中等       高         极高
SCAMALYTICS：      7|低风险
ipapi：               0.62%|低风险
Cloudflare：   0|低风险
DB-IP：         |低风险
四、风险因子
库： IP2LOCATION ipapi SCAMALYTICS IPinfo IPWHOIS
地区：    [HK]    [HK]    [HK]    [HK]    [HK]
代理：     否      否      否      否      否 
Tor：      否      否      否      否      否 
VPN：      否      是      否      否      否 
服务器：   是      是      否      是      是 
滥用：     否      否      无      无      无 
机器人：   否      否      否      无      无 
五、流媒体及AI服务解锁检测
服务商：  TikTok   Disney+  Netflix Youtube  AmazonPV  Spotify  ChatGPT 
状态：     失败     屏蔽     解锁     解锁     解锁     屏蔽     仅APP  
地区：                       [SG]     [HK]     [HK]              [HK]   
方式：                       原生     原生     原生              原生   
六、邮局连通性及黑名单检测
本地25端口：阻断
IP地址黑名单数据库：  有效 439   正常 425   已标记 13   黑名单 1
========================================================================
今日IP检测量：124；总检测量：175230。感谢使用xy系列脚本！ 

########################################################################
             IP质量体检报告(Lite)：240b:4001:278:*:*:*:*:*
                    bash <(curl -sL IP.Check.Place)
                   https://github.com/xykt/IPQuality
        报告时间：2025-04-11 10:24:12 CST  脚本版本：v2025-03-25
########################################################################
一、基础信息（IPinfo 数据库）
自治系统号：            ASAS45102
组织：                  Alibaba (US) Technology Co., Ltd.
坐标：                  114°10′29″E, 22°16′42″N
地图：                  https://check.place/22.2783,114.1747,12,cn
城市：                  Hong Kong, 999077
使用地：                [HK]Hong Kong, Asia
注册地：                [SG]Singapore
IP类型：                 广播IP 
二、IP类型属性
数据库：      IPinfo      ipapi    IP2LOCATION 
使用类型：     机房        机房        机房    
公司类型：     机房        机房    
三、风险评分
风险等级：      极低         低       中等       高         极高
SCAMALYTICS：                 25|中风险
ipapi：    0.00%|极低风险
Cloudflare：   0|低风险
四、风险因子
库： IP2LOCATION ipapi SCAMALYTICS IPinfo IPWHOIS
地区：    [SG]    [HK]    [HK]    [HK]    [HK]
代理：     否      否      否      否      否 
Tor：      否      否      否      否      否 
VPN：      否      否      否      否      否 
服务器：   是      是      否      是      否 
滥用：     否      否      无      无      无 
机器人：   否      否      否      无      无 
五、流媒体及AI服务解锁检测
服务商：  TikTok   Disney+  Netflix Youtube  AmazonPV  Spotify  ChatGPT 
状态：     失败     屏蔽     解锁     解锁     屏蔽     屏蔽     失败   
地区：                       [SG]     [HK]                              
方式：                       原生     原生                              
六、邮局连通性及黑名单检测
本地25端口：阻断
========================================================================
今日IP检测量：125；总检测量：175231。感谢使用xy系列脚本！

融合怪

一键脚本

::github{repo="spiritLHLS/ecs"}

curl -L https://gitlab.com/spiritysdx/za/-/raw/main/ecs.sh -o ecs.sh && chmod +x ecs.sh && bash ecs.sh

详情

--------------------- A Bench Script By spiritlhl ----------------------
                   测评频道: https://t.me/vps_reviews                    
VPS融合怪版本：2025.01.02
Shell项目地址：https://github.com/spiritLHLS/ecs
Go项目地址：https://github.com/oneclickvirt/ecs
---------------------基础信息查询--感谢所有开源项目---------------------
 CPU 型号          : Intel(R) Xeon(R) Platinum
 CPU 核心数        : 1
 CPU 频率          : 2500.002 MHz
 CPU 缓存          : L1: 32.00 KB / L2: 1.00 MB / L3: 33.00 MB
 AES-NI指令集      : ✔ Enabled
 VM-x/AMD-V支持    : ❌ Disabled
 内存              : 122.68 MiB / 923.82 MiB
 Swap              : [ no swap partition or swap file detected ]
 硬盘空间          : 908.56 MiB / 19990.38 MiB
 启动盘路径        : /dev/vda1
 系统在线时间      : 0 days, 0 hour 3 min
 负载              : 0.37, 0.17, 0.06
 系统              : Debian GNU/Linux 12 (bookworm) (x86_64)
 架构              : x86_64 (64 Bit)
 内核              : 6.1.0-28-cloud-amd64
 TCP加速方式       : cubic
 虚拟化架构        : KVM
 NAT类型           : Full Cone
 IPV4 ASN          : AS45102 Alibaba (US) Technology Co., Ltd.
 IPV4 位置         : Hong Kong / Hong Kong / HK
 IPV6 ASN          : AS45102 Alibaba
 IPV6 位置         : Hong Kong / Hong Kong
 IPV6 子网掩码     : 128
----------------------CPU测试--通过sysbench测试-------------------------
 -> CPU 测试中 (Fast Mode, 1-Pass @ 5sec)
 1 线程测试(单核)得分:          1056 Scores
---------------------内存测试--感谢lemonbench开源-----------------------
 -> 内存测试 Test (Fast Mode, 1-Pass @ 5sec)
 单线程读测试:          4976.04 MB/s
 单线程写测试:          4631.54 MB/s
------------------磁盘dd读写测试--感谢lemonbench开源--------------------
 -> 磁盘IO测试中 (4K Block/1M Block, Direct Mode)
 测试操作               写速度                                  读速度
 100MB-4K Block         26.4 MB/s (6450 IOPS, 3.97s)            37.7 MB/s (9208 IOPS, 2.78s)
 1GB-1M Block           232 MB/s (221 IOPS, 4.52s)              209 MB/s (199 IOPS, 5.02s)
-------------IP质量检测--基于oneclickvirt/securityCheck使用-------------
数据仅作参考，不代表100%准确，如果和实际情况不一致请手动查询多个数据库比对
以下为各数据库编号，输出结果后将自带数据库来源对应的编号
ipinfo数据库  [0] | scamalytics数据库 [1] | virustotal数据库   [2] | abuseipdb数据库   [3] | ip2location数据库    [4]
ip-api数据库  [5] | ipwhois数据库     [6] | ipregistry数据库   [7] | ipdata数据库      [8] | db-ip数据库          [9]
ipapiis数据库 [A] | ipapicom数据库    [B] | bigdatacloud数据库 [C] | cheervision数据库 [D] | ipqualityscore数据库 [E]
IPV4:
安全得分:
声誉(越高越好): 0 [2] 
信任得分(越高越好): 0 [8] 
VPN得分(越低越好): 100 [8] 
代理得分(越低越好): 100 [8] 
社区投票-无害: 0 [2] 
社区投票-恶意: 0 [2] 
威胁得分(越低越好): 100 [8]
欺诈得分(越低越好): 65 [E] 4 [1]
滥用得分(越低越好): 0 [3] 
ASN滥用得分(越低越好): 0.0011 (Low) [A] 
公司滥用得分(越低越好): 0.0045 (Low) [A] 
威胁级别: low [9 B] 
黑名单记录统计:(有多少黑名单网站有记录):
无害记录数: 0 [2]  恶意记录数: 0 [2]  可疑记录数: 0 [2]  无记录数: 94 [2]  
安全信息:
使用类型: hosting [0 7 9 A] DataCenter/WebHosting/Transit [3] hosting - high probability [C] business [8]
公司类型: hosting [0 7 A] 
是否云提供商: Yes [7 D] 
是否数据中心: Yes [0 1 5 6 A C] No [8]
是否移动设备: No [5 A C] Yes [E]
是否代理: Yes [E] No [0 1 4 5 6 7 8 9 A B C D]
是否VPN: No [0 1 6 7 C D] Yes [A E]
是否TorExit: No [1 7 D] 
是否Tor出口: No [1 7 D] 
是否网络爬虫: No [9 A B E] 
是否匿名: No [1 6 7 8 D] 
是否攻击者: No [7 8 D] 
是否滥用者: No [7 8 A C D E] 
是否威胁: No [7 8 C D] 
是否中继: No [0 7 8 C D] 
是否Bogon: No [7 8 A C D] 
是否机器人: No [E] 
DNS-黑名单: 314(Total_Check) 0(Clean) 7(Blacklisted) 23(Other) 
IPV6:
安全得分:
欺诈得分(越低越好): 4 [1]
滥用得分(越低越好): 0 [3] 
ASN滥用得分(越低越好): 0.0011 (Low) [A] 
公司滥用得分(越低越好): 0.0045 (Low) [A] 
威胁级别: low [B] 
安全信息:
使用类型: hosting [A] DataCenter/WebHosting/Transit [3]
公司类型: hosting [A] 
是否云提供商: Yes [D] 
是否数据中心: Yes [1 A] 
是否移动设备: No [A] 
是否代理: No [1 A B D] 
是否VPN: Yes [A] No [1 D]
是否Tor: No [1 3 A B D] 
是否Tor出口: No [1 D] 
是否网络爬虫: No [A B] 
是否匿名: No [1 D] 
是否攻击者: No [D] 
是否滥用者: No [A D] 
是否威胁: No [D] 
是否中继: No [D] 
是否Bogon: No [A D] 
DNS-黑名单: 314(Total_Check) 0(Clean) 0(Blacklisted) 314(Other) 
Google搜索可行性：YES
-------------邮件端口检测--基于oneclickvirt/portchecker开源-------------
Platform  SMTP  SMTPS POP3  POP3S IMAP  IMAPS
LocalPort ✔     ✔     ✔     ✔     ✔     ✔    
QQ        ✘     ✔     ✔     ✘     ✔     ✘    
163       ✘     ✔     ✔     ✘     ✔     ✘    
Sohu      ✘     ✔     ✘     ✘     ✔     ✘    
Yandex    ✘     ✔     ✔     ✘     ✔     ✘    
Gmail     ✘     ✔     ✘     ✘     ✘     ✘    
Outlook   ✘     ✘     ✔     ✘     ✔     ✘    
Office365 ✘     ✘     ✔     ✘     ✔     ✘    
Yahoo     ✘     ✔     ✘     ✘     ✘     ✘    
MailCOM   ✘     ✔     ✔     ✘     ✔     ✘    
MailRU    ✘     ✔     ✘     ✘     ✔     ✘    
AOL       ✘     ✔     ✘     ✘     ✘     ✘    
GMX       ✘     ✘     ✔     ✘     ✔     ✘    
Sina      ✘     ✔     ✔     ✘     ✔     ✘    
-----------------------全国延迟检测--本脚本原创-------------------------
 联通福州          21  | 联通南充          45  | 联通天津          38  |
 联通太原          43  | 联通大连          53  | 联通上海          27  |
 联通WuXi          32  | 电信长沙          26  | 电信扬州          31  |
 电信杭州          31  | 电信宁波          34  | 电信苏州          44  |
 电信武汉          47  | 电信南京          44  | 电信Zhenjiang     47  |
 移动杭州          34  | 移动成都          58  | 移动福州          57  |
 移动Beijing       45  |
--------------------自动更新测速节点列表--本脚本原创--------------------
位置             上传速度        下载速度        延迟
Speedtest.net    188.01Mbps      1109.82Mbps     2.06ms
中国香港         207.89Mbps      1105.75Mbps     3.87ms
联通WuXi         12.79Mbps       87.57Mbps       32.43ms
电信浙江         8.80Mbps        97.76Mbps       35.76ms
电信浙江         7.20Mbps        135.07Mbps      32.30ms
移动杭州5G       17.59Mbps       217.70Mbps      34.52ms
移动Beijing      19.32Mbps       222.46Mbps      47.91ms
------------------------------------------------------------------------
 总共花费      : 5 分 24 秒
 时间          : Fri Jan 10 09:49:21 UTC 2025
------------------------------------------------------------------------

ClawCloud 加利福尼亚机器留档测试

Thu, 09 Jan 2025 00:00:00 GMT

机器详情

CPU 1 vCPU
内存 1 GiB
存储 20 GiB
带宽 200 Mbps
流量 500 GB

IP Check

bash <(curl -Ls IP.Check.Place)

详情

########################################################################
                       IP质量体检报告：47.251.*.*
                    bash <(curl -sL IP.Check.Place)
                   https://github.com/xykt/IPQuality
        报告时间：2025-04-11 10:30:42 CST  脚本版本：v2025-03-25
########################################################################
一、基础信息（Maxmind 数据库）
自治系统号：            AS45102
组织：                  Alibaba US Technology Co., Ltd.
坐标：                  121°57′16″W, 37°21′11″N
地图：                  https://check.place/37.353,-121.9544,15,cn
城市：                  加州, 圣克拉拉, 95052
使用地：                [US]美国, [NA]北美洲
注册地：                [US]美国
时区：                  America/Los_Angeles
IP类型：                 原生IP 
二、IP类型属性
数据库：      IPinfo    ipregistry    ipapi     AbuseIPDB  IP2LOCATION 
使用类型：     机房        机房        机房        机房        机房    
公司类型：     机房        机房        机房    
三、风险评分
风险等级：      极低         低       中等       高         极高
SCAMALYTICS：                 25|中风险
ipapi：                            1.94%|较高风险
AbuseIPDB：    0|低风险
IPQS：                        75|可疑IP
Cloudflare：   0|低风险
DB-IP：         |低风险
四、风险因子
库： IP2LOCATION ipapi ipregistry IPQS SCAMALYTICS ipdata IPinfo IPWHOIS
地区：    [US]    [US]    [US]    [US]    [US]    [US]    [US]    [US]
代理：     否      否      否      是      否      否      否      否 
Tor：      否      否      否      否      否      否      否      否 
VPN：      否      是      否      是      否      无      否      否 
服务器：   是      是      是      无      否      否      是      是 
滥用：     否      否      否      否      无      否      无      无 
机器人：   否      否      无      否      否      无      无      无 
五、流媒体及AI服务解锁检测
服务商：  TikTok   Disney+  Netflix Youtube  AmazonPV  Spotify  ChatGPT 
状态：     解锁     屏蔽     解锁     解锁     解锁     屏蔽     解锁   
地区：     [US]              [US]     [US]     [US]              [US]   
方式：     原生              原生     原生     原生              原生   
六、邮局连通性及黑名单检测
本地25端口：阻断
IP地址黑名单数据库：  有效 439   正常 425   已标记 14   黑名单 0
========================================================================
今日IP检测量：133；总检测量：175239。感谢使用xy系列脚本！ 
报告链接：https://Report.Check.Place/IP/7LKO1GB7S.svg

########################################################################
                IP质量体检报告：240b:4004:108:*:*:*:*:*
                    bash <(curl -sL IP.Check.Place)
                   https://github.com/xykt/IPQuality
        报告时间：2025-04-11 10:30:42 CST  脚本版本：v2025-03-25
########################################################################
一、基础信息（Maxmind 数据库）
自治系统号：            AS45102
组织：                  Alibaba US Technology Co., Ltd.
坐标：                  118°14′38″W, 34°3′16″N
地图：                  https://check.place/34.0544,-118.244,13,cn
城市：                  加州
使用地：                [US]美国, [NA]北美洲
注册地：                [SG]新加坡
时区：                  America/Los_Angeles
IP类型：                 广播IP 
二、IP类型属性
数据库：      IPinfo    ipregistry    ipapi     AbuseIPDB  IP2LOCATION 
使用类型：     机房        机房        机房        机房        机房    
公司类型：     机房        机房        机房    
三、风险评分
风险等级：      极低         低       中等       高         极高
SCAMALYTICS：                 25|中风险
ipapi：    0.00%|极低风险
AbuseIPDB：    0|低风险
IPQS：                        75|可疑IP
Cloudflare：   0|低风险
DB-IP：         |低风险
四、风险因子
库： IP2LOCATION ipapi ipregistry IPQS SCAMALYTICS ipdata IPinfo IPWHOIS
地区：    [US]    [US]    [US]    [US]    [US]    [US]    [US]    [US]
代理：     否      否      否      是      否      否      否      否 
Tor：      否      否      否      否      否      否      否      否 
VPN：      否      否      否      是      否      无      否      否 
服务器：   是      是      是      无      否      否      是      否 
滥用：     否      否      否      否      无      否      无      无 
机器人：   否      否      无      否      否      无      无      无 
五、流媒体及AI服务解锁检测
服务商：  TikTok   Disney+  Netflix Youtube  AmazonPV  Spotify  ChatGPT 
状态：     失败     屏蔽     解锁     解锁     屏蔽     屏蔽     失败   
地区：                       [SG]     [US]                              
方式：                       原生     原生                              
六、邮局连通性及黑名单检测
本地25端口：阻断
========================================================================
今日IP检测量：135；总检测量：175241。感谢使用xy系列脚本！ 
报告链接：https://Report.Check.Place/IP/3VYFB1EIX.svg

融合怪

一键脚本

::github{repo="spiritLHLS/ecs"}

curl -L https://gitlab.com/spiritysdx/za/-/raw/main/ecs.sh -o ecs.sh && chmod +x ecs.sh && bash ecs.sh

详情

--------------------- A Bench Script By spiritlhl ----------------------
                   测评频道: https://t.me/vps_reviews                    
VPS融合怪版本：2025.01.02
Shell项目地址：https://github.com/spiritLHLS/ecs
Go项目地址：https://github.com/oneclickvirt/ecs
---------------------基础信息查询--感谢所有开源项目---------------------
 CPU 型号          : Intel(R) Xeon(R) Platinum
 CPU 核心数        : 1
 CPU 频率          : 2499.998 MHz
 CPU 缓存          : L1: 32.00 KB / L2: 1.00 MB / L3: 33.00 MB
 AES-NI指令集      : ✔ Enabled
 VM-x/AMD-V支持    : ❌ Disabled
 内存              : 136.08 MiB / 923.82 MiB
 Swap              : [ no swap partition or swap file detected ]
 硬盘空间          : 911.32 MiB / 19990.38 MiB
 启动盘路径        : /dev/vda1
 系统在线时间      : 0 days, 0 hour 18 min
 负载              : 0.79, 0.30, 0.13
 系统              : Debian GNU/Linux 12 (bookworm) (x86_64)
 架构              : x86_64 (64 Bit)
 内核              : 6.1.0-28-cloud-amd64
 TCP加速方式       : bbr
 虚拟化架构        : KVM
 NAT类型           : Full Cone
 IPV4 ASN          : AS45102 Alibaba (US) Technology Co., Ltd.
 IPV4 位置         : San Jose / California / US
 IPV6 ASN          : AS45102 Alibaba
 IPV6 位置         : California / United States
----------------------CPU测试--通过sysbench测试-------------------------
 -> CPU 测试中 (Fast Mode, 1-Pass @ 5sec)
 1 线程测试(单核)得分:          1058 Scores
---------------------内存测试--感谢lemonbench开源-----------------------
 -> 内存测试 Test (Fast Mode, 1-Pass @ 5sec)
 单线程读测试:          21311.86 MB/s
 单线程写测试:          13920.52 MB/s
------------------磁盘dd读写测试--感谢lemonbench开源--------------------
 -> 磁盘IO测试中 (4K Block/1M Block, Direct Mode)
 测试操作               写速度                                  读速度
 100MB-4K Block         23.5 MB/s (5744 IOPS, 4.46s)            30.9 MB/s (7543 IOPS, 3.39s)
 1GB-1M Block           232 MB/s (221 IOPS, 4.52s)              209 MB/s (199 IOPS, 5.02s)
---------------------磁盘fio读写测试--感谢yabs开源----------------------
Block Size | 4k            (IOPS) | 64k           (IOPS)
  ------   | ---            ----  | ----           ---- 
Read       | 20.67 MB/s    (5.1k) | 96.32 MB/s    (1.5k)
Write      | 20.69 MB/s    (5.1k) | 96.82 MB/s    (1.5k)
Total      | 41.37 MB/s   (10.3k) | 193.15 MB/s   (3.0k)
           |                      |                     
Block Size | 512k          (IOPS) | 1m            (IOPS)
  ------   | ---            ----  | ----           ---- 
Read       | 91.71 MB/s     (179) | 90.84 MB/s      (88)
Write      | 96.58 MB/s     (188) | 96.89 MB/s      (94)
Total      | 188.30 MB/s    (367) | 187.74 MB/s    (182)
------------流媒体解锁--基于oneclickvirt/CommonMediaTests开源-----------
以下测试的解锁地区是准确的，但是不是完整解锁的判断可能有误，这方面仅作参考使用
----------------Netflix-----------------
[IPV4]
您的出口IP可以使用Netflix，但仅可看Netflix自制剧
NF所识别的IP地域信息：美国
[IPV6]
您的出口IP可以使用Netflix，但仅可看Netflix自制剧
NF所识别的IP地域信息：新加坡
----------------Youtube-----------------
[IPV4]
连接方式: Youtube Video Server
视频缓存节点地域: 美国  旧金山(SFO03S22)
[IPV6]
连接方式: Youtube Video Server
视频缓存节点地域: NUQ(NUQ04S38)
---------------DisneyPlus---------------
[IPV4]
当前出口所在地区解锁DisneyPlus
区域：US 区
[IPV6]
当前出口所在地区解锁DisneyPlus
区域：US 区
解锁Netflix，Youtube，DisneyPlus上面和下面进行比较，不同之处自行判断
----------------流媒体解锁--感谢RegionRestrictionCheck开源--------------
 以下为IPV4网络测试，若无IPV4网络则无输出
============[ Multination ]============
 Dazn:                                  Failed (Error: )
 Disney+:                               No (IP Banned By Disney+ 1)
 Netflix:                               Originals Only
 YouTube Premium:                       Yes (Region: US)
 Amazon Prime Video:                    Yes (Region: US)
 TVBAnywhere+:                          Yes
 Spotify Registration:                  Yes (Region: US)
 OneTrust Region:                       US [California]
 iQyi Oversea Region:                   US
 Bing Region:                           US
 YouTube CDN:                           San Francisco, CA
 Netflix Preferred CDN:                 San Jose, CA
 ChatGPT:                               Yes
 Google Gemini:                         Yes (Region: USA)
 Wikipedia Editability:                 No
 Google Play Store:                     United States 
 Google Search CAPTCHA Free:            Yes
 Steam Currency:                        USD
 ---Forum---
 Reddit:                                No
=======================================
 以下为IPV6网络测试，若无IPV6网络则无输出
============[ Multination ]============
 Dazn:                                  IPv6 Is Not Currently Supported
 Disney+:                               IPv6 Is Not Currently Supported
 Netflix:                               Originals Only
 YouTube Premium:                       Yes (Region: US)
 Amazon Prime Video:                    IPv6 Is Not Currently Supported
 TVBAnywhere+:                          IPv6 Is Not Currently Supported
 Spotify Registration:                  Yes (Region: US)
 OneTrust Region:                       US [California]
 iQyi Oversea Region:                   IPv6 Is Not Currently Supported
 Bing Region:                           US
 YouTube CDN:                           Mountain View
 Netflix Preferred CDN:                 Seattle, WA
 ChatGPT:                               Failed (Network Connection)
 Google Gemini:                         Yes (Region: USA)
 Wikipedia Editability:                 No
 Google Play Store:                     United States 
 Google Search CAPTCHA Free:            Yes
 Steam Currency:                        IPv6 Is Not Currently Supported
 ---Forum---
 Reddit:                                IPv6 Is Not Currently Supported
=======================================
---------------TikTok解锁--感谢lmc999的源脚本及fscarmen PR--------------
 Tiktok Region:         【US】
-------------IP质量检测--基于oneclickvirt/securityCheck使用-------------
数据仅作参考，不代表100%准确，如果和实际情况不一致请手动查询多个数据库比对
以下为各数据库编号，输出结果后将自带数据库来源对应的编号
ipinfo数据库  [0] | scamalytics数据库 [1] | virustotal数据库   [2] | abuseipdb数据库   [3] | ip2location数据库    [4]
ip-api数据库  [5] | ipwhois数据库     [6] | ipregistry数据库   [7] | ipdata数据库      [8] | db-ip数据库          [9]
ipapiis数据库 [A] | ipapicom数据库    [B] | bigdatacloud数据库 [C] | cheervision数据库 [D] | ipqualityscore数据库 [E]
IPV4:
安全得分:
声誉(越高越好): 0 [2] 
信任得分(越高越好): 0 [8] 
VPN得分(越低越好): 100 [8] 
代理得分(越低越好): 100 [8] 
社区投票-无害: 0 [2] 
社区投票-恶意: 0 [2] 
威胁得分(越低越好): 100 [8] 
欺诈得分(越低越好): 65 [E] 17 [1]
滥用得分(越低越好): 0 [3] 
ASN滥用得分(越低越好): 0.0011 (Low) [A] 
公司滥用得分(越低越好): 0.0183 (Elevated) [A] 
威胁级别: low [9 B] 
黑名单记录统计:(有多少黑名单网站有记录):
无害记录数: 0 [2]  恶意记录数: 0 [2] 可疑记录数: 0 [2]  无记录数: 94 [2]  
安全信息:
使用类型: DataCenter/WebHosting/Transit [3] business [8] hosting [0 7 9 A] hosting - high probability [C]
公司类型: hosting [0 7] business [A]
是否云提供商: Yes [7 D] 
是否数据中心: No [8] Yes [0 1 5 6 A C]
是否移动设备: Yes [E] No [5 A C]
是否代理: No [0 1 4 5 6 7 8 9 A B C D] Yes [E]
是否VPN: No [0 1 6 7 C D] Yes [A E]
是否Tor: No [0 1 3 6 7 8 A B C D E] 
是否Tor出口: No [1 7 D] 
是否网络爬虫: No [9 A B E]
是否匿名: No [1 6 7 8 D] 
是否攻击者: No [7 8 D] 
是否滥用者: No [7 8 A C D E] 
是否威胁: No [7 8 C D] 
是否中继: No [0 7 8 C D] 
是否Bogon: No [7 8 A C D] 
是否机器人: No [E] 
DNS-黑名单: 314(Total_Check) 0(Clean) 5(Blacklisted) 18(Other) 
IPV6:
安全得分:
欺诈得分(越低越好): 13 [1] 
滥用得分(越低越好): 0 [3]
ASN滥用得分(越低越好): 0.0011 (Low) [A] 
公司滥用得分(越低越好): 0 (Very Low) [A] 
威胁级别: low [B] 
安全信息:
使用类型: hosting [A] DataCenter/WebHosting/Transit [3]
公司类型: hosting [A] 
是否云提供商: Yes [D] 
是否数据中心: Yes [1 A] 
是否移动设备: No [A] 
是否代理: No [1 A B D] 
是否VPN: No [1 A D] 
是否Tor: No [1 3 A B D] 
是否Tor出口: No [1 D] 
是否网络爬虫: No [A B] 
是否匿名: No [1 D] 
是否攻击者: No [D]
是否滥用者: No [A D] 
是否威胁: No [D] 
是否中继: No [D] 
是否Bogon: No [A D] 
DNS-黑名单: 314(Total_Check) 0(Clean) 0(Blacklisted) 314(Other) 
Google搜索可行性：NO
-------------邮件端口检测--基于oneclickvirt/portchecker开源-------------
Platform  SMTP  SMTPS POP3  POP3S IMAP  IMAPS
LocalPort ✔     ✔     ✔     ✔     ✔     ✔    
QQ        ✘     ✔     ✔     ✘     ✘     ✘    
163       ✘     ✘     ✘     ✘     ✘     ✘    
Sohu      ✘     ✔     ✘     ✘     ✘     ✘    
Yandex    ✘     ✘     ✘     ✘     ✘     ✘    
Gmail     ✘     ✘     ✘     ✘     ✘     ✘    
Outlook   ✘     ✘     ✔     ✘     ✘     ✘    
Office365 ✘     ✘     ✘     ✘     ✘     ✘    
Yahoo     ✘     ✔     ✘     ✘     ✘     ✘    
MailCOM   ✘     ✔     ✘     ✘     ✘     ✘    
MailRU    ✘     ✔     ✘     ✘     ✘     ✘    
AOL       ✘     ✘     ✘     ✘     ✘     ✘    
GMX       ✘     ✘     ✘     ✘     ✘     ✘    
Sina      ✘     ✘     ✘     ✘     ✘     ✘    
----------------三网回程--基于oneclickvirt/backtrace开源----------------
北京电信 219.141.140.10  电信163    [普通线路] 
北京联通 202.106.195.68  联通4837   [普通线路] 
北京移动 221.179.155.161 移动CMI    [普通线路] 
上海电信 202.96.209.133  检测不到回程路由节点的IP地址
上海联通 210.22.97.1     联通4837   [普通线路] 
上海移动 211.136.112.200 移动CMI    [普通线路] 
广州电信 58.60.188.222   检测不到回程路由节点的IP地址
广州联通 210.21.196.6    联通4837   [普通线路] 
广州移动 120.196.165.24  移动CMI    [普通线路] 
成都电信 61.139.2.69     检测不到回程路由节点的IP地址
成都联通 119.6.6.6       联通4837   [普通线路] 
成都移动 211.137.96.205  移动CMI    [普通线路] 
准确线路自行查看详细路由，本测试结果仅作参考
同一目标地址多个线路时，可能检测已越过汇聚层，除了第一个线路外，后续信息可能无效
---------------------回程路由--感谢fscarmen开源及PR---------------------
依次测试电信/联通/移动经过的地区及线路，核心程序来自ipip.net或nexttrace，请知悉!
广州电信 58.60.188.222
1.21 ms         * DOD
2.83 ms         * DOD
1.17 ms         * DOD
3.84 ms         * 新加坡 阿里云
3.36 ms         AS4134 [CHINANET-US] 美国 加利福尼亚 山景城 www.chinatelecom.com.cn 电信
160.74 ms       AS4134 [CHINANET-BB] 中国 广东 广州 www.chinatelecom.com.cn 电信
159.20 ms       AS4134 [CHINANET-BB] 中国 广东 广州 www.chinatelecom.com.cn 电信
154.34 ms       AS4134 中国 广东 深圳 福田区 www.chinatelecom.com.cn 电信
广州联通 210.21.196.6
1.59 ms         * DOD
2.71 ms         * DOD
1.93 ms         * RFC1918
2.31 ms         * 美国 加利福尼亚 圣何塞 阿里云
103.08 ms       AS6453 [SQNC3-TATAC] 美国 加利福尼亚 圣何塞 tatacommunications.com
2.51 ms         AS6453 美国 加利福尼亚 圣何塞 tatacommunications.com
174.74 ms       AS4837 [CU169-BACKBONE] 中国 北京 chinaunicom.cn 联通
171.81 ms       AS4837 [CU169-BACKBONE] 中国 北京 chinaunicom.cn 联通
172.92 ms       AS4837 [CU169-BACKBONE] 中国 北京 chinaunicom.cn 联通
207.49 ms       AS17816 [UNICOM-GD] 中国 广东 深圳 chinaunicom.cn 联通
423.62 ms       AS17623 [APNIC-AP] 中国 广东 深圳 chinaunicom.cn 联通
208.22 ms       AS17623 中国 广东 深圳 宝安区 chinaunicom.cn 联通
广州移动 120.196.165.24
1.28 ms         * DOD
2.52 ms         * DOD
1.32 ms         * RFC1918
2.42 ms         * RFC1918
1.52 ms         AS2914 [NTTA-128] 美国 加利福尼亚 圣何塞 gin.ntt.net
1.43 ms         AS2914 [NTT-BACKBONE] 美国 加利福尼亚 圣何塞 gin.ntt.net
159.68 ms       AS2914 [NTT-BACKBONE] 中国 香港 gin.ntt.net
169.85 ms       AS58453 [CMI-INT] 中国 广东 广州 cmi.chinamobile.com 移动
169.41 ms       AS9808 [CMNET] 中国 广东 广州 chinamobileltd.com 移动
169.73 ms       AS9808 [CMNET] 中国 广东 广州 I-C chinamobileltd.com 移动
276.74 ms       AS9808 [CMNET] 中国 广东 广州 chinamobileltd.com 移动
180.81 ms       AS9808 [CMNET] 中国 广东 广州 chinamobileltd.com 移动
177.66 ms       AS9808 [CMNET] 中国 广东 广州 chinamobileltd.com 移动
181.94 ms       AS56040 [APNIC-AP] 中国 广东 深圳 gd.10086.cn 移动
--------------------自动更新测速节点列表--本脚本原创--------------------
位置             上传速度        下载速度        延迟     丢包率
Speedtest.net    194.57 Mbps     194.89 Mbps     2.06     0.0%
洛杉矶           202.11 Mbps     194.83 Mbps     13.75    0.0%
日本东京         209.88 Mbps     23.52 Mbps      114.72   0.0%
联通WuXi         223.27 Mbps     225.79 Mbps     168.04   0.0%
电信浙江         224.60 Mbps     215.60 Mbps     153.56   NULL
电信Suzhou5G     127.19 Mbps     212.02 Mbps     142.70   NULL
------------------------------------------------------------------------
 总共花费      : 14 分 56 秒
 时间          : Thu Jan  9 15:42:45 CST 2025
------------------------------------------------------------------------

野草云香港机器留档测试

Wed, 08 Jan 2025 00:00:00 GMT

机器详情

CPU 1 vCPU
内存 1 GiB
存储 15 GiB
带宽 100 Mbps
流量 600 GB

IP Check

bash <(curl -Ls IP.Check.Place)

详情

########################################################################
                    IP质量体检报告(Lite)：83.229.*.*
                    bash <(curl -sL IP.Check.Place)
                   https://github.com/xykt/IPQuality
        报告时间：2025-04-11 10:34:19 CST  脚本版本：v2025-03-25
########################################################################
一、基础信息（IPinfo 数据库）
自治系统号：            ASAS139659
组织：                  LUCIDACLOUD LIMITED
坐标：                  114°14′60″E, 22°19′40″N
地图：                  https://check.place/22.3279,114.2499,12,cn
城市：                  Tseung Kwan O, 999077
使用地：                [HK]Hong Kong, Asia
注册地：                [HK]Hong Kong
IP类型：                 原生IP 
二、IP类型属性
数据库：      IPinfo      ipapi    IP2LOCATION 
使用类型：     机房        机房        机房    
公司类型：     机房        机房    
三、风险评分
风险等级：      极低         低       中等       高         极高
SCAMALYTICS：  0|低风险
ipapi：                            1.95%|较高风险
Cloudflare：   0|低风险
DB-IP：         |低风险
四、风险因子
库： IP2LOCATION ipapi SCAMALYTICS IPinfo IPWHOIS
地区：    [SG]    [HK]    [HK]    [HK]    [HK]
代理：     否      否      否      否      否 
Tor：      否      否      否      否      否 
VPN：      否      否      否      否      否 
服务器：   是      否      否      是      是 
滥用：     否      否      无      无      无 
机器人：   否      否      否      无      无 
五、流媒体及AI服务解锁检测
服务商：  TikTok   Disney+  Netflix Youtube  AmazonPV  Spotify  ChatGPT 
状态：     失败     解锁     解锁     中国     解锁     屏蔽     仅APP  
地区：              [SG]     [SG]     [CN]     [SG]              [HK]   
方式：              原生     原生              原生              原生   
六、邮局连通性及黑名单检测
本地25端口：阻断
IP地址黑名单数据库：  有效 439   正常 366   已标记 73   黑名单 0
========================================================================
今日IP检测量：141；总检测量：175247。感谢使用xy系列脚本！ 

########################################################################
             IP质量体检报告(Lite)：2001:df1:7880:*:*:*:*:*
                    bash <(curl -sL IP.Check.Place)
                   https://github.com/xykt/IPQuality
        报告时间：2025-04-11 10:34:19 CST  脚本版本：v2025-03-25
########################################################################
一、基础信息（IPinfo 数据库）
自治系统号：            ASAS139659
组织：                  LUCIDACLOUD LIMITED
坐标：                  114°14′55″E, 22°15′57″N
地图：                  https://check.place/22.2657,114.2487,12,cn
城市：                  Harmony Garden, 999077
使用地：                [HK]Hong Kong, Asia
注册地：                [HK]Hong Kong
IP类型：                 原生IP 
二、IP类型属性
数据库：      IPinfo      ipapi    IP2LOCATION 
使用类型：     机房        机房        机房    
公司类型：     家宽        机房    
三、风险评分
风险等级：      极低         低       中等       高         极高
SCAMALYTICS：  0|低风险
ipapi：    0.00%|极低风险
Cloudflare：   0|低风险
DB-IP：         |低风险
四、风险因子
库： IP2LOCATION ipapi SCAMALYTICS IPinfo IPWHOIS
地区：    [HK]    [HK]    [HK]    [HK]    [HK]
代理：     否      否      否      否      否 
Tor：      否      否      否      否      否 
VPN：      否      否      否      否      否 
服务器：   是      是      否      是      否 
滥用：     否      否      无      无      无 
机器人：   否      否      否      无      无 
五、流媒体及AI服务解锁检测
服务商：  TikTok   Disney+  Netflix Youtube  AmazonPV  Spotify  ChatGPT 
状态：     失败     解锁     解锁     中国     屏蔽     屏蔽     失败   
地区：              [HK]     [HK]     [CN]                              
方式：              原生     原生                                       
六、邮局连通性及黑名单检测
本地25端口：阻断
========================================================================
今日IP检测量：144；总检测量：175250。感谢使用xy系列脚本！

融合怪

一键脚本

::github{repo="spiritLHLS/ecs"}

curl -L https://gitlab.com/spiritysdx/za/-/raw/main/ecs.sh -o ecs.sh && chmod +x ecs.sh && bash ecs.sh

详情

--------------------- A Bench Script By spiritlhl ----------------------
                   测评频道: https://t.me/vps_reviews                    
VPS融合怪版本：2025.01.02
Shell项目地址：https://github.com/spiritLHLS/ecs
Go项目地址：https://github.com/oneclickvirt/ecs
---------------------基础信息查询--感谢所有开源项目---------------------
 CPU 型号          : Intel(R) Xeon(R) CPU E5-2698 v4 @ 2.20GHz
 CPU 核心数        : 1
 CPU 频率          : 2199.998 MHz
 CPU 缓存          : L1: 32.00 KB / L2: 4.00 MB / L3: 16.00 MB
 AES-NI指令集      : ✔ Enabled
 VM-x/AMD-V支持    : ✔ Enabled
 内存              : 465.76 MiB / 973.27 MiB
 Swap              : 371.25 MiB / 1.00 GiB
 硬盘空间          : 12.58 GiB / 14.73 GiB
 启动盘路径        : /dev/sda1
 系统在线时间      : 75 days, 6 hour 29 min
 负载              : 1.54, 0.40, 0.14
 系统              : Debian GNU/Linux 12 (bookworm) (x86_64)
 架构              : x86_64 (64 Bit)
 内核              : 6.1.0-23-cloud-amd64
 TCP加速方式       : bbr
 虚拟化架构        : KVM
 NAT类型           : Port Restricted Cone
 IPV4 ASN          : AS139659 LUCIDACLOUD LIMITED
 IPV4 位置         : Hong Kong / Hong Kong / HK
 IPV6 ASN          : AS139659 Lucidacloud
 IPV6 位置         : Hong Kong
 IPV6 子网掩码     : 128
----------------------CPU测试--通过sysbench测试-------------------------
 -> CPU 测试中 (Fast Mode, 1-Pass @ 5sec)
 1 线程测试(单核)得分:          772 Scores
---------------------内存测试--感谢lemonbench开源-----------------------
 -> 内存测试 Test (Fast Mode, 1-Pass @ 5sec)
 单线程读测试:          16317.83 MB/s
 单线程写测试:          11380.68 MB/s
------------------磁盘dd读写测试--感谢lemonbench开源--------------------
 -> 磁盘IO测试中 (4K Block/1M Block, Direct Mode)
 测试操作               写速度                                  读速度
 100MB-4K Block         24.7 MB/s (6036 IOPS, 4.24s)            34.2 MB/s (8341 IOPS, 3.07s)
 1GB-1M Block           726 MB/s (692 IOPS, 1.44s)              1.2 GB/s (1139 IOPS, 0.88s)
---------------------磁盘fio读写测试--感谢yabs开源----------------------
测试失败请替换另一种方式
------------流媒体解锁--基于oneclickvirt/CommonMediaTests开源-----------
以下测试的解锁地区是准确的，但是不是完整解锁的判断可能有误，这方面仅作参考使用
----------------Netflix-----------------
[IPV4]
您的出口IP完整解锁Netflix，支持非自制剧的观看
NF所识别的IP地域信息：新加坡
[IPV6]
您的出口IP可以使用Netflix，但仅可看Netflix自制剧
NF所识别的IP地域信息：中国香港
----------------Youtube-----------------
[IPV4]
连接方式: Youtube Video Server
视频缓存节点地域: 美国  洛杉机(LAX17S56)
Youtube识别地域: 中国香港(HK)
[IPV6]
连接方式: Youtube Video Server
视频缓存节点地域: 中国香港(HKG33S01)
---------------DisneyPlus---------------
[IPV4]
当前出口所在地区解锁DisneyPlus
区域：SG 区
[IPV6]
当前出口所在地区解锁DisneyPlus
区域：HK 区
解锁Netflix，Youtube，DisneyPlus上面和下面进行比较，不同之处自行判断
----------------流媒体解锁--感谢RegionRestrictionCheck开源--------------
 以下为IPV4网络测试，若无IPV4网络则无输出
============[ Multination ]============
 Dazn:                                  Yes (Region: HK)
 Disney+:                               Yes (Region: SG)
 Netflix:                               Yes (Region: SG)
 YouTube Premium:                       Yes (Region: HK)
 Amazon Prime Video:                    Yes (Region: SG)
 TVBAnywhere+:                          No
 Spotify Registration:                  Yes (Region: HK)
 OneTrust Region:                       HK [Unknown]
 iQyi Oversea Region:                   HK
 Bing Region:                           SG (Risky)
 YouTube CDN:                           Los Angeles, CA
 Netflix Preferred CDN:                 Hong Kong
 ChatGPT:                               No (Only Available with Mobile APP)
 Google Gemini:                         No
 Wikipedia Editability:                 Yes
 Google Play Store:                     Hong Kong 
 Google Search CAPTCHA Free:            Yes
 Steam Currency:                        HKD
 ---Forum---
 Reddit:                                Yes
=======================================
 以下为IPV6网络测试，若无IPV6网络则无输出
============[ Multination ]============
 Dazn:                                  IPv6 Is Not Currently Supported
 Disney+:                               IPv6 Is Not Currently Supported
 Netflix:                               Originals Only
 YouTube Premium:                       No
 Amazon Prime Video:                    IPv6 Is Not Currently Supported
 TVBAnywhere+:                          IPv6 Is Not Currently Supported
 Spotify Registration:                  Yes (Region: HK)
 OneTrust Region:                       HK [Unknown]
 iQyi Oversea Region:                   IPv6 Is Not Currently Supported
 Bing Region:                           HK (Risky)
 YouTube CDN:                           Hong Kong
 Netflix Preferred CDN:                 Hong Kong
 ChatGPT:                               Failed (Network Connection)
 Google Gemini:                         No
 Wikipedia Editability:                 Yes
 Google Play Store:                     China 
 Google Search CAPTCHA Free:            Yes
 Steam Currency:                        IPv6 Is Not Currently Supported
 ---Forum---
 Reddit:                                IPv6 Is Not Currently Supported
=======================================
---------------TikTok解锁--感谢lmc999的源脚本及fscarmen PR--------------
 Tiktok Region:         Failed
-------------IP质量检测--基于oneclickvirt/securityCheck使用-------------
数据仅作参考，不代表100%准确，如果和实际情况不一致请手动查询多个数据库比对
以下为各数据库编号，输出结果后将自带数据库来源对应的编号
ipinfo数据库  [0] | scamalytics数据库 [1] | virustotal数据库   [2] | abuseipdb数据库   [3] | ip2location数据库    [4]
ip-api数据库  [5] | ipwhois数据库     [6] | ipregistry数据库   [7] | ipdata数据库      [8] | db-ip数据库          [9]
ipapiis数据库 [A] | ipapicom数据库    [B] | bigdatacloud数据库 [C] | cheervision数据库 [D] | ipqualityscore数据库 [E]
IPV4:
安全得分:
声誉(越高越好): 0 [2] 
信任得分(越高越好): 97 [8]
VPN得分(越低越好): 1 [8] 
代理得分(越低越好): 6 [8] 
社区投票-无害: 0 [2] 
社区投票-恶意: 0 [2] 
威胁得分(越低越好): 2 [8] 
欺诈得分(越低越好): 65 [E] 0 [1]
滥用得分(越低越好): 0 [3] 
ASN滥用得分(越低越好): 0.0063 (Low) [A]
公司滥用得分(越低越好): 0.0234 (Elevated) [A] 
威胁级别: low [9 B] 
黑名单记录统计:(有多少黑名单网站有记录):
无害记录数: 0 [2]  恶意记录数: 0 [2]  可疑记录数: 0 [2]  无记录数: 94 [2]  
安全信息:
使用类型: hosting [0 7 9 A] DataCenter/WebHosting/Transit [3] hosting - high probability [C]
公司类型: hosting [0 7] business [A]
是否云提供商: Yes [7 D] 
是否数据中心: Yes [0 1 5 6 C] No [8 A]
是否移动设备: Yes [E] No [5 A C]
是否代理: Yes [E] No [0 1 4 5 6 7 8 9 A B C D]
是否VPN: Yes [E] No [0 1 6 7 A C D]
是否Tor: No [0 1 3 6 7 8 A B C D E] 
是否Tor出口: No [1 7 D] 
是否网络爬虫: No [9 A B E] 
是否匿名: No [1 6 7 8 D] 
是否攻击者: No [7 8 D] 
是否滥用者: No [7 8 A C D E] 
是否威胁: No [7 8 C D] 
是否中继: No [0 7 8 C D] 
是否Bogon: No [7 8 A C D] 
是否机器人: No [E] 
DNS-黑名单: 314(Total_Check) 0(Clean) 5(Blacklisted) 23(Other) 
IPV6:
安全得分:
欺诈得分(越低越好): 0 [1]
滥用得分(越低越好): 0 [3] 
ASN滥用得分(越低越好): 0.0063 (Low) [A] 
公司滥用得分(越低越好): 0 (Very Low) [A] 
威胁级别: low [B] 
安全信息:
使用类型: hosting [A] DataCenter/WebHosting/Transit [3]
公司类型: hosting [A] 
是否云提供商: Yes [D] 
是否数据中心: Yes [1 A] 
是否移动设备: No [A] 
是否代理: No [1 A B D] 
是否VPN: No [1 A D] 
是否Tor: No [1 3 A B D] 
是否Tor出口: No [1 D] 
是否网络爬虫: No [A B] 
是否匿名: No [1 D] 
是否攻击者: No [D] 
是否滥用者: No [A D]
是否威胁: No [D] 
是否中继: No [D] 
是否Bogon: No [A D] 
DNS-黑名单: 314(Total_Check) 0(Clean) 0(Blacklisted) 314(Other) 
Google搜索可行性：YES
-------------邮件端口检测--基于oneclickvirt/portchecker开源-------------
Platform  SMTP  SMTPS POP3  POP3S IMAP  IMAPS
LocalPort ✘     ✔     ✔     ✔     ✔     ✔    
QQ        ✔     ✔     ✔     ✘     ✔     ✘    
163       ✘     ✘     ✔     ✘     ✘     ✘    
Sohu      ✔     ✔     ✔     ✘     ✘     ✘    
Yandex    ✘     ✘     ✔     ✘     ✘     ✘    
Gmail     ✔     ✔     ✘     ✘     ✘     ✘    
Outlook   ✔     ✘     ✘     ✘     ✔     ✘    
Office365 ✔     ✘     ✔     ✘     ✔     ✘    
Yahoo     ✔     ✔     ✘     ✘     ✘     ✘    
MailCOM   ✔     ✔     ✔     ✘     ✘     ✘    
MailRU    ✘     ✘     ✘     ✘     ✔     ✘    
AOL       ✔     ✔     ✘     ✘     ✘     ✘    
GMX       ✔     ✘     ✔     ✘     ✔     ✘    
Sina      ✘     ✘     ✘     ✘     ✔     ✘    
----------------三网回程--基于oneclickvirt/backtrace开源----------------
北京电信 219.141.140.10  电信163    [普通线路] 
北京联通 202.106.195.68  移动CMI    [普通线路] 
北京移动 221.179.155.161 移动CMI    [普通线路] 
上海电信 202.96.209.133  电信163    [普通线路] 
上海联通 210.22.97.1     移动CMI    [普通线路] 
上海移动 211.136.112.200 移动CMI    [普通线路] 
广州电信 58.60.188.222   检测不到回程路由节点的IP地址
广州联通 210.21.196.6    移动CMI    [普通线路] 
广州移动 120.196.165.24  移动CMI    [普通线路] 
成都电信 61.139.2.69     检测不到回程路由节点的IP地址
成都联通 119.6.6.6       移动CMI    [普通线路] 
成都移动 211.137.96.205  移动CMI    [普通线路] 
准确线路自行查看详细路由，本测试结果仅作参考
同一目标地址多个线路时，可能检测已越过汇聚层，除了第一个线路外，后续信息可能无效
---------------------回程路由--感谢fscarmen开源及PR---------------------
依次测试电信/联通/移动经过的地区及线路，核心程序来自ipip.net或nexttrace，请知悉!
广州电信 58.60.188.222
0.79 ms         AS139659 中国 香港 yecaoyun.com
0.39 ms         * RFC1918
0.84 ms         * RFC1918
2.23 ms         AS10099 中国 香港 chinaunicomglobal.com
2.59 ms         * 中国 香港
50.33 ms        AS4134 [CHINANET-HK] 中国 香港 www.chinatelecom.com.cn
60.92 ms        AS4134 [CHINANET-GD] 中国 广东 深圳 www.chinatelecom.com.cn 电信
61.45 ms        AS4134 中国 广东 深圳 福田区 www.chinatelecom.com.cn 电信
广州联通 210.21.196.6
0.84 ms         AS139659 中国 香港 yecaoyun.com
0.67 ms         * RFC1918
2.85 ms         AS40065 [DATA-CENTRE] 中国 香港 cnservers.com
15.40 ms        AS58453 [CMI-INT] 中国 香港 cmi.chinamobile.com 移动
27.42 ms        AS58453 [CMI-INT] 中国 上海 cmi.chinamobile.com 移动
28.55 ms        AS9808 [CMNET] 中国 上海 X-I chinamobileltd.com 移动
28.83 ms        AS9808 [CMNET] 中国 上海 I-C chinamobileltd.com 移动
29.80 ms        AS9808 [CMNET] 中国 上海 chinamobileltd.com 移动
59.89 ms        AS9808 [CMNET] 中国 广东 广州 chinamobileltd.com 移动
104.37 ms       AS4837 [CU169-BACKBONE] 中国 广东 广州 chinaunicom.cn
108.42 ms       AS17816 [UNICOM-GD] 中国 广东 深圳 chinaunicom.cn 联通
114.33 ms       AS17623 [APNIC-AP] 中国 广东 深圳 chinaunicom.cn 联通
109.99 ms       AS17623 中国 广东 深圳 宝安区 chinaunicom.cn 联通
广州移动 120.196.165.24
0.68 ms         AS139659 中国 香港 yecaoyun.com
0.77 ms         * RFC1918
0.66 ms         AS7578 [STREAMLINESERVERS-AU] 澳大利亚 维多利亚州 墨尔本 globalsecurelayer.com
1.26 ms         AS136510 中国 香港 Streamline Servers Pty Ltd
4.85 ms         AS3356 中国 香港 lumen.com
2.94 ms         AS58453 [CMI-INT] 中国 香港 cmi.chinamobile.com 移动
2.53 ms         AS58453 [CMI-INT] 中国 香港 cmi.chinamobile.com 移动
7.64 ms         AS58453 [CMI-INT] 中国 广东 广州 cmi.chinamobile.com 移动
135.43 ms       AS9808 [CMNET] 中国 广东 广州 X-I chinamobileltd.com 移动
33.36 ms        AS9808 [CMNET] 中国 广东 广州 I-C chinamobileltd.com 移动
30.81 ms        AS9808 [CMNET] 中国 广东 广州 chinamobileltd.com 移动
36.17 ms        AS9808 [CMNET] 中国 广东 广州 chinamobileltd.com 移动
39.45 ms        AS9808 [CMNET] 中国 广东 广州 chinamobileltd.com 移动
35.75 ms        AS56040 [APNIC-AP] 中国 广东 深圳 gd.10086.cn 移动
--------------------自动更新测速节点列表--本脚本原创--------------------
位置             上传速度        下载速度        延迟     丢包率
新加坡           101.39 Mbps     99.02 Mbps      32.80    NULL
联通WuXi         105.58 Mbps     107.34 Mbps     87.03    0.0%
联通上海5G       105.94 Mbps     99.10 Mbps      136.88   65.0%
电信Zhenjiang5G  106.33 Mbps     101.32 Mbps     92.13    NULL
电信Suzhou5G     104.12 Mbps     100.99 Mbps     80.58    NULL
移动杭州5G       104.37 Mbps     101.00 Mbps     31.92    0.0%
移动Fujian       102.88 Mbps     99.59 Mbps      45.39    NULL
------------------------------------------------------------------------
 总共花费      : 6 分 53 秒
 时间          : Tue Jan  7 22:29:12 EST 2025
------------------------------------------------------------------------

MikyHost 日本东京机器购买与留档测试

Tue, 07 Jan 2025 00:00:00 GMT

机器详情

CPU 2 vCPU
内存 512 Mib
存储 20 GiB
带宽 5 5Gbps
流量 1 T

优惠购买

购买

官网(含Aff)

VPS -> Cheap VPS -> Order Now (Package 1 512 RAM、 2vCPU、 20GB SSD、 1T 流量)

默认 Annually 订阅，Region 根据需要选择，AWS ip 测试地址，Operating System 推荐选择 Debian(毕竟就 512MB 内存)，Server Management 默认，Hostname 唯一，填写完成后点击右侧 Continue。

然后进行创建账户，根据个人信息填写

:::important Additional Information，Choose Currency 一定要选择 IDR，能省 Paypal 手续费(2.99$) :::

全部填写完成后点击 Register 进行注册，然后输入优惠码进行付款，支持 Paypal。

4 折优惠码：BlackFriday24

:::tip 截止今日 2025-01-07 此优惠码依然有效 :::

关闭防火墙

创建完成后，会收到邮件，进入控制台，打开防火墙。

点击 firewall -> Add Rule -> Application 选择 All TCP + UDP -> Add Rule。

测试 IP 是否被墙

:::tip AWS 机器可以通过关机在开机更换 IP，因此不怕 IP 被墙，但是可能分配你的 IP 默认是被墙的需要手动开关机更换。 :::

拿到 Public IP Address，测试 IP 是否被墙，ITDOG

全红: 未关闭防火墙
部分红: 已关闭防火墙，但 ip 被墙
全绿: 已关闭防火墙，且 ip 未被墙

关闭 Paypal 自动续费

由于此机器只有第一年优惠，所以需要关闭 Paypal 自动续费，否则第二年续费会自动原价扣款。

关闭弹窗后状态栏会显示 无效，即取消成功。

切换 root 用户

sudo -s

开启 ssh 账号密码登录

# 将代码中的第一句中的 Passwd 改为自己将要设置的密码，否则默认 root 密码为 Passwd。
echo root:Passwd |sudo chpasswd root
sudo sed -i 's/^#\?PermitRootLogin.*/PermitRootLogin yes/g' /etc/ssh/sshd_config;
sudo sed -i 's/^#\?PasswordAuthentication.*/PasswordAuthentication yes/g' /etc/ssh/sshd_config;
sudo systemctl restart sshd.service

IP Check

bash <(curl -Ls IP.Check.Place)

详情

########################################################################
                       IP质量体检报告：57.180.*.*
                    bash <(curl -sL IP.Check.Place)
                   https://github.com/xykt/IPQuality
        报告时间：2025-04-11 10:36:53 CST  脚本版本：v2025-03-25
########################################################################
一、基础信息（Maxmind 数据库）
自治系统号：            AS16509
组织：                  AMAZON-02
坐标：                  139°41′24″E, 35°41′21″N
地图：                  https://check.place/35.6893,139.6899,14,cn
城市：                  东京都, 东京, 151-0053
使用地：                [JP]日本, [AS]亚洲
注册地：                [US]美国
时区：                  Asia/Tokyo
IP类型：                 广播IP 
二、IP类型属性
数据库：      IPinfo    ipregistry    ipapi     AbuseIPDB  IP2LOCATION 
使用类型：     机房        机房        商业        机房        机房    
公司类型：     机房        机房        商业    
三、风险评分
风险等级：      极低         低       中等       高         极高
SCAMALYTICS：  0|低风险
ipapi：    0.01%|极低风险
AbuseIPDB：    0|低风险
IPQS：                        75|可疑IP
Cloudflare：   0|低风险
DB-IP：         |低风险
四、风险因子
库： IP2LOCATION ipapi ipregistry IPQS SCAMALYTICS ipdata IPinfo IPWHOIS
地区：    [JP]    [JP]    [JP]    [JP]    [JP]    [JP]    [JP]    [JP]
代理：     否      否      否      是      否      否      否      否 
Tor：      否      否      否      否      否      否      否      否 
VPN：      否      是      否      是      否      无      否      否 
服务器：   是      是      是      无      否      否      是      是 
滥用：     否      否      否      否      无      否      无      无 
机器人：   否      否      无      否      否      无      无      无 
五、流媒体及AI服务解锁检测
服务商：  TikTok   Disney+  Netflix Youtube  AmazonPV  Spotify  ChatGPT 
状态：     失败     解锁     解锁     解锁     解锁     屏蔽     解锁   
地区：              [HK]     [HK]     [JP]     [JP]              [SG]   
方式：               DNS      DNS     原生     原生               DNS   
六、邮局连通性及黑名单检测
本地25端口：阻断
IP地址黑名单数据库：  有效 439   正常 425   已标记 14   黑名单 0
========================================================================
今日IP检测量：147；总检测量：175253。感谢使用xy系列脚本！ 
报告链接：https://Report.Check.Place/IP/19NT6BIL2.svg

########################################################################
                IP质量体检报告：2406:da14:c29:*:*:*:*:*
                    bash <(curl -sL IP.Check.Place)
                   https://github.com/xykt/IPQuality
        报告时间：2025-04-11 10:36:53 CST  脚本版本：v2025-03-25
########################################################################
一、基础信息（Maxmind 数据库）
自治系统号：            AS16509
组织：                  AMAZON-02
坐标：                  139°41′24″E, 35°41′21″N
地图：                  https://check.place/35.6893,139.6899,15,cn
城市：                  东京都, 东京, 151-0053
使用地：                [JP]日本, [AS]亚洲
注册地：                [US]美国
时区：                  Asia/Tokyo
IP类型：                 广播IP 
二、IP类型属性
数据库：      IPinfo    ipregistry    ipapi     AbuseIPDB  IP2LOCATION 
使用类型：     机房        机房        商业        机房        机房    
公司类型：     机房        机房        商业    
三、风险评分
风险等级：      极低         低       中等       高         极高
SCAMALYTICS：                         38|中风险
ipapi：    0.00%|极低风险
AbuseIPDB：    0|低风险
IPQS：                        75|可疑IP
Cloudflare：   0|低风险
DB-IP：         |低风险
四、风险因子
库： IP2LOCATION ipapi ipregistry IPQS SCAMALYTICS ipdata IPinfo IPWHOIS
地区：    [US]    [JP]    [JP]    [JP]    [JP]    [JP]    [JP]    [JP]
代理：     否      否      否      是      否      否      否      否 
Tor：      否      否      否      否      否      否      否      否 
VPN：      否      否      否      是      否      无      否      否 
服务器：   是      是      是      无      否      否      是      否 
滥用：     否      否      否      否      无      否      无      无 
机器人：   否      否      无      否      否      无      无      无 
五、流媒体及AI服务解锁检测
服务商：  TikTok   Disney+  Netflix Youtube  AmazonPV  Spotify  ChatGPT 
状态：     失败     失败     失败     解锁     屏蔽     屏蔽     失败   
地区：                                [JP]                              
方式：                                原生                              
六、邮局连通性及黑名单检测
本地25端口：阻断
========================================================================
今日IP检测量：148；总检测量：175254。感谢使用xy系列脚本！ 
报告链接：https://Report.Check.Place/IP/PNFC1T9O8.svg

融合怪测试

由于此商家机器仅支持 ssh 密钥登录，我在开启 ssh 可以使用账号密码登录时已修改 ssh 配置文件后还未进行设置密码就与服务器断了开链接，导致现在无法使用密钥登录，也无法使用账号密码登录。只能重装系统，但是重装系统需要工单申请(工单回复较慢一般 24 小时起步)，所以暂时无法进行测试，后续补上融合怪测试。

已补上融合怪测试

详情

--------------------- A Bench Script By spiritlhl ----------------------
                   测评频道: https://t.me/vps_reviews                    
VPS融合怪版本：2025.01.02
Shell项目地址：https://github.com/spiritLHLS/ecs
Go项目地址：https://github.com/oneclickvirt/ecs
---------------------基础信息查询--感谢所有开源项目---------------------
 CPU 型号          : Intel(R) Xeon(R) Platinum 8259CL CPU @ 2.50GHz
 CPU 核心数        : 2
 CPU 频率          : 2499.998 MHz
 CPU 缓存          : L1: 32.00 KB / L2: 1.00 MB / L3: 35.75 MB
 AES-NI指令集      : ✔ Enabled
 VM-x/AMD-V支持    : ❌ Disabled
 内存              : 106.25 MiB / 447.84 MiB
 Swap              : [ no swap partition or swap file detected ]
 硬盘空间          : 1.03 GiB / 19.46 GiB
 启动盘路径        : /dev/nvme0n1p1
 系统在线时间      : 0 days, 2 hour 28 min
 负载              : 0.55, 0.15, 0.05
 系统              : Debian GNU/Linux 12 (bookworm) (x86_64)
 架构              : x86_64 (64 Bit)
 内核              : 6.1.0-28-cloud-amd64
 TCP加速方式       : cubic
 虚拟化架构        : Amazon Virtualization
 NAT类型           : Full Cone
 IPV4 ASN          : AS16509 Amazon.com, Inc.
 IPV4 位置         : Tokyo / Tokyo / JP
 IPV6 ASN          : AS16509 Amazon.com
 IPV6 位置         : Tokyo / Tokyo / Japan
 IPV6 子网掩码     : 128
----------------------CPU测试--通过sysbench测试-------------------------
 -> CPU 测试中 (Fast Mode, 1-Pass @ 5sec)
 1 线程测试(单核)得分:          881 Scores
 2 线程测试(多核)得分:          1652 Scores
---------------------内存测试--感谢lemonbench开源-----------------------
 -> 内存测试 Test (Fast Mode, 1-Pass @ 5sec)
 单线程读测试:          19843.65 MB/s
 单线程写测试:          16095.18 MB/s
------------------磁盘dd读写测试--感谢lemonbench开源--------------------
 -> 磁盘IO测试中 (4K Block/1M Block, Direct Mode)
 测试操作               写速度                                  读速度
 100MB-4K Block         4.3 MB/s (1062 IOPS, 24.11s)            6.5 MB/s (1599 IOPS, 16.01s)
 1GB-1M Block           150 MB/s (143 IOPS, 6.99s)              141 MB/s (134 IOPS, 7.45s)
---------------------磁盘fio读写测试--感谢yabs开源----------------------
Block Size | 4k            (IOPS) | 64k           (IOPS)
  ------   | ---            ----  | ----           ---- 
Read       | 6.20 MB/s     (1.5k) | 66.01 MB/s    (1.0k)
Write      | 6.19 MB/s     (1.5k) | 66.43 MB/s    (1.0k)
Total      | 12.39 MB/s    (3.0k) | 132.44 MB/s   (2.0k)
           |                      |                     
Block Size | 512k          (IOPS) | 1m            (IOPS)
  ------   | ---            ----  | ----           ---- 
Read       | 63.21 MB/s     (123) | 62.78 MB/s      (61)
Write      | 66.60 MB/s     (130) | 67.25 MB/s      (65)
Total      | 129.82 MB/s    (253) | 130.03 MB/s    (126)
------------流媒体解锁--基于oneclickvirt/CommonMediaTests开源-----------
以下测试的解锁地区是准确的，但是不是完整解锁的判断可能有误，这方面仅作参考使用
----------------Netflix-----------------
[IPV4]
您的出口IP可以使用Netflix，但仅可看Netflix自制剧
NF所识别的IP地域信息：日本
[IPV6]
您的出口IP可以使用Netflix，但仅可看Netflix自制剧
NF所识别的IP地域信息：日本
----------------Youtube-----------------
[IPV4]
连接方式: Youtube Video Server
视频缓存节点地域: 日本 东京(NRT12S24)
Youtube识别地域: 日本(JP)
[IPV6]
连接方式: Youtube Video Server
视频缓存节点地域: 日本 东京(NRT12S24)
Youtube识别地域: 日本(JP)
---------------DisneyPlus---------------
[IPV4]
当前出口所在地区解锁DisneyPlus
区域：JP 区
[IPV6]
当前出口所在地区解锁DisneyPlus
区域：JP 区
解锁Netflix，Youtube，DisneyPlus上面和下面进行比较，不同之处自行判断
----------------流媒体解锁--感谢RegionRestrictionCheck开源--------------
 以下为IPV4网络测试，若无IPV4网络则无输出
============[ Multination ]============
 Dazn:                                  Yes (Region: JP)
 Disney+:                               No (IP Banned By Disney+ 1)
 Netflix:                               Originals Only
 YouTube Premium:                       Yes (Region: JP)
 Amazon Prime Video:                    Yes (Region: JP)
 TVBAnywhere+:                          Yes
 Spotify Registration:                  Yes (Region: JP)
 OneTrust Region:                       JP [Tokyo]
 iQyi Oversea Region:                   JP
 Bing Region:                           JP (Risky)
 YouTube CDN:                           Tokyo
 Netflix Preferred CDN:                 Mumbai (Bombay)
 ChatGPT:                               Yes
 Google Gemini:                         Yes (Region: JPN)
 Wikipedia Editability:                 No
 Google Play Store:                     Japan 
 Google Search CAPTCHA Free:            Yes
 Steam Currency:                        JPY
 ---Forum---
 Reddit:                                No
=======================================
 以下为IPV6网络测试，若无IPV6网络则无输出
============[ Multination ]============
 Dazn:                                  IPv6 Is Not Currently Supported
 Disney+:                               IPv6 Is Not Currently Supported
 Netflix:                               Originals Only
 YouTube Premium:                       Yes (Region: JP)
 Amazon Prime Video:                    IPv6 Is Not Currently Supported
 TVBAnywhere+:                          IPv6 Is Not Currently Supported
 Spotify Registration:                  Yes (Region: JP)
 OneTrust Region:                       JP [Tokyo]
 iQyi Oversea Region:                   IPv6 Is Not Currently Supported
 Bing Region:                           JP (Risky)
 YouTube CDN:                           Tokyo
 Netflix Preferred CDN:                 Seattle, WA
 ChatGPT:                               Failed (Network Connection)
 Google Gemini:                         Yes (Region: JPN)
 Wikipedia Editability:                 No
 Google Play Store:                     Japan 
 Google Search CAPTCHA Free:            Yes
 Steam Currency:                        IPv6 Is Not Currently Supported
 ---Forum---
 Reddit:                                IPv6 Is Not Currently Supported
=======================================
---------------TikTok解锁--感谢lmc999的源脚本及fscarmen PR--------------
 Tiktok Region:         【JP】
-------------IP质量检测--基于oneclickvirt/securityCheck使用-------------
数据仅作参考，不代表100%准确，如果和实际情况不一致请手动查询多个数据库比对
以下为各数据库编号，输出结果后将自带数据库来源对应的编号
ipinfo数据库  [0] | scamalytics数据库 [1] | virustotal数据库   [2] | abuseipdb数据库   [3] | ip2location数据库    [4]
ip-api数据库  [5] | ipwhois数据库     [6] | ipregistry数据库   [7] | ipdata数据库      [8] | db-ip数据库          [9]
ipapiis数据库 [A] | ipapicom数据库    [B] | bigdatacloud数据库 [C] | cheervision数据库 [D] | ipqualityscore数据库 [E]
IPV4:
安全得分:
声誉(越高越好): 0 [2] 
信任得分(越高越好): 0 [8] 
VPN得分(越低越好): 100 [8] 
代理得分(越低越好): 100 [8] 
社区投票-无害: 0 [2] 
社区投票-恶意: 0 [2] 
威胁得分(越低越好): 100 [8] 
欺诈得分(越低越好): 15 [1] 
滥用得分(越低越好): 0 [3]
ASN滥用得分(越低越好): 0.0001 (Very Low) [A] 
公司滥用得分(越低越好): 0.0002 (Very Low) [A] 
威胁级别: low [9 B] 
黑名单记录统计:(有多少黑名单网站有记录):
无害记录数: 0 [2]  恶意记录数: 0 [2]  可疑记录数: 0 [2]  无记录数: 94 [2]  
安全信息:
使用类型: DataCenter/WebHosting/Transit [3] hosting [0 7 8 9] business [A] unknown [C]
公司类型: hosting [0 7 A] 
是否云提供商: Yes [7 D] 
是否数据中心: No [C] Yes [0 1 5 6 8 A]
是否移动设备: No [5 A C] 
是否代理: No [0 1 4 5 6 7 8 9 A B C D] 
是否VPN: No [0 1 6 7 C D] Yes [A]
是否TorExit: No [1 7 D] 
是否Tor出口: No [1 7 D] 
是否网络爬虫: No [9 A B] 
是否匿名: No [1 6 7 8 D] 
是否攻击者: No [7 8 D] 
是否滥用者: No [7 8 A C D] 
是否威胁: No [7 8 C D] 
是否中继: No [0 7 8 C D] 
是否Bogon: No [7 8 A C D] 
DNS-黑名单: 314(Total_Check) 0(Clean) 5(Blacklisted) 20(Other) 
IPV6:
安全得分:
欺诈得分(越低越好): 12 [1] 
滥用得分(越低越好): 0 [3]
ASN滥用得分(越低越好): 0.0001 (Very Low) [A] 
公司滥用得分(越低越好): 0 (Very Low) [A] 
威胁级别: low [B] 
安全信息:
使用类型: DataCenter/WebHosting/Transit [3] business [A]
公司类型: business [A] 
是否云提供商: Yes [D] 
是否数据中心: Yes [1 A] 
是否移动设备: No [A] 
是否代理: No [1 A B D] 
是否VPN: No [1 A D] 
是否TorExit: No [1 D] 
是否Tor出口: No [1 D] 
是否网络爬虫: No [A B] 
是否匿名: No [1 D] 
是否攻击者: No [D] 
是否滥用者: No [A D] 
是否威胁: No [D] 
是否中继: No [D] 
是否Bogon: No [A D] 
DNS-黑名单: 314(Total_Check) 0(Clean) 0(Blacklisted) 314(Other) 
Google搜索可行性：YES
-------------邮件端口检测--基于oneclickvirt/portchecker开源-------------
Platform  SMTP  SMTPS POP3  POP3S IMAP  IMAPS
LocalPort ✔     ✔     ✔     ✔     ✔     ✔    
QQ        ✘     ✔     ✔     ✘     ✔     ✘    
163       ✘     ✔     ✔     ✘     ✔     ✘    
Sohu      ✘     ✔     ✔     ✘     ✔     ✘    
Yandex    ✘     ✔     ✔     ✘     ✔     ✘    
Gmail     ✘     ✔     ✘     ✘     ✘     ✘    
Outlook   ✘     ✘     ✔     ✘     ✔     ✘    
Office365 ✘     ✘     ✔     ✘     ✔     ✘    
Yahoo     ✘     ✔     ✘     ✘     ✘     ✘    
MailCOM   ✘     ✔     ✔     ✘     ✔     ✘    
MailRU    ✘     ✔     ✘     ✘     ✔     ✘    
AOL       ✘     ✔     ✘     ✘     ✘     ✘    
GMX       ✘     ✘     ✔     ✘     ✔     ✘    
Sina      ✘     ✔     ✔     ✘     ✔     ✘    
----------------三网回程--基于oneclickvirt/backtrace开源----------------
北京电信 219.141.140.10  电信163    [普通线路] 
北京联通 202.106.195.68  联通4837   [普通线路] 
北京移动 221.179.155.161 移动CMI    [普通线路] 
上海电信 202.96.209.133  电信163    [普通线路] 
上海联通 210.22.97.1     联通4837   [普通线路] 
上海移动 211.136.112.200 移动CMI    [普通线路] 
广州电信 58.60.188.222   检测不到回程路由节点的IP地址
广州联通 210.21.196.6    联通4837   [普通线路] 
广州移动 120.196.165.24  移动CMI    [普通线路] 
成都电信 61.139.2.69     电信163    [普通线路] 
成都联通 119.6.6.6       联通4837   [普通线路] 
成都移动 211.137.96.205  移动CMI    [普通线路] 
准确线路自行查看详细路由，本测试结果仅作参考
同一目标地址多个线路时，可能检测已越过汇聚层，除了第一个线路外，后续信息可能无效
---------------------回程路由--感谢fscarmen开源及PR---------------------
依次测试电信/联通/移动经过的地区及线路，核心程序来自ipip.net或nexttrace，请知悉!
广州电信 58.60.188.222
6.22 ms         * RFC1112
0.36 ms         * RFC1112
1.69 ms         * RFC1112
1.41 ms         AS16509 [AT-88] 日本 东京都 东京 AMAZON amazon.com
2.73 ms         AS2914 日本 东京都 东京 gin.ntt.net
2.15 ms         AS2914 [NTT-BACKBONE] 日本 东京都 东京 gin.ntt.net
* ms    AS2914 [NTT-BACKBONE] 日本 东京都 东京 gin.ntt.net
* ms    AS4134 [CHINANET-BB] 中国 北京 www.chinatelecom.com.cn 电信
* ms    AS4134 中国 广东 深圳 福田区 www.chinatelecom.com.cn 电信
广州联通 210.21.196.6
2.49 ms         * RFC1112
0.97 ms         * RFC1112
0.43 ms         * RFC1112
2.29 ms         * RFC1112
3.01 ms         * RFC1112
2.07 ms         AS16509 日本 东京都 东京 AMAZON amazon.com
1.75 ms         * [AMAZO-4] AMAZON.COM
63.15 ms        AS4837 [CU169-BACKBONE] 中国 上海 chinaunicom.cn 联通
61.08 ms        AS4837 [CU169-BACKBONE] 中国 上海 chinaunicom.cn 联通
89.83 ms        AS17816 [APNIC-AP] 中国 广东 深圳 chinaunicom.cn 联通
88.50 ms        AS17623 [APNIC-AP] 中国 广东 深圳 chinaunicom.cn 联通
85.25 ms        AS17623 中国 广东 深圳 宝安区 chinaunicom.cn 联通
广州移动 120.196.165.24
2.24 ms         * RFC1112
1.38 ms         * RFC1112
0.95 ms         * RFC1112
1.57 ms         * RFC6598
24.33 ms        * [AT-88] 日本 东京都 东京
2.59 ms         * [AMAZO-4] 日本 东京都 东京
3.45 ms         AS58453 [CMI-INT] 日本 东京都 东京 cmi.chinamobile.com 移动
58.09 ms        AS9808 [CMNET] 中国 广东 广州 I-C chinamobileltd.com 移动
* ms    AS9808 [CMNET] 中国 广东 广州 chinamobileltd.com 移动
64.28 ms        AS9808 [CMNET] 中国 广东 广州 chinamobileltd.com 移动
* ms    AS9808 [CMNET] 中国 广东 广州 chinamobileltd.com 移动
63.83 ms        AS56040 [APNIC-AP] 中国 广东 深圳 gd.10086.cn 移动
--------------------自动更新测速节点列表--本脚本原创--------------------
位置             上传速度        下载速度        延迟     丢包率
Speedtest.net    3934.75 Mbps    3509.57 Mbps    2.15     0.0%
日本东京         931.23 Mbps     750.65 Mbps     4.11     0.0%
中国香港         1503.24 Mbps    1974.84 Mbps    54.59    NULL
联通WuXi         2049.09 Mbps    3210.32 Mbps    64.08    0.0%
电信Suzhou5G     1279.96 Mbps    2891.50 Mbps    75.74    NULL
电信浙江         1500.05 Mbps    2511.40 Mbps    43.47    NULL
移动杭州5G       1125.56 Mbps    1766.46 Mbps    42.41    0.0%
移动Chengdu      1150.57 Mbps    1181.10 Mbps    106.13   NULL
------------------------------------------------------------------------
 总共花费      : 8 分 43 秒
 时间          : Wed Jan  8 01:54:56 UTC 2025
------------------------------------------------------------------------

白嫖 Cursor Pro

Thu, 02 Jan 2025 00:00:00 GMT

低成本稳定使用

2025年 5 月 7 日，Cursor 突然开放了教育优惠，只需要认证邮箱为学校邮箱，即可免费使用一年 Cursor Pro。

:::note ~~申请教育优惠~~ 2025-05-09 Cursor 开始大规模封杀使用教育优惠的账号，请谨慎使用，如果你是真学生，可以尝试使用。

目前(2025-05-08)由于申请人数过多，已关闭中国大陆学生的申请通道，但是其他国家的学生仍然可以申请。

~~如果不是学生身份，可以考虑闲鱼购买已认证的账号，价格在 100 元左右。~~ 不推荐购买，因为现在申请教育优惠的账号，基本都被封杀了，即使是真学生也有很多账号被封杀。 :::

白嫖记录

2025 年 5 月 06 日

:::important 截止至 2025-05-06 日，此方式仍然可用。但是现在限制颇多，临时邮箱和别名邮箱基本不可用，需要购买 gmail、outlook、hotmail 等邮箱。

在最新版本的cursor 客户端中使用时，会使账号试用提前结束(只活了 1 天)，需要在旧的客户端中使用。官网历史版本下载

同一台机器上注册多个账号会提示 too many free trials accounts used on this machine，这时需要更换机器码。 :::

:::note Github Copilot 在 2024-12-06 宣布免费使用(每月 2000 次代码补全，以及 50次对话)，对于轻度用户来说，已经足够了。

:::

账号注册

~~### 方法一：别名邮箱~~ (同一个邮箱注册多个别名后，会导致主域无法再次注册)

由于 Cursor 试用只需要一个邮箱验证即可，并不像其他的很多订阅服务需要验证信用卡，这使得白嫖 Cursor 变得非常简单。

我们只需要一个支持无限邮箱的邮箱，比如 Gmail、Outlook，就可以无限试用 Cursor Pro。如果你没有 Gmail，~~也可以2925无限邮~~(无法接收到邮件，推荐使用Gmail，或者使用临时邮箱)

我这里以 Gmail 为例，演示如何无限试用 Cursor Pro。

Gmail 支持别名,可以在** + **号之后填写任意字符，因此我们可以创建一个无限邮箱。

例如：xxx@gmail.com 与 xxx+aaa@gmail.com、xxx+bbb@gmail.com，可以看作同一个邮箱，给后二者别名邮箱发邮件第一个主邮箱也可以收到。

因此我们在注册 Cursor 时，只需要使用 xxx+aaa@gmail.com 这个邮箱即可，然后随便注册一个密码，即可无限试用 Cursor Pro。

~~### 方法二：临时邮箱~~ (基本无法通过注册)

临时邮箱，顾名思义，就是临时使用的邮箱，一般用于注册一些需要邮箱验证的网站。

temp-mail 是一个提供临时邮箱的网站，我们可以使用这个网站的邮箱来注册 Cursor。

方法三：购买邮箱 (目前最推荐的方式，需要配合低版本 Cursor 客户端使用)

google 搜索 gmail 邮箱购买，可以购买到很多便宜的邮箱

比如

gmail 邮箱均价 3 元每个
outlook 邮箱均价 0.15 元每个
hotmail 邮箱均价 0.15 元每个 (2025-05-06日，实测注册可用)

购买邮箱后，注册 Cursor 时，使用购买的邮箱即可。

更换机器码

:::tip Cursor 最近有了新的限制，如果在同一台机器上注册多个账号，会提示 too many free trials accounts used on this machine，因此需要切换机器码。 :::

Cursor Free Trial Reset Tool

GO-Cursor-Help ::github{repo="yuaotian/go-cursor-help"}
Cursor Shadow Patch ::github{repo="zetaloop/cursor-shadow-patch"}

让你的 Cursor 更智能

AI 通用开发助手提示词指南

让你的 Cursor 更稳定

Cursor异常问题收集和解决方案

在 Apple TV 中使用 AList

Tue, 31 Dec 2024 00:00:00 GMT

前提信息

Apple TV 局域网 ip: 192.168.2.2

docker 宿主机局域网 ip: 192.168.2.3

基础使用

使用的是三方 token，因此需要开通阿里云盘的三方会员，否则会限速到 5 Mbps。

介绍

AList 是一个支持多种存储，支持网页浏览和 WebDAV 的文件列表程序，由 gin 和 Solidjs 驱动。

由于 Apple TV 中并不能直接安装 AList，因此需要使用 AListServer 来搭建 AList 服务。

AListServer 是 Apple App Store 上的一个 AList 客户端，可以方便搭建 AList 服务，并提供了可视化管理界面。

安装

在 Apple TV 上打开 App Store，搜索 AListServer，并下载安装。
安装完成后，打开 AListServer，启动服务。

配置

:::tip 如果在同一局域网下，可以输入运行 AListServer 的设备 IP 地址和端口号即可访问 AList 服务。

如果不在同一局域网下，通过端口转发，将 AListServer 的端口转发到公网，即可在外网访问 AList 服务。 :::

浏览器端进入 AList 服务配置页面 http://192.168.2.2:5244/
输入 AList 账号密码，点击登录
点击 存储 -> 添加 -> 阿里云盘Open，我这里以阿里云盘为例，其他云盘配置类似
填写以下表单项 挂载路径、云盘类型、根文件夹ID、刷新令牌、Oauth令牌链接、移除方式，更多配置可以参考 AList 阿里云盘Open 配置
- 挂载路径：当前存储的入口，可以自定义，例如 /ali
- 云盘类型：备份盘或者资源盘，我这里选择的是资源盘
- 根文件夹ID：默认为root，展示全部云盘内容，若只想展示某文件夹內内容，可以改为file_id,通过阿里云盘网页端进入文件夹，网址中最后一段即为file_id，例如 https://www.alipan.com/drive/folder/5fe01e1830601baf774e4827a9fb8fb2b5bf7940 中的 5fe01e1830601baf774e4827a9fb8fb2b5bf7940
- 刷新令牌：阿里云盘的刷新令牌，可以在 https://alist.nn.ci/tool/aliyundrive/request.html 获取
- Oauth令牌链接：https://api-cf.nn.ci/alist/ali_open/token 或者 https://api.xhofe.top/alist/ali_open/token
- 移除方式：回收站和删除，按需选择
点击 保存

使用

在浏览器中访问 http://192.168.2.2:5244/ ，即可看到阿里云盘中的文件列表。

进阶使用

由于阿里云盘对自家的阿里云盘 TV 版不限速，因此可以通过获取阿里云盘 TV 版的 token 来实现不限速挂载的阿里云盘。

:::note[碎碎念] 作为阿里云盘内测用户，以及公测后的付费用户，看待阿里云盘限速，推出第三方权益包等操作，还是有点不爽的。

尤其是第三方权益包。我开通阿里云盘 SVIP 后，可以正常使用 WebDAV 服务，但是在之后推出第三方权益包后，WebDAV 服务就对于已购买的 SVIP 用户仍然进行限速了(虽然有 10G 的不限速流量包，但是在我看来有点割韭菜的感觉)。

:::

获取阿里云盘 TV 版的 token

通过 docker 项目 alipan-tv-auth 来获取阿里云盘 TV 版的 Refresh Token。

安装 alipan-tv-auth,使用docker-compose 安装

 version: '3.8'
 services:
   alipan-tv-auth:
     image: 'vscodev/alipan-tv-auth:latest'
     container_name: alipan-tv-auth
     ports:
         - '5245:5245'
     restart: unless-stopped

在浏览器中访问 http://192.168.2.3:5245/ ，授权获取阿里云盘 TV 版的 Refresh Token
将获取到的 Refresh Token 填入到 AList 服务的刷新令牌表单项
修改 AList 服务的 Oauth令牌链接为 http://192.168.2.3:5245/api/oauth/alipan/token
保存配置，即可实现不限速挂载的阿里云盘

第三方软件挂载

可以使用诸如 Infuse、Forward、Vidhub 等第三方软件，通过 WebDAV 协议挂载部署好的 AList 服务。

我这里以 Infuse 为例，演示如何挂载 AList 服务。我的 AList 地址为 http://192.168.2.2:5244/

打开 Infuse，设置 -> 新增文件来源 -> 添加 -> 添加 WebDAV
填写以下表单项，通信协议、位址、用户名、密码、高级-路径、高级-端口
- 通信协议：WebDAV 或者 WebDAV(HTTPS)
- 位址：192.168.2.2
- 用户名：admin
- 密码：***
- 路径：/dav
- 端口：5244
点击 保存
底部菜单栏选择文件，即可看到刚刚添加的文件来源了。

:::tip 我在首页中没有看到刮削的资源，不太确定 Infuse 是否会对 WebDAV 来源的资源进行刮削。

我经常使用的 Forward 则可以正常刮削。 :::

速度测试

在已存储的共享中点击右侧修改标识 icon，选择网速测试，可以看到平均速度在 200 Mbps 左右。

Docker 中安装 Home Assistant 并使用米家集成

Mon, 30 Dec 2024 00:00:00 GMT

Home Assistant 安装

我使用的是 docker-compose 安装的，docker-compose.yml 文件如下：

version: '3.8'
services:
  homeassistant:
    image: homeassistant/home-assistant
    container_name: home-assistant
    restart: unless-stopped
    volumes:
      - ./home-assistant:/config
    ports:
      - '8123:8123'
    environment:
      - TZ=Asia/Shanghai

在浏览器中访问 http://localhost:8123 即可访问 Home Assistant。

:::tip 如果你想要在公网中访问 Home Assistant，可以使用 Nginx Proxy Manager 进行反向代理，可以参考 Nginx Proxy Manager 使用指南。此时你应该仍然无法从公网访问 Home Assistant，查看 home-assistant 容器的日志，可以看到如下日志

2024-12-26 14:59:40.393 ERROR (MainThread) [homeassistant.components.http.forwarded] A request from a reverse proxy was received from 192.168.97.1, but your HTTP integration is not set-up for reverse proxies

此时需要修改 home-assistant 配置文件，在 configuration.yaml 中添加如下配置：

http:
  use_x_forwarded_for: true
  trusted_proxies:
    - 192.168.97.0/24

:::

启动 Home Assistant

docker-compose up -d

进入浏览器，访问 http://localhost:8123 即可访问 Home Assistant。根据页面提示，配置 Home Assistant。

米家集成

得益于小米官方的开放，Home Assistant 可以非常方便的集成小米的智能家居设备。

::github{repo="XiaoMi/ha_xiaomi_home"}

进入 home-assistant 容器终端中
clone 米家集成仓库

git clone https://github.com/XiaoMi/ha_xiaomi_home.git

cd ha_xiaomi_home

运行安装脚本

./install.sh /config

浏览器中访问 Home Assistant，并重启 Home Assistant
重启后，在 Home Assistant 中添加米家集成
1. 在 Home Assistant 中点击 设置 -> 设备与服务 -> 添加集成
2. 在 搜索集成 中搜索 Xiaomi Home
3. 点击 Xiaomi Home 集成，并按照提示进行配置
4. 配置完成后，在 Home Assistant 中可以看到米家设备，并进行控制

:::tip

如果你使用的是 safari 浏览器，可能会出现无法添加集成的情况，此时可以尝试使用其他浏览器。
如果验证小米账号中出现错误，可以修改 http://homeassistant.local:8123/api/webhook/xxx 中的 homeassistant.local 为你局域网 IP 地址。 :::

在苹果家庭App中添加设备

在 Home Assistant 中点击 设置 -> 设备与服务 -> 添加集成
在 搜索集成 中搜索 Apple -> HomeKit Bridge
点击 HomeKit Bridge 集成，并按照提示进行配置
配置完成后，在左下角通知处可以看到设备码和设备二维码
打开苹果家庭App，点击 + 按钮，选择 添加或扫描配件
添加完成后，在苹果家庭App中可以看到设备，并进行控制

最后

Home Assistant 是一个非常强大的智能家居平台，可以非常方便的集成小米的智能家居设备。且支持非常多的智能家居设备，可以参考 Home Assistant 官方文档了解更多。

使用 Surge Ponte 访问家庭网络

Fri, 27 Dec 2024 00:00:00 GMT

什么是 Surge Ponte

Surge Ponte 是 Surge 提供的私有 Mesh 网络功能，可在多台设备之间建立加密隧道。借助这一特性，即使身处外网，也能像在家一样访问局域网内的 NAS、路由器管理页面、Home Assistant 等服务。

:::tip 与传统内网穿透方案相比，Surge Ponte 无需额外服务器，配置简单，且通信全程加密。 :::

Ponte 服务端类型

Surge Mac 和 Apple TV 可作为服务端或客户端，而 iOS 设备仅支持客户端模式。

配置服务端时，有三种穿透方式可选：

类型	适用场景	说明
直接 NAT 穿透	Full Cone NAT 网络	依赖路由器和运营商，通常无法人为改变
代理 NAT 穿透	任意网络	需借助支持 UDP 转发的代理，会消耗代理流量
静态端口转发	有公网 IP	需在路由器配置端口映射，适合高级用户

使用场景

外出时访问家中 NAS、监控摄像头
远程调试智能家居设备
使用家庭网络的代理策略上网

前提条件

正版 Surge 授权（Mac/iOS/tvOS）
服务端与客户端登录同一 iCloud 账户

配置步骤

以 Apple TV 作为 Ponte 服务端为例：

1. 选择穿透类型

在局域网内打开 Apple TV 上的 Surge，进入 Ponte 设置，根据网络情况选择合适的穿透类型。

我使用的是静态端口转发，需在路由器放行 UDP 6208 端口，具体操作参考端口转发配置指南。

2. 设置设备名称

为 Ponte 服务端设置一个易于识别的名称，例如 HOMETV。

3. 添加代理规则

在客户端 Surge 配置中添加规则，将家庭网段的流量指向 Ponte 设备：

[Rule]
# 将 192.168.2.0/24 网段的请求通过 Ponte 设备转发
IP-CIDR,192.168.2.0/24,DEVICE:HOMETV

:::note 请将 192.168.2.0/24 替换为你的实际家庭网段，HOMETV 替换为你设置的设备名。 :::

4. 验证连接

断开 Wi-Fi，使用蜂窝网络测试访问家庭内网资源（如路由器管理页面 192.168.2.1），确认 Ponte 连接正常。

Nginx Proxy Manager 使用指南

Thu, 26 Dec 2024 00:00:00 GMT

什么是 Nginx Proxy Manager

Nginx Proxy Manager 是一个开源的 Nginx 管理工具，旨在简化 Nginx 的配置和管理。它提供了一个 Web 界面，允许用户轻松地管理多个 Nginx 虚拟主机和反向代理。

:::tip Nginx Proxy Manager 通常简称 npm，这与前端的包管理工具 Node Package Manager 缩写同名，因此在使用时需要注意区分。 :::

为什么需要 Nginx Proxy Manager

如果需要将内网服务暴露到外网，首先需要使用端口转发，将端口暴漏到公网中，如果我们有多个服务，就需要配置多个端口转发，这样不仅非常麻烦，而且还不方便管理，且多个端口暴漏还较为危险，因此我们可以使用 Nginx Proxy Manager 来管理多个反向代理。

安装

我使用的是 docker-compose 安装的，docker-compose.yml 文件如下：

version: '3.8'
services:
nginx-proxy-manager:
    image: 'jc21/nginx-proxy-manager:latest'
    restart: unless-stopped
    ports:
      - '8880:80'
      - '81:81'
      - '8443:443'
    volumes:
      - ./nginx-proxy-manager/data:/data
      - ./nginx-proxy-manager/letsencrypt:/etc/letsencrypt

注意：

端口 81 是 NPM 的 Web 端口，80 是 HTTP 端口，443 是 HTTPS 端口。
由于家庭网络(一般 80、443 端口被运营商屏蔽)中部署的 npm 服务，因此需要将端口映射为 80 -> 8880、443 -> 8443。
数据和证书存储在 ./nginx-proxy-manager/data 和 ./nginx-proxy-manager/letsencrypt 目录中。
请根据需要调整端口和路径。

配置

浏览器进入 http://127.0.0.1:81 ，默认账号密码是 admin@example.com 和 changeme ，登录后会提示你修改密码。

证书申请

首先需要添加域名并申请证书，点击 SSL Certificates -> Add SSL Certificate -> Let's Encrypt
在 Domain Names 处，添加你的域名，可以直接申请泛域名证书(例如 *.mihouo.com)，Email Address for Let's Encrypt 填写你的邮箱。
开启 Use a DNS Challenge，DNS Provider处选择你的域名服务商，在 Credentials File Content 处，将 dns_cloudflare_api_token 修改为你的 DNS 令牌(这篇文章有申请指南使用 ddns-go 进行动态域名解析)。
同意 Let's Encrypt 的条款，点击 Save 按钮，等待完成证书申请。

添加反向代理

点击 Hosts -> Proxy Hosts -> Add Proxy Host
在 Domain Name 处，填写你的域名(需要携带二级域名)，我这里以 alist 服务为例，填写 alist.mihouo.com
在 Forward Hostname 处，填写你的内网服务地址，我这里以 alist 服务为例，填写 192.168.2.2，Forward Port 填写你的服务端口，我这里是 5244
选项 Cache Assets、Block Common Exploits、Websockets Support 可以按需开启。
在 SSL 处，选择你刚刚申请的证书。开启 Force SSL 选项，其余选择可以按需开启。点击 Save 按钮，完成反向代理添加。

验证

浏览器打开 https://alist.mihouo.com:8443 ，如果配置正确，则可以看到 alist 的页面。

:::tip 需要放行对应端口，如果配置正确，但是无法访问，请检查防火墙和安全组配置。如果你也是家庭宽带，请参考端口转发开启内网 npm 映射的 443 端口转发到公网任何你想作为后缀访问的端口。 :::

最后

Nginx Proxy Manager 是一个非常强大的反向代理工具，可以让你通过域名访问到内网中的服务，也可以方便的申请证书并使用。且只需要放行一个对外端口即可，非常方便。

使用 ddns-go 进行动态域名解析

Wed, 25 Dec 2024 00:00:00 GMT

什么是 ddns-go

ddns-go 是一款开源的动态域名解析（DDNS）工具，旨在帮助用户将公网 IP 动态更新到 DNS 服务商，以便通过域名访问家庭网络、服务器或其他设备，即使公网 IP 是动态分配的。

为什么需要 ddns-go

公网 IP 地址大多是动态的，所以你需要定期更新公网 IP 地址，而使用 ddns-go 可以自动更新公网 IP 地址，从而实现公网 IP 地址的动态更新。

如何使用 ddns-go

我这里使用 docker 来安装 ddns-go，如果你没有使用 docker ，可以参考 docker 安装教程来安装 docker。

docker-compose.yml 文件如下：

services:
  ddns-go:
    image: jeessy/ddns-go
    container_name: ddns-go
    restart: always
    ports:
      - '9876:9876'
    volumes:
      - ./ddns-go:/root

安装好后，启动容器：

docker-compose up -d

配置 ddns-go

浏览器访问 http://127.0.0.1:9876，设置初始账号密码，然后点击 保存 按钮。

然后选择你的域名解析的服务商，我这里使用的是 Cloudflare，输入你的 DNS Token。

登录 Cloudflare
点击左侧菜单 管理账户 -> 账户API令牌 -> 创建令牌
创建 编辑区域 DNS 令牌，在区域资源处选择你的域名，在权限处选择 编辑
创建好后，复制 令牌
将令牌粘贴到 ddns-go 的 DNS Token 处

在 Domains 处，添加你的域名，然后点击 保存 按钮。

如果需要可以配置 WebHook，进行变更通知。

最后点击左上角 保存 按钮，完成配置。

验证

配置完成后，通过 http://<域名>:端口，即可访问到你的内网服务。

例如 http://mihouo.com:5244 访问到我的 alist 服务。

最后

ddns-go 可以让你通过域名访问到内网服务，而无需担心公网 IP 地址的变化。

端口转发

Tue, 24 Dec 2024 00:00:00 GMT

什么是端口转发

端口转发（Port Forwarding）是一种将特定网络端口上的流量从一个设备或网络转发到另一个设备或网络的技术。通常，端口转发在路由器或防火墙上配置，用于将外部访问请求引导到内部网络的特定设备或服务。

原理

端口转发的工作原理如下：

外部请求：用户从互联网向路由器的公共 IP 地址发送请求，并指定特定端口（如 http://<公网IP>:8080）。
路由器处理：路由器收到该请求后，根据配置的端口转发规则，将该请求转发到内网中指定的 IP 地址和端口（如 192.168.2.2:5244）。
服务响应：内网设备处理请求并返回结果，通过路由器将响应数据发送回外部用户。

前提条件

内网有部署服务
拥有公网 IP 地址
有光猫的超级密码，且光猫支持端口转发，或者光猫更改为桥接模式，使用路由器拨号上网，并配置端口转发

光猫设置

我这里使用的是光猫进行拨号上网，所以需要进入光猫后台进行设置。一般情况下光猫背面标签有配置地址，以及用户名密码。但是这里通常是普通用户，没有权限进行设置。需要使用超级用户进行设置。

这里我是在闲鱼上购买服务，找人帮我获取到了光猫的超级密码，并将超级密码进行了固定。

以我的光猫型号中兴 G7615 为例

登录光猫后台 http://192.168.2.1/cu.html
选择 “高级配置” -> “NAT 设置” -> “虚拟主机配置”
填写 名称、协议、广域网起始端口、广域网结束端口、虚拟主机IP地址、虚拟主机端口
- 名称：自定义，例如 AppleTV-alist
- 协议：TCP 或 UDP,根据你部署的服务类型选择
- 广域网起始端口：5244 公网访问的端口
- 广域网结束端口：5244 公网访问的端口
- 虚拟主机IP地址：192.168.2.2 内网服务部署的 IP 地址
- 虚拟主机端口：5244 内网服务部署的端口
点击添加

如上添加完成后，如果你拥有公网 IP 地址，则可以通过 http://<公网IP>:5244 访问到内网中的服务。

如下图，我这里部署的是一个 alist 服务

最后

端口转发的配置，可以让你通过公网 IP 地址访问到内网中的服务。但是它也有一些缺点：

大多数家庭宽带没有公网 IP 地址，需要申请，且不一定能申请到
公网 IP 地址大多是动态的，所以你需要定期更新公网 IP 地址。 (可以使用 ddns-go 来解决)
- ddns-go配置教程

我的 Apple TV 观影方案

Mon, 23 Dec 2024 00:00:00 GMT

流媒体平台

国内流媒体平台

因为Apple TV 并没有在大陆地区发售，因此国内流媒体平台也没有在 TV 端的 Apple Store 上架。因此只能选择爱优腾等国内流媒体的海外版观看，但是海外版资源较少，且会员订阅与国内不互通，且价格昂贵，非常不推荐购买使用。但是有 Apple 开发者开发的第三方流媒体平台比如 Bilibili 可以完美解决这个问题。

BiliBili(需要使用第三方 App 如 Cheers、MiaoProject、弹幕播放器等)

国外流媒体平台

Emby

介绍

Emby 是一款跨平台的多媒体服务器软件，旨在帮助用户管理和流式传输其个人媒体内容（如视频、音乐、照片等）。它能够通过 Web 浏览器、移动设备、智能电视等多种设备访问和播放本地媒体内容，为用户提供家庭媒体中心的解决方案。

服类型

公益服：资源和稳定性看服主，我目前使用的公益服还可以，可直连，资源丰富度一般
公费服：价格便宜(5左右/月)，国内看地区可以直连，非直连时需要使用代理服务
机场服：购买机场附赠的 Emby 服，稳定性较好，资源丰富
付费服：价格较贵(20左右/月)，可以国内直连，资源丰富，稳定性较好

优缺点

优点：
- 价格便宜，免费版或者价格极低的公费服
- 画质清晰，码率相较于国内流媒体平台较高
- 支持任何操作系统，包括 Windows、Linux、macOS、Android、iOS 等
- 内容丰富，包括电影、电视剧、动漫、综艺、纪录片等，且无删减
- 无需自主管理片源，热播剧集、电影、综艺等更新及时
- 资源丰富，包括国内、国外、港台、日韩、欧美等
缺点：
- 通常来说公益服、公费服、机场服的稳定性较差，容易出现无法访问的情况
- 服务器通常位于国外，初始加载速度较慢，不过有国内付费服，价格较贵(一般 20/月)
- 每个服资源不同，需要自行甄别
- 没有弹幕(因人而异，有人喜欢，有人不喜欢)

我目前使用的 Emby 服

网盘挂载

阿里云盘: 使用infuse、forward、vidhub 等第三方 App 可以挂载阿里云盘。

:::tip 如果你使用的客户端不支持挂载你的网盘，如夸克、pikpak等，可以使用 alist 挂载网盘。它可以将多个网盘挂载到一起，并提供 webdav 服务，支持 infuse、forward、vidhub 等第三方 App 挂载。 :::

观影App

Infuse 完成度较高，也是现在唯一一个支持真杜比视界的 App
Forward 完成度较低，但是UI非常好看
VidHub 完成度很高，国内媒体平台知名度较高，但是由于某些原因被很多 Emby 服禁止，因此并不推荐购买
Senplay 完成度较高
Conflux cheers 作者新开发的软件
Reflix 目前仅有TestFlight 版本

总结

Apple TV 的观影体验还是非常不错的，尤其是使用 Emby 服，可以非常方便的观看各种电影、电视剧、动漫、综艺、纪录片等。

你所要支付的成本只有第三方 App 的买断费用，以及 Emby 服的订阅费用。

ClawCloud 新加坡机器留档测试

Mon, 23 Dec 2024 00:00:00 GMT

机器详情

CPU 1 vCPU
内存 1 GiB
存储 20 GiB
带宽 1000 Mbps
流量 500 GB

一键脚本

::github{repo="spiritLHLS/ecs"}

curl -L https://gitlab.com/spiritysdx/za/-/raw/main/ecs.sh -o ecs.sh && chmod +x ecs.sh && bash ecs.sh

详情

--------------------- A Bench Script By spiritlhl ----------------------
                   测评频道: https://t.me/vps_reviews                    
VPS融合怪版本：2024.11.08
Shell项目地址：https://github.com/spiritLHLS/ecs
Go项目地址：https://github.com/oneclickvirt/ecs
---------------------基础信息查询--感谢所有开源项目---------------------
 CPU 型号          : Intel(R) Xeon(R) Platinum
 CPU 核心数        : 1
 CPU 频率          : 2500.002 MHz
 CPU 缓存          : L1: 32.00 KB / L2: 1.00 MB / L3: 33.00 MB
 AES-NI指令集      : ✔ Enabled
 VM-x/AMD-V支持    : ❌ Disabled
 内存              : 368.71 MiB / 907.96 MiB
 Swap              : [ no swap partition or swap file detected ]
 硬盘空间          : 3.22 GiB / 19.20 GiB
 启动盘路径        : /dev/vda1
 系统在线时间      : 23 days, 23 hour 37 min
 负载              : 0.53, 0.14, 0.05
 系统              : Ubuntu 22.04.5 LTS (x86_64)
 架构              : x86_64 (64 Bit)
 内核              : 5.15.0-122-generic
 TCP加速方式       : cubic
 虚拟化架构        : KVM
 NAT类型           : Full Cone
 IPV4 ASN          : AS45102 Alibaba (US) Technology Co., Ltd.
 IPV4 位置         : Singapore / Singapore / SG
----------------------CPU测试--通过sysbench测试-------------------------
 -> CPU 测试中 (Fast Mode, 1-Pass @ 5sec)
 1 线程测试(单核)得分:          1117 Scores
---------------------内存测试--感谢lemonbench开源-----------------------
 -> 内存测试 Test (Fast Mode, 1-Pass @ 5sec)
 单线程读测试:          3994.02 MB/s
 单线程写测试:          4090.81 MB/s
------------------磁盘dd读写测试--感谢lemonbench开源--------------------
 -> 磁盘IO测试中 (4K Block/1M Block, Direct Mode)
 测试操作               写速度                                  读速度
 100MB-4K Block         14.0 MB/s (3427 IOPS, 7.47s)            13.1 MB/s (3190 IOPS, 8.02s)
 1GB-1M Block           159 MB/s (151 IOPS, 6.61s)              147 MB/s (139 IOPS, 7.15s)
-------------IP质量检测--基于oneclickvirt/securityCheck使用-------------
数据仅作参考，不代表100%准确，如果和实际情况不一致请手动查询多个数据库比对
以下为各数据库编号，输出结果后将自带数据库来源对应的编号
ipinfo数据库  [0] | scamalytics数据库 [1] | virustotal数据库   [2] | abuseipdb数据库   [3] | ip2location数据库    [4]
ip-api数据库  [5] | ipwhois数据库     [6] | ipregistry数据库   [7] | ipdata数据库      [8] | db-ip数据库          [9]
ipapiis数据库 [A] | ipapicom数据库    [B] | bigdatacloud数据库 [C] | cheervision数据库 [D] | ipqualityscore数据库 [E]
IPV4:
安全得分:
声誉(越高越好): 0 [2] 
信任得分(越高越好): 0 [8] 
VPN得分(越低越好): 100 [8] 
代理得分(越低越好): 100 [8] 
社区投票-无害: 0 [2] 
社区投票-恶意: 0 [2]
威胁得分(越低越好): 100 [8] 
欺诈得分(越低越好): 4 [1] 
滥用得分(越低越好): 0 [3] 
ASN滥用得分(越低越好): 0.0012 (Low) [A] 
公司滥用得分(越低越好): 0.0054 (Low) [A] 
威胁级别: low [9 B] 
黑名单记录统计:(有多少黑名单网站有记录):
无害记录数: 0 [2]  恶意记录数: 0 [2]  可疑记录数: 0 [2]  无记录数: 94 [2]  
安全信息:
使用类型: DataCenter/WebHosting/Transit [3] hosting [0 7 9 A] hosting - high probability [C] business [8]
公司类型: hosting [0 7 A] 
是否云提供商: Yes [7] No [D]
是否数据中心: Yes [0 1 5 6 A C] No [8]
是否移动设备: No [5 A C] 
是否代理: No [0 1 4 5 6 7 8 9 A B C D] 
是否VPN: Yes [A] No [0 1 6 7 C D]
是否Tor: No [0 1 3 6 7 8 A B C D] 
是否Tor出口: No [1 7 D] 
是否网络爬虫: No [9 A B] 
是否匿名: No [1 6 7 8 D] 
是否攻击者: No [7 8 D] 
是否滥用者: No [7 8 A C D] 
是否威胁: No [7 8 C D] 
是否中继: No [0 7 8 C D] 
是否Bogon: No [7 8 A C D] 
DNS-黑名单: 314(Total_Check) 0(Clean) 7(Blacklisted) 17(Other) 
Google搜索可行性：YES
-------------邮件端口检测--基于oneclickvirt/portchecker开源-------------
Platform  SMTP  SMTPS POP3  POP3S IMAP  IMAPS
LocalPort ✔     ✔     ✔     ✔     ✔     ✔    
QQ        ✘     ✔     ✔     ✘     ✔     ✘    
163       ✘     ✔     ✔     ✘     ✔     ✘    
Sohu      ✘     ✔     ✔     ✘     ✔     ✘    
Yandex    ✘     ✔     ✔     ✘     ✔     ✘    
Gmail     ✘     ✔     ✘     ✘     ✘     ✘    
Outlook   ✘     ✘     ✔     ✘     ✔     ✘    
Office365 ✘     ✘     ✔     ✘     ✔     ✘    
Yahoo     ✘     ✔     ✘     ✘     ✘     ✘    
MailCOM   ✘     ✔     ✔     ✘     ✔     ✘    
MailRU    ✘     ✔     ✘     ✘     ✔     ✘    
AOL       ✘     ✔     ✘     ✘     ✘     ✘    
GMX       ✘     ✘     ✔     ✘     ✔     ✘    
Sina      ✘     ✘     ✔     ✘     ✔     ✘    
-----------------------全国延迟检测--本脚本原创-------------------------
 联通天津          73  | 联通福州          57  | 联通上海          66  |
 联通南充          76  | 联通太原          81  | 联通大连          90  |
 联通WuXi          64  | 电信长沙          185 | 电信扬州          203 |
 电信苏州          204 | 电信杭州          190 | 电信武汉          192 |
 电信宁波          198 | 电信兰州          203 | 电信南京          210 |
 电信Zhenjiang     200 | 移动福州          72  | 移动杭州          212 |
 移动成都          236 | 移动Beijing       214 | 移动杭州          218 |
--------------------自动更新测速节点列表--本脚本原创--------------------
位置             上传速度        下载速度        延迟
Speedtest.net    210.69Mbps      1089.98Mbps     2.61ms
新加坡           218.12Mbps      1106.24Mbps     2.40ms
联通WuXi         16.15Mbps       184.33Mbps      64.94ms
联通上海5G       11.18Mbps       135.05Mbps      69.97ms
电信浙江         5.68Mbps        6.36Mbps        195.56ms
电信浙江         5.91Mbps        66.74Mbps       191.94ms
移动Fujian       5.60Mbps        5.09Mbps        223.96ms
移动Beijing      0.71Mbps        41.31Mbps       208.81ms
------------------------------------------------------------------------
 总共花费      : 5 分 22 秒
 时间          : Mon Dec 23 06:46:46 UTC 2024
------------------------------------------------------------------------

在前端项目中使用 Mock 服务

Tue, 24 Sep 2024 00:00:00 GMT

在前后端分离开发中，Mock服务是一种常用的技术手段，用于模拟后端接口，以便前端开发人员可以独立进行开发和测试。

什么是 Mock 服务

Mock 服务是一种技术手段，用于模拟后端接口，以便前端开发人员可以独立进行开发和测试。

为什么需要 Mock 服务

提高开发效率，通常前端开发人员需要等待后端接口开发完毕才能进行开发，而使用 Mock 服务可以让我们在开发过程中使用模拟数据进行开发和测试。

如何在项目中使用 Mock 服务

通常情况下，我们使用框架进行开发，比如 ice.js、umijs、next.js 等，这些框架都提供了 Mock 服务的支持。

但是也有一些项目没有使用框架，比如纯前端项目，这个时候我们就需要自己搭建 Mock 服务。这时我们可以使用 Apifox 工具来作为 Mock 服务。

使用 Apifox 作为 Mock 服务

安装 Apifox 工具
通常由后端提供接口文档，并启用本地 Mock 服务，拿到 Mock 服务地址（例如：http://127.0.0.1:4523/m1/4945763-4603443-default/**/*）
修改前端项目中接口请求地址为 Mock 服务地址

3.1 通常我们会在项目中配置一个环境变量，用于区分开发环境和生产环境，env.development 添加以下配置

# apifox mock base url
REACT_APP_APIFOX_BASE_API=http://127.0.0.1:4523/m1/4945763-4603443-default

3.2 在开发环境中，我们将接口请求地址配置为 Mock 服务地址, 请求拦截器中添加如下代码

service.interceptors.request.use(
  (config: InternalAxiosRequestConfig) => {
    const { isApifoxMock = false } = config.customConfig || {};
    if (isApifoxMock) {
      config.baseURL = process.env.REACT_APP_APIFOX_BASE_API;
    }
    return config;
  },
  error => {
    return Promise.reject(error);
  },
);

3.3 配置接口自定义参数(isApifxiMock === true) 如果你是用的是 typescript，需要在 src 目录下的 types.d.ts 文件中添加如下代码

declare module 'axios' {
  export interface AxiosRequestConfig {
    customConfig?: {
      isApifoxMock?: boolean; // 是否是 apifox mock
    }
  }
}

启动项目，访问接口，查看 Mock 数据
后端提供接口后，更改接口自定义参数 isApifxiMock === false，即可访问真实接口数据

总结

Mock 服务在前端开发中扮演着非常重要的角色，它可以帮助我们快速实现前后端分离开发，提升开发效率和测试效果。

Fusion 组件库 DatePicker2 组件选择异常行为

Thu, 05 Sep 2024 00:00:00 GMT

今天下午，同事又遇到了一个奇怪的 Bug，这次是在 Fusion 组件库中的 DatePicker2 组件上。简单描述如下：有两个日期选择框，分别是开始日期和结束日期，先点击结束日期选择框，随便选择一个日期，提示选择失败，并提示“请先选择开始日期”，然后这时结束日期并不会成功选择，因为在 onChange 事件中会判断开始日期是否已经选择，如果没有选择则不会更新结束日期。但是这个时候，开在选择开始日期，选择成功后，再次选择结束日期，重点是并不需要选择具体日期，而是将弹框打开，再关闭，这时结束日期就会成功选择了。而选择的日期是第一次选择失败的那个日期。

<video controls> <source src="/videos/datepick-bug-example.mov" type="video/mp4"> Your browser does not support the video tag. </video>

复现问题

打开 Fusion 官网，找到 DatePicker2 组件，然后在尺寸大小示例中修改代码如下：

function Demo() {
	const [first, setFirst] = React.useState('');
	const [second, setSecond] = React.useState('');
	return (
		<div>
			<DatePicker2 value={first} onChange={(_, str) => {
				setFirst(str);
			}} />
			<DatePicker2 value={second} onChange={(_, str) => {
				if (!first) {
					return;
				}
				setSecond(str);
			}} />

		</div>
	);
}
ReactDOM.render(<Demo />, mountNode);

先选择第二个日期选择框，然后选择一个日期，会提示选择失败，然后选择第一个日期选择框，选择一个日期，再次选择第二个日期选择框，不选择具体日期，只是打开弹框，然后关闭，这时选择成功。

这样就可以复现这个问题了。

分析问题

这个问题看起来很奇怪，第一次选择日期并不会成功，但是第二次选择日期就会成功，而且选择的日期是第一次选择失败的日期。这个问题看起来很像是一个状态更新的问题，因此我认为可能是因为 DatePicker2 组件在第一次选择失败是内部保存了这个结果，导致第二次选择日期时尽管没有选择具体日期，但是内部直接使用了第一次选择失败的日期。而我在 DatePicker2 组件文档中并没有重置状态的方法，因此我是用 key 来强制更新组件，这样就可以解决这个问题。

解决方案

function Demo() {
	const [first, setFirst] = React.useState('');
	const [second, setSecond] = React.useState('');
	return (
		<div>
			<DatePicker2 value={first} onChange={(_, str) => {
				setFirst(str);
			}} />
            {/*  使用 key 强制刷新组件  */}
			<DatePicker2 key={Date.now()} value={second} onChange={(_, str) => {
				if (!first) {
					return;
				}
				setSecond(str);
			}} />

		</div>
	);
}
ReactDOM.render(<Demo />, mountNode);

由于动画效果导致的页面渲染问题

Fri, 09 Aug 2024 00:00:00 GMT

昨天下午，同事再写新项目页面时发现了一个问题，由于这个项目的框架是我搭建的，这个问题大概是折叠、打开二级菜单时主视图的 Echart 图表显示异常，宽度没有自适应。

问题分析

在听他描述时，我第一想法是检查他的代码中是否在 resize 事件中调用了 chartInstance.resize 方法，因为 Echart 图表的宽度是根据容器的宽度来自适应的，所以在页面宽度发生变化时，需要调用 chartInstance.resize 方法来重新计算图表的宽度。

但是发现他调用了这个方法，但是 Echart 图表却没有任何变化，我就想到是否是因为切换二级菜单时，并没有触发 resize 事件，因为页面整体的宽度并没有发生改变，只是二级菜单的宽度发生了改变，所以我就使用 new Event('resize') 来手动触发 resize 事件；

const onChangeCollapse = () => {
  const resizeEvent = new Event('resize');
  window.dispatchEvent(resizeEvent);
	// ... 其他逻辑代码
};

这时切换二级菜单是否折叠时 chartInstance.resize 方法正常被调用了，图表的宽度也重新计算了，但是图表宽度确仍然异常，具体表现是，在二级菜单折叠时 Echart 图表却渲染的宽度较短，在二级菜单打开时 Echart 图表却渲染的宽度较长，超出屏幕范围。这一奇怪的现象起初令我很是疑惑。

然后我将 chartInstance.resize 调用放入 setTimeout 中并设置 1s 的延迟执行，发现一切都正常了，这时也打消了我刚刚的疑惑。

刚刚这一异常渲染表现是因为容器的宽度改变并不是实时的，而是有延迟，所以导致每次 chartInstance.resize 调用时都是以前一次的宽度进行渲染的。

既然找到了原因，问题就很容易解决了，只需要将 chartInstance.resize 放入 setTimeout 并以一个合理的延迟时间运行即可，我控制二级菜单折叠展开的动画持续时间是 0.3s，因此将setTimeout 第二个参数设置为 300，就解决了这个问题。

完美解决方案

在记录这个问题时突然想到，这样修改的话需要在每个 chartInstance.resize 都需要放入延时器中执行，有些麻烦，且未来如果更改了控制二级菜单折叠展开的动画持续时间就需要在每个页面都更改，不太方便，因此可以将手动触发 resize 事件放入setTimeout 中执行，那么动画已经结束，然后再触发 resize 事件，页面中接收到 resize 事件时对应的容器宽度也已经正常改变完成了。

const DEALY = 0.3;
const onChangeCollapse = () => {
  setTimeout(() => {
	  const resizeEvent = new Event('resize');
	  window.dispatchEvent(resizeEvent);
		// ... 其他逻辑代码
	}, DEALY * 100);
};

Vercel KV 存储可视化管理页面

Fri, 09 Aug 2024 00:00:00 GMT

前段时间将博客从 Notion 迁移到了 Vercel，发现了 Vercel 新功能 Storage，可以用来存储一些信息，我使用的是 KV Storage，但是 Vercel 并没有提供可视化的管理页面，这里就写了一个页面来管理 KV Storage。正好也可以趁此机会实践 Next.js 14。

项目地址

功能

使用 Next.js 14 全栈框架搭建，利用 Vercel SDK 来操作 KV Storage，实现string、hash、list、set、zset五种数据结构的增删改查。

使用方法

clone 项目
安装依赖 npm install
从 Vercel Storage 获取你的 secret key，将其添加到 .env.development.local 文件中
运行 npm run dev

项目截图

VSCode 中一个很实用的 React 代码片段

Tue, 06 Aug 2024 00:00:00 GMT

在 React 项目中，经常需要创建一个组件、页面。这个时候，我们可以使用代码片段来快速生成一个默认的模板。

通常情况下，我们需要创建一个组件，需要创建一个文件夹，然后在文件夹中创建一个 index.tsx 文件，然后在 index.tsx 文件中写入组件的代码。而定义在 index.tsx 中的组件名称通常情况下为文件夹的名称。但是 vscdoe 并没有提供一个变量用于获取当前文件夹的名称，而是只有当前文件夹的路径，因此需要使用正则匹配得到当前文件夹的名称。

这个时候，我们可以使用代码片段来快速生成一个默认的模板。

首先，需要创建一个新的用户代码片段，打开 VSCode 的命令面板（cmd + shift + p），输入 “Preferences: Configure User Snippets”，然后选择 “New Global Snippets file…”。

如果你使用了 typescript 则直接替换成如下代码：

{
  "React Functional Component": {
    "prefix": "rfc",
    "body": [
      "const ${1:${TM_DIRECTORY/^.+\\/(.*)$/$1/}}: React.FC = () => {",
      "  return (",
      "    <div>$1</div>",
      "  );",
      "};",
      "",
      "export default $1;"
    ],
    "description": "Create a React functional component with folder name"
  }
}

如果你使用的是 javascript 则删除 body 中第一行的 : React.FC 即可。

使用时只需要输入 rfc 然后按下 tab 键即可生成一个默认的模板。

使用 ReactDOM.createPortal 重写组件

Wed, 17 Jul 2024 00:00:00 GMT

最近在做一个新项目，这个项目的有一个交互的规范是搜索条件默认是隐藏的然后点击一个过滤器 Icon，展示那些搜索条件，由于我们部门是后来加入的这个项目，在此基础上做一些定制开发，也要遵循这一规范，但是我看到已经有其他开发编写完成了这个组件，但是我认为这样编写的组件扩展性和可维护性比较差，因此我打算使用 ReactDOM.createPortal 重写这个组件。

组件预览

<video controls> <source src="/videos/preview-filter.mp4" type="video/mp4"> Your browser does not support the video tag. </video>

原组件

目前这个组件的使用方式，可以看到，实现这个组件需要引入两个组件，分别是 FilterIcon 和 FilterView ，其中 FilterIcon 是那个过滤器的 Icon 主要作用是点击展示隐藏搜索条件。

FilterView 主要是定义一些搜索条件，它这里将那些条件抽象了出来并传入 searchList 。

// 示例伪代码
import FilterIcon from "@/pages/LuZhiBI/components/FilterIcon/filterIcon";
import FilterView from "@/pages/LuZhiBI/components/FilterView";

const searchList: any[] = [
  {
    searchType: "string",
    searchComponentType: "input",
    placeHolder: "请输入指标名称",
    title: "指标名称",
    key: "indicatorName",
  },
  {
    searchType: "string",
    searchComponentType: "multipleSelect",
    placeHolder: "请选择指标类型",
    title: "指标类型",
    key: "indicatorType",
    options: options.classificationOfIndicatorsOptions,
    mode: "multiple",
    defaultValue: options.classificationOfIndicatorsOptions.map(item => item.value),
  },
  {
    searchType: "text",
    searchComponentType: "dateRangeTime",
    showTime: true,
    title: "创建时间",
    key: "createdAt",
  },
];

<div className={styles.container}>
  <div className={styles.headBox}>
    ...
    <div className={styles.searchBox}>
      ...
      <FilterIcon handleFilterClick={handleFilterClick} filterTitle="过滤器" />
      ...
    </div>
  </div>

  <FilterView ref={filterViewRef} searchList={searchList} finish={onFinish} defaultFormValue={defaultSearchInfo} />
</div>

从上可以看出，有几点不足之处

一个功能却需要引入两个组件配合
需要手动获取 FilterView ref，并使用 handleFilterClick 控制展示隐藏
searchList 定义复杂，并且不利于自定义的一些配置（需要修改原组件，在内部做一些业务适配，随着项目的不断迭代，组件内部会变得相当庞大，且难以维护，之前做的一个项目就出现了类似的问题），在定义searchList 时没有 typescript 提示，失去了使用它的意义。

新组件

在打算写这个组件之前，我想到了 Vue 中的 **Teleport** 内置组件，它可以将组件内部的元素传送到目标 dom 节点位置，因此我在想是否 React 中有一个类似的装件，然后我就发现了**ReactDOM.createPortal**，它可以实现类似 Teleport 的功能。

详细解释

ReactDOM.createPortal：该方法接受两个参数：第一个参数是渲染的子元素，第二个参数是目标 DOM 节点。

对于现在的需求，这个组件需要实现两部分，一个是固定的过滤器 Icon，另一个是需要被传送到目前位置的 children，最终实现代码如下。

import { type FC, useEffect, useState } from 'react';
import ReactDOM from 'react-dom';
import { Button, Tooltip } from 'antd';
import { FilterOutlined } from '@ant-design/icons';
import { motion } from 'framer-motion';

interface IProps {
  hoverTitle: string;
  nodeID: string;
  children?: React.ReactNode;
}

const FilterIcon: FC<IProps> = props => {
  const { hoverTitle = '过滤器', nodeID, children } = props;
  const [node, setNode] = useState<any>(null);
  const [height, setHeight] = useState<string | number>(0);
  const filterClick = () => {
    if (height === 0) {
      setHeight('auto');
    } else {
      setHeight(0);
    }
  };
  useEffect(() => {
    const targetNode = document.getElementById(nodeID);
    setNode(targetNode);
  }, [nodeID]);
  return (
    <>
      <Tooltip placement="bottom" title={hoverTitle}>
        <Button
          onClick={filterClick}
          icon={
            <FilterOutlined
              style={{
                fontSize: 16,
              }}
            />
          }
          type="text"
        ></Button>
      </Tooltip>
      {node &&
        ReactDOM.createPortal(
          <motion.div
            animate={{ height }}
            className="filter-conditions"
            style={{
              height: 0,
              overflow: 'hidden',
              width: '100%',
              backgroundColor: '#f5f5f5',
              borderRadius: 4,
              marginTop: 10,
              padding: '0 16px',
            }}
          >
            {children}
          </motion.div>,
          node,
        )}
    </>
  );
};
export default FilterIcon;

使用方式

使用时只需要引入 Filter ，并在合适的位置建立一个空的 div 节点 <div id="filter-main" />，并指定节点 id，并将它传入给 Filter 组件即可，过滤条件则直接作为 children 写入 Filter 组件内部即可。

// 示例伪代码
import Filter from '@/pages/LuZhiBI/components/Filter';

<div className={styles.DatasetView}>
  <div className={styles.titleBox}>
    <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center' }}>
      <div className={styles.filterBox}>
        <Filter hoverTitle="过滤器" nodeID="filter-main">
          <Form 
          name="filter"
          onFinish={onFinish}
          autoComplete="off"
          initialValues={{
            date: [],
            indicator: [''],
          }}
          >
            <Row gutter={16} style={{ marginTop: 16 }}>
              <Col span={8}>
                <Form.Item<FieldType>
                  label="日期"
                  name="date"
                  rules={[{ required: true, message: '请选择查询日期' }]}
                >
                  <RangePicker style={{ width: '100%' }} />
                </Form.Item>
              </Col>
              <Col span={8}>
                <Form.Item<FieldType>
                  label="指标"
                  name="indicator"
                  required
                  rules={[{
                    validator: (_rule, value) => {
                      if (!value && value !== '') {
                        return Promise.reject('请选择指标');
                      }
                      return Promise.resolve();
                    }
                  }]}
                >
                  <Select mode='multiple' options={indicatorOptions} />
                </Form.Item>
              </Col>
              <Col span={8}>
                <Flex justify="flex-end">
                  <Form.Item>
                    <Space size="small">
                      <Button htmlType="reset">
                        重置
                      </Button>
                      <Button type="primary" htmlType="submit">
                        查询
                      </Button>
                    </Space>
                  </Form.Item>
                </Flex>
              </Col>
            </Row>
          </Form>
        </Filter>
      </div>
    </div>
    <div id="filter-main" />
  </div>
</div>

Steam 家庭共享库预览 - 部署

Tue, 18 Jun 2024 00:00:00 GMT

2024 年 7 月 31 日更新内容：

今天新购买了台香港的服务器，因此这个项目又复活了，地址仍然是 www.steamhome.xyz, 26号所说计划的也将继续进行。

2024 年 7 月 26 日更新内容：

由于 GCP 300 美金体验的账号到期机器停机，导致部署的服务挂了，目前手上没有国外的服务器，因此线上服务展示停止服务，但是我又发现使用 Vercel 的 KV Datebase 可以实现类似于数据库的功能，可以用于存储 steam key，因此我打算使用 Next.js 14（全栈框架） 重写这个项目。但是由于 Vercel 的 KV Datebase 并没有提供可视化的管理页面，因此我计划如下：

先使用 Next.js 14 搭建 Vercel 的 KV Datebase 可视化面板并开源到 Github
使用 Next.js 14（全栈框架）重写 Steam 家庭共享库预览项目。

相比服务端开发和客户端开发遇到的问题来所，部署时遇到的问题更为复杂。

首先遇到的就是服务器的网络环境，由于部署时只拥有一台国内的腾讯云服务器，我将后台服务部署上去后，发现请求总是失败，通过服务运行日志发现是服务请求 Steam Web API 时由于网络原因被拒绝，这时我通过 ChatGPT 询问解决方法，它给出使用代理访问，但是网上被没有免费可靠的代理，但是刚好那段时间我购买了 GCP 300 美金体验的账号，创建了 GCP 服务器，搭建了代理，但是由于未知原因导致搭建的代理仍然无法请求。这时我就改变了想法将服务直接部署到 GCP 服务器上。

GCP 部署

首先按照该文章安装所需要的环境

安装宝塔

GCP 服务器由于默认没有 hostname 导致安装失败，需要设置它然后就能正常安装。参考文章

代码移入服务器中

我选择的是将代码提交到 GitHub 私人仓库种，然后通过服务器生成 SSH，将公钥放到 GitHub SSH 管理中。

启动后台服务

将代码 clone 后安装 npm 依赖，通过宝塔的网站菜单管理项目

由于此项目还用到了数据库，我一开始并没有设置数据库账号密码，导致有人攻击给我数据库清空，并新建了个库，库名的大概意思是如果想要恢复数据需要支付 ustd。还好我这里的数据并不是重要的。但是为了后续再被攻击，需要开启数据库权限。

启用访问控制

需要编辑 MongoDB 的配置文件（通常是 /etc/mongod.conf）并启用访问控制。找到 security 部分，并确保设置了以下配置：

security:
  authorization: enabled

进入 MongBD 数据库

mongo
# 或者
mongosh

创建用户

use admin
db.createUser({
  user: "adminUser",
  pwd: "adminPassword",
  roles: [ { role: "root", db: "steam-shared" } ] // 赋予这个账号访问 steam-shared 数据库的权限
})

重启 MongoDB 服务

sudo systemctl restart mongod

更改连接数据库

账号密码的配置

module.exports = {
  DB_HOST: 'localhost',
  DB_PORT: 27017,
  DB_NAME: 'steam-shared',
  DB_USER: 'adminUser',
  DB_PASS: 'adminPassword',
}

连接数据库

const mongoose = require('mongoose');
const config = require('../config/db');

module.exports = (success, error) => {
  mongoose.connect(`mongodb://${config.DB_USER}:${encodeURIComponent(config.DB_PASS)}@${config.DB_HOST}:${config.DB_PORT}/${config.DB_NAME}?authSource=admin`, {
    useNewUrlParser: true,
    useUnifiedTopology: true,
  })
    .then(() => {
      console.log('Database connection successful');
      success();
    })
    .catch((err) => {
      console.error('Database connection error:', err);
      error(err);
    });
};

部署客户端

客户端通过 npm run build:prod 命令打包后使用宝塔 PHP 项目部署，将网站目录设置成打包后生成的文件夹即可

经过上述部署这时应该可以通过 ip:port 访问项目了，但是这样十分难以记忆，这时就需要使用域名了，由于国内购买的域名需要备案使用，所以我在国外域名服务商购买了个便宜域名

这时只需要进行域名解析和记录添加就可以通过 www.steamhome.xyz 访问页面了。

首先在 GCP 生成一个 DNS 解析

然后在域名管理中添加解析

等待几分钟ping 这个域名直到能够 ping 通

然后再在 GCP 处配置 A 记录

项目也需要配置添加域名

比如请求后台服务没配置之前只能通过 http://35.220.167.240:3001/api/tracking/data 去请求，配置后则可以通过 http://api.steamhome.xyz/api/tracking/data 请求。

页面也是同理可以通过 www.steamhome.xyz 访问。

SSL

如果需要通过 https 访问则需要添加 SSL 证书，通过宝塔可以一键配置 Let's Encrypt 证书

记录一下装 Debian 环境

Wed, 05 Jun 2024 00:00:00 GMT

我使用的是 Google Cloud 创建的实例，它默认是不开启 ssh 登录的，为了统一管理服务器，我使用的是 Termius。

开启 SSH 登录

通过内置的 SSH 窗口进入终端

终端中设置 root 用户的密码

# 进入 root 用户
sudo -i
# 设置密码
passwd

修改 sshd_config文件中的 PermitRootLogin 和 PasswordAuthentication

vi /etc/ssh/sshd_config

重启服务器
通过 Termius 登录

登录成功后如下图所示

安装 nvm

1. 更新系统包

首先，确保你的系统包是最新的：

sudo apt update
sudo apt upgrade -y

2. 安装NVM

你可以使用以下命令从NVM的GitHub仓库安装NVM：

curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.7/install.sh | bash

**请注意，**v0.39.7 是NVM的版本号，你可以检查 NVM的GitHub页面以获取最新版本。

3. 加载NVM

安装完成后，你需要将NVM加载到你的shell会话中。你可以通过以下命令来实现：

export NVM_DIR="$([ -z "${XDG_CONFIG_HOME-}" ] && printf %s "${HOME}/.nvm" || printf %s "${XDG_CONFIG_HOME}/nvm")"
[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh" # This loads nvm

为了在每次启动shell时自动加载NVM，你可以将上述命令添加到你的shell配置文件中，例如~/.bashrc、~/.zshrc或~/.profile：

echo 'export NVM_DIR="$([ -z "${XDG_CONFIG_HOME-}" ] && printf %s "${HOME}/.nvm" || printf %s "${XDG_CONFIG_HOME}/nvm")"' >> ~/.bashrc
echo '[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh"' >> ~/.bashrc

然后，重新加载shell配置文件：

source ~/.bashrc

4. 验证NVM安装

你可以通过以下命令验证NVM是否安装成功：

nvm -v

5. 安装Node.js

使用NVM安装Node.js的最新LTS版本：

nvm install --lts

你也可以安装特定版本的Node.js，例如：

nvm install 14.17.0

6. 设置默认Node.js版本

你可以使用以下命令设置默认的Node.js版本：

# 查看安装的 node 版本列表
nvm list
# 设置 默认版本
nvm alias default 14.17.0

7. 验证Node.js和npm安装

最后，验证Node.js和npm是否安装成功：

node -v
npm -v

安装 MongoDB 6

添加针对 Ubuntu 的源：

echo "deb [ arch=amd64,arm64 signed-by=/usr/share/keyrings/mongodb-server-6.0.gpg ] https://repo.mongodb.org/apt/ubuntu jammy/mongodb-org/6.0 multiverse" | sudo tee /etc/apt/sources.list.d/mongodb-org-6.0.list

添加签名

curl -fsSL https://pgp.mongodb.com/server-6.0.asc | \
   sudo gpg -o /usr/share/keyrings/mongodb-server-6.0.gpg \
   --dearmor

更新apt 并安装 mongodb

sudo apt update && sudo apt install mongodb-org -y

启动MongoDB服务

安装完成后，启动MongoDB服务

sudo systemctl start mongod

设置MongoDB服务开机自启

设置MongoDB服务在系统启动时自动启动

sudo systemctl enable mongod

验证MongoDB安装

检查MongoDB服务的状态，确保它正在运行

sudo systemctl status mongod

看到类似于以下的输出，表示MongoDB服务正在运行

安装 Git

更新APT包数据库

首先，确保你的APT包数据库是最新的

sudo apt update

安装Git

使用以下命令安装Git

sudo apt install git -y

验证Git安装

安装完成后，你可以使用以下命令验证Git是否安装成功

git -v

安装 PM2

已经安装了 Node.js 和 npm后，全局安装 PM2

npm install -g pm2

使用 PM2 启动你的 Node.js 项目。例如，如果你的项目入口文件是 main.js

pm2 start main.js --name "steam-shared-service"

检验项目是否运行成功

使用 apifox 请求服务项目中的接口

Steam 家庭共享库预览 - 客户端设计与实现

Fri, 31 May 2024 00:00:00 GMT

2024 年 7 月 31 日更新内容：

复活了

2024 年 7 月 26 日更新内容：

暂时停止服务，原因见此

地址： https://www.steamhome.xyz

客户端的开发较为简单，我在这里大致讲一下背后的流程。

首先，进入页面先向后台发送请求看是否有可用的 Steam Key，如果没有的话，提示用户输入自己的 key，并且右上角状态图标发生改变，用于提示用户。

如果用户输入了可用的 key 则判断 key 是否可用，如果可用则改变状态，提示用户可以填写 Steam id 进行查询。

在用户填写了 steam id 后进行请求，将多个玩家的游戏库存进行并集操作，并记录每一个游戏被哪个玩家拥有（用一个字段记录subordinate），然后右侧表格进行渲染，表格行为单个游戏，列为玩家，交叉出用刚刚记录的subordinate 判断该玩家是否拥有这款游戏。游戏名称小眼睛 icon 点击后提供该玩家进入这个家庭后能玩到哪些不属于 Ta 的游戏，实现逻辑也是使用了subordinate 字段。

预览

首页

添加

添加成功信息提示

查看玩家能游玩的新游戏列表

其他

Steam 家庭共享库预览 - 服务端设计与实现

Fri, 31 May 2024 00:00:00 GMT

在这篇文章中，我将介绍如何设计和实现一个基于 Node.js 和 Express 框架的服务端项目，提供 Steam 家庭共享库的预览功能。我们将聚焦于一个名为 gamers 的接口，该接口接收 ids 参数，并返回对应的游戏信息。

技术栈选择

在构建服务端项目时，选择合适的技术栈是成功的关键。对于本项目，我们选择了 Node.js 和 Express 框架。选择这两者的原因如下：

Node.js：Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行时，具有非阻塞、事件驱动的特点，非常适合构建高并发的应用程序。
Express：Express 是一个快速、简洁的 Node.js Web 应用框架，提供了一系列强大的功能来帮助开发者快速构建 Web 应用和 API。

接口设计

主要用到的 Steam Web API 接口如下

• 获取用户信息: http://api.steampowered.com/ISteamUser/GetPlayerSummaries/v0002/

• 获取用户拥有的游戏: http://api.steampowered.com/IPlayerService/GetOwnedGames/v0001/

• 获取游戏详细信息: http://store.steampowered.com/api/appdetails

接口实现

app.post('/get/gamers', async (req, res) => {
  try {
    const { ids, key: reqKey = '' } = req.body;
    if (!ids || ids?.length === 0) {
      res.send({
        code: 400,
        data: null,
        msg: '请输入用户 id',
        success: false,
      });
    }
    const key = reqKey || await getKey();
    if (!key) {
      res.send({
        code: 500,
        data: null,
        msg: '无可用key',
        success: false,
      });
    }
    const resPlayerSummaries = await service({
      url: '/ISteamUser/GetPlayerSummaries/v0002/',
      params: {
        steamids: ids.join(','),
        format: 'json',
        key,
      },
      instance: 'IPlayerService',
      method: 'get',
    }).then(res => {
      if (res.response.players) {
        return res.response.players;
      }
      return [];
    });
    if (resPlayerSummaries.length === 0) {
      res.send({
        code: 400,
        data: null,
        msg: '输入的用户 id 均无效',
        success: false,
      })
    }
    const resAllGames= await Promise.allSettled(resPlayerSummaries.map(player => {
      if (player.communityvisibilitystate === 1) {
        return Promise.resolve({games: [], steamid: player.steamid});
      }
      return service({
        url: '/IPlayerService/GetOwnedGames/v0001/',
        params: {
          steamid: player.steamid, // 76561198391051438
          format: 'json',
          key,
        },
        instance: 'IPlayerService',
      }).then(res => {
        if (res.response?.games) {
          return {games: res.response.games, steamid: player.steamid};
        }
        return {games: [], steamid: player.steamid};
      })
    })).then(res => {
      return res.map(res => res.value);
    });
    const allGamesIds = [...new Set(...[resAllGames.map(res => res?.games.map(game => game.appid))].map(ids => ids.flat()))];
    const resGames = await Promise.allSettled(allGamesIds.map(appid => {
      return service({
        url: '/api/appdetails?appids',
        params: {
          appids: appid,
          l: 'schinese',
          cc: 'cn',
          format: 'json',
          filters: 'basic,price_overview,categories',
          key,
        },
        instance: 'Storefront',
      }).then(res => {
        const data = Object.values(res)[0];
        if (data.success) {
          return data.data;
        }
        return {
          steam_appid: appid,
          success: false,
        };
      }).catch(err => {
        return {
          steam_appid: appid,
          success: false,
        };
      });
    }));
    const successGames = resGames.filter(game => (game.value?.success ?? true));
    const failGames = resGames.filter(game => !(game.value?.success ?? true));
    const result = [];
    ids.forEach((id, index) => {
      const cur = resPlayerSummaries.find(player => player.steamid === id);
      if (!cur) {
        return;
      }
      if (cur.communityvisibilitystate === 1) {
        result.push({
          isPublic: false,
          user: cur,
          stock: [],
          failGameId: [],
        });
        return;
      }
      const curUserGameIds = resAllGames.find(res => res?.steamid === id)?.games.map(game => game.appid);
      result.push({
        isPublic: true,
        user: cur,
        stock: successGames.filter(game => curUserGameIds?.includes(game.value.steam_appid)).map(game => game.value),
        failGameId: failGames.filter(game => curUserGameIds?.includes(game.value.steam_appid)).map(game => game.value.steam_appid),
      });
    });
    res.send({
      code: 200,
      data: result,
      msg: 'success',
      success: true,
    });
  } catch (e) {
    console.log(e);
    res.send({
      code: 500,
      msg: e === '无可用key' ? e : '服务器错误',
      success: false,
    });
  }
});

接口测试

无入参

随机输入的 steamid

真实存在的 steamid

Steam 家庭共享库预览-原型设计

Tue, 23 Apr 2024 00:00:00 GMT

原型地址

Steam 家庭共享库预览-前言

Fri, 19 Apr 2024 00:00:00 GMT

最近 Steam 推出了一种新的游戏库家庭共享方案，简单来说支持六个用户组建成新的家庭，而这五个人可以游玩所有成员的游戏（即并集）。同时相比过去老的家庭共享功能，新的Steam家庭中玩家可以在其他玩家在线的同时游玩家庭库列表中的共享游戏，也支持离线访问，但是需要注意的是同一款游戏不能共同访问，除非这款游戏在家庭库中有多个副本。这一方案刚推出引起了很多玩家的热烈讨论，并有很多玩家在社区内寻找优质成员组建成新的家庭。

由于加入到家庭中再退出存在一年的冷却期（离开后席位也有一年的冷却期），所以为了避免玩家在加入家庭后失望不满，所以我想着利用 Steam Web API 开发出一个 Web 应用，方便各位玩家在加入前知晓自己加入后可以获得哪些新游戏的游玩权限而开发。

可行性

利用 Steam Web API 可以查看用户的库存，因此在理论上是可行的。

通过 http://api.steampowered.com/ISteamWebAPIUtil/GetSupportedAPIList/v1/?key=xxx&steamids=xxx 接口可以获取该key可用的所有API信息，通过查询表明我的 key 可以使用一个名为 GetOwnedGames 的接口查询用户的库存信息。

{
    "name": "GetOwnedGames",
    "version": 1,
    "httpmethod": "GET",
    "description": "Return a list of games owned by the player",
    "parameters": [
        {
            "name": "key",
            "type": "string",
            "optional": false,
            "description": "Access key"
        },
        {
            "name": "steamid",
            "type": "uint64",
            "optional": false,
            "description": "The player we're asking about"
        },
        {
            "name": "include_appinfo",
            "type": "bool",
            "optional": false,
            "description": "true if we want additional details (name, icon) about each game"
        },
        {
            "name": "include_played_free_games",
            "type": "bool",
            "optional": false,
            "description": "Free games are excluded by default.  If this is set, free games the user has played will be returned."
        },
        {
            "name": "appids_filter",
            "type": "uint32",
            "optional": false,
            "description": "if set, restricts result set to the passed in apps"
        },
        {
            "name": "include_free_sub",
            "type": "bool",
            "optional": false,
            "description": "Some games are in the free sub, which are excluded by default."
        },
        {
            "name": "skip_unvetted_apps",
            "type": "bool",
            "optional": true,
            "description": "if set, skip unvetted store apps"
        },
        {
            "name": "language",
            "type": "string",
            "optional": false,
            "description": "Will return appinfo in this language"
        },
        {
            "name": "include_extended_appinfo",
            "type": "bool",
            "optional": false,
            "description": "true if we want even more details (capsule, sortas, and capabilities) about each game.  include_appinfo must also be true."
        }
    ]
}

技术选型

服务端

由于 Steam Web API 接口返回的数据格式对于我来说并不是很友好，因此我这里使用 Node.js 对接口预先进行处理封装，再将其提供给前端直接使用。

客户端

使用 React + Ant Design 进行开发。

准备工作

获取 Steam Web API 的 key。

访问 https://steamcommunity.com/dev/apikey 如果没有 key 则按照指示创建一个。

如下如所示。

使用 antv/g2 绘制'旭日图'

Mon, 15 Apr 2024 00:00:00 GMT

为什么标题中的旭日图打双引号呢，是因为虽然它的样式长得像是旭日图，但是数据结构却和旭日图所需要的相差远。

在官方示例中，旭日图的数据结构是父节点不设置值的大小，而是由它的所有子节点累加确认的。因此，旭日图是**父节点一定对应一个或者多个子节点，且这些子节点不能超过内圈父节点的范围。**而现在产品想要的效果是父节点和子节点没有关联，只是父节点的值需要等于子节点的累加值（这里的父节点由两部分组成），这样的话子节点一定会跨过这两个父节点的临界，产品原型如下

径向堆叠条形图

因此，旭日图并不满足这个需求，我和产品反映了这个问题，他说让我使用径向堆叠条形图试试，在我一番调试下，发现这个虽然在外观上能实现这样的图形，但是在其他的很多方面都是不符合需求的。

使用径向堆叠图实现的效果

由于径向堆叠图的数据结构通常是同一组类型在不同状态（时期）下的数据，而这个需求的数据结构是不同类型在在不同状态（时期）的数据，所以导致它有诸多问题

主要就是 tooltip 展示问题

内层展示还算是正常

外层展示就完全不对应了

我猜测这是由于径向堆叠图的数据结构设计是想要展示内外侧是相同的，但是这里我给出的数据确实不同的，而它展示的逻辑可能是，由 chart.data.transform 的 fields 数组中定义所有字段依次展示。

这是会导致 tooltip 不对应的问题。

const data = [
  {
    State: '',
    天猫: 25,
    天猫_购买: 15,
    京东: 20,
    京东_购买: 10,
    抖音: 10,
    抖音_购买: 5,
    微信: 10,
    微信_购买: 5,
  },
  {
    State: ' ',
    百利: 5,
    百利_购买: 5,
    尊尼获加: 5,
    尊尼获加_购买: 5,
    帝亚吉欧: 10,
    帝亚吉欧_购买: 10,
  },
];

// chart.data 如下
{
  value: data,
  transform: [
	  {
		  type: 'fold',
		  fields: ['天猫', '天猫_购买', '京东', '京东_购买', '抖音', '抖音_购买', '微信', '微信_购买', '百利', '百利_购买', '尊尼获加', '尊尼获加_购买', '帝亚吉欧', '帝亚吉欧_购买'],
		  key: 'key',
		  value: '会员总数',
		  retains: ['State'],
		},
	],
}

最终解决方案

最后我想到 echart 中之前画过嵌套饼图，但是在 antv/g2（v5）版本的图标示例中并没有嵌套饼图的例子，查看文档发现，实现双视图需要使用到复合实现，我们这里的需求是视图的层叠，因此使用的是空间复合。

按照官方示例很容易就绘制出了嵌套饼图，但是这里会出现图形大小层叠的问题，导致外层图形的 tooltip 无法正常使用。这是因为每个圆环实际上是在一个正方形的区域内绘制的，这个区域的大小是由圆环的直径决定的。如果你创建了两个嵌套的圆环，后一个圆环可能会在事件处理上覆盖前一个圆环，导致前一个圆环的tooltip失效。具体表现图如下

而我在文档中并没有发现能够改变这一规则的属性，因此我想如果改变内圈直径，使其大小不遮挡外层圆环，这样的话就不会影响外层 tooltip 触发。最后我使用 attr 修改圆环的宽高，然后再使用coordinate.outerRadius 和 coordinate.innerRadius 修改圆环视觉上的大小，最终实现代码如下

const data1 = [
  { item: '天猫', bgColor: '#e8b038', count: 20, percent: 0.2 },
  { item: '天猫-purchase', bgColor: '#e8b038', type: 'purchase', count: 10, percent: 0.1 },
  { item: '京东', bgColor: '#528df3', count: 10, percent: 0.1 },
  { item: '京东-purchase', bgColor: '#528df3', type: 'purchase', count: 10, percent: 0.1 },
  { item: '抖音', bgColor: '#ff3d72', count: 20, percent: 0.2 },
  { item: '抖音-purchase', bgColor: '#ff3d72', type: 'purchase', count: 10, percent: 0.1 },
  { item: '微信', bgColor: '#00a54e', count: 15, percent: 0.15 },
  { item: '微信-purchase', bgColor: '#00a54e', type: 'purchase', count: 5, percent: 0.05 },
];

const data2 = [
  { item: '帝亚吉欧', bgColor: '#9ecbfb', count: 10, percent: 0.1 },
  { item: '帝亚吉欧-purchase', type: 'purchase', bgColor: '#9ecbfb', count: 5, percent: 0.05 },
  { item: '尊尼获加', bgColor: '#add7fc', count: 7, percent: 0.07 },
  { item: '尊尼获加-purchase', type: 'purchase', bgColor: '#add7fc', count: 3, percent: 0.03 },
  { item: '百利', bgColor: '#bfe2fd', count: 3, percent: 0.03 },
  { item: '百利-purchase', type: 'purchase', bgColor: '#bfe2fd', count: 2, percent: 0.02 },
  { item: 'not-show', bgColor: 'transparent', count: 70, percent: 0.7 },
];

// 创建图表实例
const chart = new Chart({
  container: 'channel-members',
  height: 311,
});
const layer = chart.spaceLayer();

layer
  .interval()
  .data(data2)
  .coordinate({ type: 'theta', outerRadius: 1.1, innerRadius: 0.82 })
  .transform({ type: 'stackY' })
  .attr('x', 640 / 2 - 150)
  .attr('y', 311 / 2 - 150)
  .attr('width', 300)
  .attr('height', 300)
  .encode('y', 'percent')
  .style('fill', (d: any) => {
    const result = {
      image: lines({
        backgroundColor: d.bgColor,
        backgroundOpacity: 0.6,
        stroke: d.bgColor,
        lineWidth: 1,
        spacing: 0,
      }),
      repetition: 'repeat',
      transform: 'rotate(30deg)',
    }
    if (d.type === 'purchase') {
      result.image = lines({
        backgroundColor: 'transparent',
        backgroundOpacity: 0.6,
        stroke: d.bgColor,
        lineWidth: 1,
        spacing: 10,
      });
    }
    return result;
  })
  .interaction('tooltip', { disableNative: true })
  .tooltip((data) => {
    if (data.item === '') {
      return '';
    }
    return {
      name: data.item,
      value: `${data.percent * 100}%`,
    }
  });

layer
  .interval()
  .data(data1)
  .coordinate({ type: 'theta', outerRadius: 3.2, innerRadius: 1.6 })
  .transform({ type: 'stackY' })
  .attr('x', 640 / 2 - 50)
  .attr('y', 311 / 2 - 50)
  .attr('width', 100)
  .attr('height', 100)
  .encode('y', 'percent')
  .style('fill', (d: any) => {
    const result = {
      image: lines({
        backgroundColor: d.bgColor,
        backgroundOpacity: 0.6,
        stroke: d.bgColor,
        lineWidth: 1,
        spacing: 0,
      }),
      repetition: 'repeat',
      transform: 'rotate(30deg)',
    }
    if (d.type === 'purchase') {
      result.image = lines({
        backgroundColor: 'transparent',
        backgroundOpacity: 0.6,
        stroke: d.bgColor,
        lineWidth: 1,
        spacing: 10,
      });
    }
    return result;
  })
  .tooltip((data) => ({
    name: data.item,
    value: `${data.percent * 100}%`,
  }));

chart.on(`element:${ChartEvent.POINTER_OVER}`, ({ data }) => {
  if (data.data.item === 'not-show') {
    return;
  }
  chart.emit('tooltip:show', { data })
});
chart.on(`element:${ChartEvent.POINTER_MOVE}`, ({ data }) => {
  if (data.data.item === 'not-show') {
    return;
  }
  chart.emit('tooltip:show', { data })
});
chart.on(`plot:${ChartEvent.POINTER_OVER}`, () => chart.emit('tooltip:hide'));

chart.render();

由于只有天猫拥有子店铺，所以外层圆环是不完整的，这里使用 data.item === 'not-show' 控制是否显示，实现是通过style.fill 填充透明色。如果不设置这一项的话，剩下的项会填充整个圆环，不符合需求。这样设置后将鼠标放置到外层空白区域仍然会触发 tooltip，这里我的解决方案是使用自定义交互事件，判断是否 data.item === 'not-show' 为 true，如果不是则触发 tooltip 。

最终实现效果如下

使用 antv/g2 绘制双圈交集图形

Thu, 11 Apr 2024 00:00:00 GMT

最近在开发新项目，但是这个项目由其他部门搭建的，使用了和我们原先不同的图表图。我们组原先使用的是 echarts 而这个项目使用的是 antv/g2 ，由于之前并没有使用过这个图表图，特此记录一下

乍一看觉得这个实现起来并不复杂，使用韦恩图即可实现，随即上官网查看韦恩图示例，一步步修改配置，最终实现出来如下样子的图

实现代码如下

chart
  .path()
  .data({
    type: 'inline',
    value: [
      { sets: ['A'], size: 15, label: '购买人数', value: 19992 },
      { sets: ['B'], size: 15, label: '会员总数', value: 29992 },
      { sets: ['A', 'B'], size: 6, label: '会员购买人数', value: 9992 },
    ],
    transform: [
      {
        type: 'venn',
      },
    ],
  })
  .encode('d', 'path')
  .encode('color', 'key')
  .encode('shape', 'hollow')
  .label({
    position: 'inside',
    text: (a) => `${a?.label}\n${formatNumOfOptions(a?.value, { digit: 0 })}`,
    style: {
      fontSize: 12,
      fontWeight: 500,
      fill: '#1890FF',
    },
  })
  .style('lineWidth', 1)
  .style('lineDash', [7, 4])
  .style('fill', (d) => {
    if (d.sets.length === 1) {
      if (d.sets[0] === 'A') {
        return '#3BA0FF';
      }
      return '#4DCB73';
    }
    return '#cdecf2';
  })
  .style('fillOpacity', 0.1)
  .legend(false)
  .tooltip(false);

观察上图很容易看出这与设计图有两处不同，分别是交汇处的线条颜色，以及 label 的位置

首先解决交汇处线条颜色，让它们在交汇处仍然用自身原本的颜色，使用 style 实现，代码如下

style('stroke', (d) => {
  if (d.key === 'A') {
    return '#1890FF';
  }
  if (d.key === 'B') {
    return '#4DCB73';
  }
  return 'transparent';
})

而解决 label 位置就稍微麻烦一些，需要自定义渲染 label ，查了下文档，发现自定义渲染使用 label.render 函数

使用 render 函数自定义渲染 html 标签，配合 css 属性transform: translate 进行偏移最终实现标签的自定义位置，具体实现代码如下

render: (_, datum) => {
  if (datum.key === 'A') {
    return `
      <div style="font-weight: 500; color: #1890FF; transform: translate(-80px, -20px)">
        <p style="font-size: 12px">${datum.label}</p>
        <p style="font-size: 14px">${formatNumOfOptions(datum.value, { digit: 0 })}</p>
      </div>
    `;
  }
  if (datum.key === 'B') {
    return `
      <div style="font-weight: 500; color: #4DCB73; transform: translate(30px, -20px);">
      <p style="font-size: 12px">${datum.label}</p>
      <p style="font-size: 14px">${formatNumOfOptions(datum.value, { digit: 0 })}</p>
      </div>
    `;
  }
  return `
    <div style="font-weight: 500; color: #00BBFF; transform: translate(-36px, -20px);">
    <p style="font-size: 12px">${datum.label}</p>
    <p style="font-size: 14px">${formatNumOfOptions(datum.value, { digit: 0 })}</p>
    </div>
  `;
}

这时你会发现虽然 label 标签正确的进行了偏移但是在偏移原点时会出现蓝色方块，如下图所示

这是因为使用了CSS来样式化标签，将 label.style.fill 属性删除即可，最终代码如下

const chart = new Chart({
      container: 'user-assets',
      height: 311,
    });

    chart
      .path()
      .data({
        type: 'inline',
        value: [
          { sets: ['A'], size: 15, label: '购买人数', value: 19992 },
          { sets: ['B'], size: 15, label: '会员总数', value: 29992 },
          { sets: ['A', 'B'], size: 6, label: '会员购买人数', value: 9992 },
        ],
        transform: [
          {
            type: 'venn',
          },
        ],
      })
      .encode('d', 'path')
      .encode('color', 'key')
      .encode('shape', 'hollow')
      .label({
        position: 'inside',
        text: (a) => `${a?.label}\n${formatNumOfOptions(a?.value, { digit: 0 })}`,
        style: {
          fontSize: 12,
        },
        render: (_, datum) => {
          if (datum.key === 'A') {
            return `
              <div style="font-weight: 500; color: #1890FF; transform: translate(-80px, -20px)">
                <p style="font-size: 12px">${datum.label}</p>
                <p style="font-size: 14px">${formatNumOfOptions(datum.value, { digit: 0 })}</p>
              </div>
            `;
          }
          if (datum.key === 'B') {
            return `
              <div style="font-weight: 500; color: #4DCB73; transform: translate(30px, -20px);">
              <p style="font-size: 12px">${datum.label}</p>
              <p style="font-size: 14px">${formatNumOfOptions(datum.value, { digit: 0 })}</p>
              </div>
            `;
          }
          return `
            <div style="font-weight: 500; color: #00BBFF; transform: translate(-36px, -20px);">
            <p style="font-size: 12px">${datum.label}</p>
            <p style="font-size: 14px">${formatNumOfOptions(datum.value, { digit: 0 })}</p>
            </div>
          `;
        },
      })
      .style('lineWidth', 1)
      .style('lineDash', [7, 4])
      .style('fill', (d) => {
        if (d.sets.length === 1) {
          if (d.sets[0] === 'A') {
            return '#3BA0FF';
          }
          return '#4DCB73';
        }
        return '#cdecf2';
      })
      // 交汇处描边的线条颜色维持它们各自的颜色
      .style('stroke', (d) => {
        if (d.key === 'A') {
          return '#1890FF';
        }
        if (d.key === 'B') {
          return '#4DCB73';
        }
        return 'transparent';
      })
      .style('fillOpacity', 0.1)
      .legend(false)
      .tooltip(false);
    chart.render();

记录分享我使用的一些提升效率的工具

Fri, 29 Mar 2024 00:00:00 GMT

截图

目前在使用 Snipaste

可以很方便的截图、贴图，并在图片上添加一些简单的指示图案和文本。

对于我来说也有些不足之处，比如不能长截图，不能截图提取文字。

前段时间发现了另一款截图工具 PinPin 可以解决我的需求，但是由于我使用的是 mac ，而这个软件暂时未推出 mac 版本。官方预计 2024 年 3月推出 mac 测试版，但是截止 2024 年 3 月 29 日暂未推出。

翻译

Easydict

GitHub 开源软件，一个简洁优雅的词典翻译 macOS App。开箱即用，支持离线 OCR 识别，支持有道词典，🍎 苹果系统词典，🍎 苹果系统翻译，ChatGPT，Gemini，DeepL，Google，Bing，腾讯，百度，阿里，小牛，彩云和火山翻译。

它支持划词翻译、截图翻译，并支持配置多个翻译源。由于它支持OCR截图翻译，所以在需要截图提取文字时也可以很方便提取文字。

记录分享我使用的一些 Ai 相关的工具

Mon, 18 Mar 2024 00:00:00 GMT

代码

由于 GitHub Copilot 是订阅制，且价格比较昂贵，所以我一般使用一些价格很低的方案使用，比如 Github 学生包（截止当前 2024 年 03 月 18 日基本不可用），目前替代方案是上淘宝上车（价格一般 5 块钱一个月 40 左右一年，~~稳定性暂时未知~~（稳定性很差，基本不可用））。

2024-03-07在 linux.do 论坛拼车板块上了付费拼车（2024-04-23翻车）

GitHub Copilot 不可用时，我通常是临时使用 **CodeGeeX （免费，且效果较好）。**

翻车时拼车车主也有推荐，我在去年 8 月份左右时使用过这个插件，当时的体验效果和GitHub Copilot 还有些差距，如今使用体验还是不错的。

目前（2024 年 06 月 18 日，已经稳定使用近一月）又切换到了使用 GitHub Copilot。使用的是 GitHub 学生包权益。购买地址、补货通知TG频道

问答

ChatGPT ~~（官网3.5）~~ （macOS ChatGPT 客户端 4o、超出限制后使用 3.5）
Coze （字节海外平台，免费使用 GPT-4）
PlusAI （低价使用 GPT-4 Turbo (128k) ）

UU 免费接口（api 调用 ~~每天签到 5 $~~（目前已经不能签到领取额度了，听说也要关站了））

写作

Notion AI（淘宝 8 元一月）

setCookie 异步导致的问题案例

Fri, 15 Mar 2024 00:00:00 GMT

最近有个新需求，用户登录后如果是黑名单用户的话，则不允许访问页面，并弹出提示。

由于这个项目的登录并非传统的用户名、密码登录，而是通过京东服务市场订阅软件，通过按钮重定向跳转并配合 setCookie 操作登录。详情如下：

这里一开始和后端商量的方案是判断 cookie 的 token 字段是否存在，如果不存在则为黑名单用户，然后前端再处理打开遮罩并提示用户。

在这种情况下，由于setCookie是异步操作，可能会导致以下问题：

逻辑错误：由于setCookie是异步的，可能会导致在判断黑名单用户之前 cookie 还未被设置，导致判断逻辑错误。
用户体验问题：用户可能会在 cookie 还未被设置的情况下就看到页面内容，然后才收到黑名单提示，这样会导致用户体验不佳。
不稳定性：异步操作可能会导致不稳定的行为，因为异步操作的完成时间是不确定的，无法保证每次都能如期完成。

为了解决这个问题，你可以考虑以下方案：

Loading 界面：在设置 cookie 期间显示一个 Loading 界面，确保在 cookie 设置完毕前用户无法看到页面内容。
延迟执行：设置一个定时器，在一定时间后再检查 cookie 是否设置成功，如果还未设置成功，则提示用户。
与后端沟通：与后端进行合作，讨论是否可以在登录成功后返回一个标识，而不是依赖于 cookie。
后端检测：后端先提前检测是否是黑名单用户，如果是的话则重定向到 /black 路由

最终我们选择了方案 4！通过在后端进行黑名单用户检测，可以避免前端异步操作导致的问题，确保用户体验和逻辑的准确性。

在这个方案中，后端负责判断用户是否为黑名单用户，并且做出相应的跳转，前端则根据后端的响应进行重定向并传递参数，以此来实现对黑名单用户的处理。这样可以简化前端的处理逻辑，确保页面重定向和参数传递的准确性。

吐槽项目中下载接口的请求封装

Fri, 15 Mar 2024 00:00:00 GMT

前两天有个需求，页面中有个导出的按钮，需要导出报表，一开始后端给出的接口请求方式是 get 方式，但是考虑到未来可能请求的入参条件会非常多，可能会超过 url 长度最大值，所以将请求方式修改成了 post 请求。

但是将请求方式修改后发现，接口报了异常，查看原因是因为入参格式，在项目中发现这个项目将所有下载相关的接口的入参都改成了 formData 格式的，而后端并没有以此格式接收导致的。

处理下载请求配置方法如下：

const download = (requestUrl, method, instanceName, data) => {
  const formData = new FormData();
  if (data.bodyParams) {
    Object.keys(data.bodyParams).forEach((key) => {
      formData.append(key, data.bodyParams[key]);
    });
  } else {
    Object.keys(data).forEach((key) => {
      formData.append(key, data[key]);
    });
  }

  const req = {
    url: formatDownloadRequestV2(requestUrl, data),
    method: method.toUpperCase(),
    data: formData,
    headers: {
      'Content-Type': 'multipart/form-data',
      filename: 'utf-8',
    },
    responseType: 'blob',
    baseURL: config[`${instanceName ?? 'base'}URL`],
  };
};

在修改这个问题是又发现了另外一个可能存在的问题就是 formatDownloadRequestV2 方法处理 url 时，如果是 get 请求并含有参数时，它会忽略它的参数，函数代码如下：

const formatDownloadRequestV2 = (requestUrl, data) => {
  // 组织请求参数
  let url = requestUrl;
  if (Object.prototype.hasOwnProperty.call(data, 'pathParams')) {
    Object.keys(data.pathParams).forEach((key) => {
      url = requestUrl.replace(`{${key}}`, data.pathParams[key]);
    });
  }
  if (Object.prototype.hasOwnProperty.call(data, 'urlParams')) {
    Object.keys(data.urlParams).forEach((key, index) => {
      url = index === 0 ? (url += `?${key}=${data.urlParams[key]}`) : (url += `&${key}=${data.urlParams[key]}`);
    });
  }
  if (Object.prototype.hasOwnProperty.call(data, 'bodyParams')) {
    return requestUrl;
  }
  return url;
};

总得来说有两处需要修改的

不将所有的请求的参数都修改为 formData 格式
修改 formatDownloadRequestV2 函数，使其正常处理 get 请求的 url

对于修改点 1 的修改如下：

我们项目中的接口定义通常如下：

  // 主播绩效-下载对比数据
  downloadCompareDate: {
    url: '/anchorPerformance/comparison/export',
    method: 'POST',
    instanceName: 'live',
    isDownload: true,
  },

首先在接口定义中加入 noFormData 配置参数

  // 主播绩效-下载对比数据
  downloadCompareDate: {
    noFormData: true,
  },

然后修改 download 方法

// 添加 形参 noFormData
const download = (requestUrl, method, instanceName, data, noFormData) => {
  const req = {
    url: formatDownloadRequestV2(requestUrl, data, method.toUpperCase()),
    method: method.toUpperCase(),
    // 如果不需要转成 formData 格式 则直接 将 data 传入
    data: noFormData ? data : formData,
    headers: {
      'Content-Type': noFormData ? 'application/json' : 'multipart/form-data',
      filename: 'utf-8',
    },
    responseType: 'blob',
    baseURL: config[`${instanceName ?? 'base'}URL`],
  };
};

对于修改点 2 的修改如下：

const formatDownloadRequestV2 = (requestUrl, data, method) => {
  // 组织请求参数
  let url = requestUrl;
  // 添加一个标识 判断是否走入下面三个 if 的逻辑中
  let flag = true;
  if (Object.prototype.hasOwnProperty.call(data, 'pathParams')) {
    flag = false;
    Object.keys(data.pathParams).forEach((key) => {
      url = requestUrl.replace(`{${key}}`, data.pathParams[key]);
    });
  }
  if (Object.prototype.hasOwnProperty.call(data, 'urlParams')) {
    flag = false;
    Object.keys(data.urlParams).forEach((key, index) => {
      url = index === 0 ? (url += `?${key}=${data.urlParams[key]}`) : (url += `&${key}=${data.urlParams[key]}`);
    });
  }
  if (Object.prototype.hasOwnProperty.call(data, 'bodyParams')) {
    flag = false;
    return requestUrl;
  }
  // 修改 get 请求的 url
  if (flag && method === 'GET') {
    url += formatURL(data);
  }
  return url;
};

React setState 批处理机制引发的问题案例

Thu, 14 Mar 2024 00:00:00 GMT

React 的 useState 钩子用于在函数组件中添加状态。当你调用由 useState 返回的设置状态函数（通常命名为 setState）时，React 会安排一次组件的更新。但是，这些更新并不总是立即执行。React 有一个批处理（batching）机制，用于合并多个状态更新，从而减少不必要的重新渲染，提高应用性能。这个机制的工作原理和其对开发的影响是开发者需要理解的重要概念。

批处理机制的工作原理

事件处理中的批处理：在 React 事件处理器内部触发的状态更新（如用户点击按钮时触发的事件）会自动批处理。这意味着如果你在一个事件处理函数中连续调用多次 setState，React 会将这些更新合并为一次更新，并只触发一次重新渲染。这种批处理发生在 React 控制的事件处理函数中，如 onClick、onChange 等。
异步操作中的批处理：React 18 引入了自动批处理，这意味着即使在异步操作（如 setTimeout、Promise.then 或者任何不是 React 事件处理器触发的异步回调）中的状态更新也会被批处理。在 React 17 及之前版本，只有 React 控制的事件处理函数中的状态更新才会自动批处理，而异步操作中的状态更新不会被批处理。
手动批处理：如果你需要在不自动批处理的情况下强制批处理状态更新（例如，在 React 17 或更早版本的异步代码中），可以使用 ReactDOM.unstable_batchedUpdates() 函数。通过将更新封装在 unstable_batchedUpdates 的回调中，即使在异步操作中也可以实现批处理。

批处理的影响

性能提升：通过减少不必要的渲染次数，批处理机制可以显著提高应用的性能。
状态更新的合并：在批处理期间，React 会合并状态更新。如果你多次更新同一个状态，React 会以最后一次更新为准。
异步性质：setState 调用是异步的，React 会在稍后某个时间点应用状态更新。因此，立即读取状态更新后的值可能不会反映最新的状态。

案例

假设有一个页面，它有两个子组件，在页面初始化时需要请求接口，其中两个入参分别是这两个子组件通过事件抛出来的，伪代码如下

import React, { useState, useEffect } from 'react';

const ChildrenOne = (props) => {
  useEffect(() => {
    setTimeout(() => {
      props.onSendMsg('one');
    }, Math.random() * 3 * 1000);
  }, []);
  return <></>;
};
const ChildrenTwo = (props) => {
  useEffect(() => {
    setTimeout(() => {
      props.onSendMsg('two');
    }, Math.random() * 3 * 1000);
  }, []);
  return <></>;
};

export default () => {
  const [params, setParams] = useState({
    msg1: '',
    msg2: '',
  });
  const onSearch = () => {
    console.log(params);
  };
  const onEmitOne = (msg: string) => {
    setParams({
      ...params,
      msg1: msg,
    });
  };
  const onEmitTwo = (msg: string) => {
    setParams({
      ...params,
      msg2: msg,
    });
  };
  useEffect(() => {
    // 需要在 msg1 和 msg2 都 ready 之后再执行
    if (params.msg1 && params.msg2) {
      onSearch();
    }
  }, [params]);
  return (
    <>
      <ChildrenOne onSendMsg={onEmitOne} />
      <ChildrenTwo onSendMsg={onEmitTwo} />
    </>
  );
};

这时我们会发现onSearch 函数始终不会触发，这是因为setParams函数调用是异步的，而且每次调用都基于旧的params状态。在onEmitOne和onEmitTwo函数中，params的值在函数开始执行时就被确定了，不会因为状态更新而改变。因此，当onEmitOne和onEmitTwo函数几乎同时被调用时，它们获取到的params状态都是初始状态。这就导致了即使两个函数都调用了setParams，最后的结果也只会包含其中一个函数的更新。为了解决这个问题，你应该使用setParams的函数形式来更新状态，这样每次更新都会基于最新的状态进行。

为了解决这个问题，你可以对 setParams 使用函数形式的调用，这种形式的调用会包含最新的状态。如下代码所示：

const onEmitOne = (msg: string) => {
  setParams(prevParams => ({
    ...prevParams,
    msg1: msg,
  }));
};
const onEmitTwo = (msg: string) => {
  setParams(prevParams => ({
    ...prevParams,
    msg2: msg,
  }));
};

这样，无论 onEmitOne 和 onEmitTwo 函数何时被调用，setParams 都会基于最新的 params 状态进行更新，从而确保 onSearch 函数可以被正确触发。

这时 onSearch 函数虽然能正常触发，但是在之后还存在其他入参的改变导致频繁的接口请求，而我这里的需求是只在页面初始化时进行。

这时我的解决方案是讲onEmitOne 和 onEmitTwo 改造成异步函数，使用 Promise 将结果传递出去，这时在新创建一个getInitData 函数只在页面初始化时调用，这个函数的主要功能是拿到onEmitOne 和 onEmitTwo 返回的两个参数，将参数传递给onSearch 函数，并执行。这时也需要将 onSearch 函数改造能能接收入参的形式，实现代码如下：

export default () => {
  const [params, setParams] = useState({
    msg1: '',
    msg2: '',
  });
  const onSearch = (_param?: { msg1: string; msg2: string }) => {
    const { msg1, msg2 } = _param ?? {};
    const param = {
      msg1: msg1 ?? params.msg1,
      msg2: msg2 ?? params.msg2,
    };
    setParams({
      ...params,
      ...param,
    });
    console.log(param);
  };
  const onEmitOne = async (msg: string): Promise<string> => {
    return new Promise((resolve) => {
      resolve(msg);
    });
  };
  const onEmitTwo = async (msg: string): Promise<string> => {
    return new Promise((resolve) => {
      resolve(msg);
    });
  };
  const getInitData = async () => {
    const res = await Promise.all([onEmitOne('one'), onEmitTwo('two')]);
    onSearch({
      msg1: res[0],
      msg2: res[1],
    });
  };
  useEffect(() => {
    getInitData();
  }, []);
  return <></>;
};

罗技项目作为子系统嵌入的实现

Fri, 12 Jan 2024 00:00:00 GMT

为什么要改造成为子系统

由于现在的罗技项目采用Angular框架进行开发的，且该项目Bug非常多，不仅如此，考虑到未来罗技有开发二期的需求，加上目前前端团队对于Angular框架都不太熟悉。基于以上原因最合适的方案是把这个项目改造成子系统，未来二期在另个子系统使用前端团队都熟悉的React框架进行开发。

微前端技术选型

icestark 是一个面向大型系统的微前端解决方案，适用于以下业务场景：

后台比较分散，体验差别大，因为要频繁跳转导致操作效率低，希望能统一收口的一个系统内
单页面应用非常庞大，多人协作成本高，开发/构建时间长，依赖升级回归成本高
系统有二方/三方接入的需求

icestark 在保证一个系统的操作体验基础上，实现各个微应用的独立开发和发版，主应用通过 icestark 管理微应用的注册和渲染，将整个系统彻底解耦。

整体设计

主应用设计

使用2023年年中时重构的罗技项目将其改造成主应用，主要在这里实现登陆、权限、布局、菜单等一些全局配置

技术选型

接入

安装 @ice/stark

npm i --save @ice/stark

注册子应用

import { AppRouter, AppRoute } from '@ice/stark';

function Layout() {
  return (
    <div className="Layout">
      <AppRouter>
        <AppRoute
          activePath="/logitech"
          title="罗技angular一期"
          entry="http://127.0.0.1:4200"
          />
        <div style={{ padding: 20 }}>
          <Outlet />
        </div>
      </AppRouter>
    </div>
  )
}
export default Layout;

子应用设计（一期Angular项目）

使用 icestark 将罗技项目改造成子系统

接入

根据官方给出的Angular项目接入流程操作

问题

按照上方的操作正常接入并在主应用上添加对应的菜单，会发现有两个问题

图片、字体、图标等静态资源加载失败
通过菜单跳转切换页面不成功

静态资源加载失败问题解决方案

通过浏览器控制台->网络中可以看到，出现这个问题的原因是因为加载这些静态资源的路径不正确，它错误的以主应用为基准进行了请求

尝试的解决手段

配置webpack的publicPath属性（未解决）
配置index.html的base标签的href属性（未解决）

可以解决的方案

将项目中的静态资源上传到OSS对象存储中，在修改引用方式（可解决，但是项目中的静态资源非常多，修改起来非常耗时）
修改项目中的地址，改为绝对路径

最终选择方案2进行修改，具体修改如下

对于模版中的静态资源使用自定义创建的管道进行修改
对于组件中的静态资源使用自定义全局函数进行修改
对于样式文件中的静态资源使用scss变量拼接控制修改
对于使用到的 Ant Design of Angular 组件库的icon采用全局导入则能正常显示

模版

创建通道

在src->app文件夹下创建pipe文件夹，并创建 asset-url.pipe.ts 文件，内容如下

import { Pipe, PipeTransform } from '@angular/core';
import { assetUrl } from '@app/utils'

@Pipe({
  name: 'assetUrl'
})
export class AssetUrlPipe implements PipeTransform {

  transform(value: string, ...args: unknown[]): unknown {
    return assetUrl(value);
  }
}

导入的 assetUrl 函数在解决组件的静态资源问题时有介绍

创建 SharedModule

在src->app文件夹下创建shared文件夹，并创建 shared.module.ts 文件，内容如下

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { AssetUrlPipe } from '../pipe/asset-url.pipe';  // 更新为 assetUrl 管道的实际路径

@NgModule({
  declarations: [AssetUrlPipe],
  imports: [
    CommonModule
  ],
  exports: [AssetUrlPipe]  // 别忘了导出
})
export class SharedModule { }

在模版用使用管道

进入需要使用管道的页面的module中，导入SharedModule

import { SharedModule } from "@app/shared/shared.module";

在模版中使用管道

<img [src]="'/assets/images/1520.png' | assetUrl" alt="">

组件

创建全局函数

在src->app文件夹下创建utils文件夹，并创建 index.ts 文件，内容如下

export function assetUrl(url: string): string {
    // @ts-ignore
    const publicPath = __webpack_public_path__;
    const publicPathSuffix = publicPath.endsWith('/') ? '' : '/';
    const urlPrefix = url.startsWith('/') ? '' : '/';
    return `${publicPath}${publicPathSuffix}${urlPrefix}${url}`;
}

使用全局函数

进入需要使用管道的页面的component中，导入这个assetUrl

import { assetUrl } from '@app/utils';

使用assetUrl

const list = [
  {
    icon: assetUrl('assets/images/salesYoy.png'),
  },
];

样式文件

在样式文件下新增对应的地址，并使用

$assets-dev: 'http://127.0.0.1:4200/assets';

.toFullScreen{
  background:url(#{$assets-content-dev}/images/fullscreen.jpeg);
}

Icon

import * as AllIcons from '@ant-design/icons-angular/icons';

const antDesignIcons = AllIcons as {
  [key: string]: IconDefinition;
};
const icons: IconDefinition[] = Object.keys(antDesignIcons).map(key => antDesignIcons[key])

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    NzIconModule.forRoot(icons)
  ]
  bootstrap: [ AppComponent ]
})
export class AppModule {
}

效果展示

图片都加载成功

菜单跳转解决方案

未知原因导致的路由跳转失败调试中发现路由第一次跳转 NavigationCancel 时中断并保留在当前页面，报错信息如下

{
    "id": 3,
    "url": "/businessOverview",
    "reason": "Navigation ID 3 is not equal to the current navigation id 4"
}

路由跳转触发的完整事件流

NavigationStart: 在路由开始导航时触发。
RouteConfigLoadStart: 在 Router 对一个异步路由进行懒加载时触发。
RouteConfigLoadEnd: 在路由配置加载完成时触发。
RoutesRecognized: 在 Router 解析完 URL，并识别出了相应的一组针对该 URL 的路由配置时触发。
GuardsCheckStart: 在 Router 开始运行 CanActivate 和 CanDeactivate 守卫时触发。
ChildActivationStart: 当 Router 开始激活某个路由的子路由时触发。
ActivationStart: 当 Router 开始激活某个路由时触发。
GuardsCheckEnd: 当 Router 完成运行 CanActivate 和 CanDeactivate 守卫时触发。
ResolveStart: 当 Router 开始解析路由时触发。
ResolveEnd: 当路由解析完成时触发。
ChildActivationEnd: 当 Router 完成激活某个路由的子路由时触发。
ActivationEnd: 当 Router 完成激活某个路由时触发。
NavigationEnd: 在路由导航结束时触发。
NavigationCancel: 在路由导航被取消时触发（这可能是由于一个 guard 返回了 false）。
NavigationError: 在路由导航失败时触发。

如果在此基础上重新进入这个路由则能正常进入，通过这个机制，可以在路由跳转时使用setTimeout延时再进入一次，这时路由正确进入，但是页面并没有正常渲染(前一页面的内容仍然在页面上，当前页面的内容在这下方渲染，或着干脆就没有渲染)，这时可以通过让页面刷新解决，但是会牺牲一些用户体验

navigate(`/${menuInfo.key}`);
// 如果路径以/logitech/开头，就加载logitech的子应用
if (menuInfo.key.startsWith('logitech/')) {
  setTimeout(() => {
    navigate(`/${menuInfo.key}`);
    window.location.reload();
  }, 50);
}

子应用设计（二期React项目）

直接新建React项目即可

最终效果展示

利用font-face实现前端反爬虫

Wed, 22 Nov 2023 00:00:00 GMT

什么是爬虫

网络爬虫，是一个自动提取网页的程序，它为搜索引擎从万维网上下载网页，是搜索引擎的重要组成。

爬取数据主要分为：

从渲染好的 html 页面直接找到感兴趣的节点，然后获取对应的文本
去分析对应的接口数据，更加方便、精确地获取数据

为什么需要反爬虫？

网络爬虫会根据特定策略尽可能多的“爬过”网站中的高价值信息，占用服务器带宽，增加服务器的负载
恶意利用网络爬虫对Web服务发动DoS攻击，可能使Web服务资源耗尽而不能提供正常服务
恶意利用网络爬虫将免费查询的资源批量抓走，各种敏感信息，造成网站的核心数据被窃取，导致公司丧失竞争力。
状告爬虫成功的几率小，爬虫在国内还是个擦边球，就是有可能可以起诉成功，也可能完全无效。

制定出 Web 端反爬技术方案

从这2个角度（网页所见非所得、查接口请求没用）出发，制定了下面的反爬方案。

使用 HTTPS 协议
登陆态下，单位时间内限制掉请求次数过多（等级1），则降低频率给账号返回数据
登陆态下，单位时间内限制掉请求次数过多（等级2），则返回错误的数据给该账号
登陆态下，单位时间内限制掉请求次数过多（等级3），则封锁该账号
前端技术限制（接下来是核心技术）

该方案也可以覆盖 OCR 爬取场景。OCR 的前提是页面渲染完毕，页面所需业务数据需要通过接口获取。所以基于用户行为采集分析，基于日志分析用户在时间范围内的请求频次、用户行为是否正常，如果不正常，说明可能是爬虫程序，依据用户单位时间内情况恶略程度，可以采用降频、返回错误数据、封锁账号的策略。

服务端加密

首先后端与前端约定好数据加密规则

随机映射表（比如 0 -> 3, 1 -> 7, 2 -> 4, 3 -> 5, 4 -> 1, 5 -> 0, 6 -> 6, 7 -> 9, 8 -> 2, 9 -> 8）
约定好的规则加密（根据方程 y = kx + b 其中，k 为当前的月份，b 为当月的号数，线性方程的系数和常数项是根据当前的日期计算得到的。比如当前的日期为“2023-11-22”，那么线性变换的 k 为 11，b 为 22。）
将数字转换为字符串，使用3.1415926拼接（比如数字123 变为1 + '3.1415926' + 2 + '3.1415926' + 3，最终结果为'13.141592623.141592623.1415926'）

客户端解密

将后端返回的数据以3.1415926为分隔符转换成数组
将数据解密 x = (y - b) / k
将数组转换成字符串
给数据添加对应的字体文件（根据服务端的映射制作的）

实现效果

接口定义

接口返回的数据

dom结构中的数据

页面中显示的数据

实现过程

服务端

以node.js为例

const encodeNumberRule1 = (number) => {
  const numMap = {
    0: 3,
    1: 7,
    2: 4,
    3: 5,
    4: 1,
    5: 0,
    6: 6,
    7: 9,
    8: 2,
    9: 8,
  };
  const date = dayjs().format('YYYY-MM-DD');
  const k = Number(date.split('-')[1]);
  const b = Number(date.split('-')[2]);
  const result = String(number).split('').map((item) => {
    if (isNaN(item)) {
      return item;
    }
    return numMap[item] * k + b;
  }).join('3.1415926');
  return result;
};

function encodeNumberRule2(number) {
  // numMap 为随机16进制映射表
  const numMap = {
    0: 0xe6a7,
    1: 0xf257,
    2: 0xa87e,
    3: 0xb2c1,
    4: 0xc7b2,
    5: 0xa9f2,
    6: 0xe2c7,
    7: 0xf82b,
    8: 0xc1b2,
    9: 0xc8f6,
  };

  const date = dayjs().format('YYYY-MM-DD');
  const k = Number(date.split('-')[1]);
  const b = Number(date.split('-')[2]);
  const result = String(number).split('').map((item) => {
    if (item === '.' || item === '-') {
      return item;
    }
    return (numMap[item] * k + b).toString(16);
  }).join('3.1415926');
  console.log('result', result);
  return result.toString();
}

app.get('/api/test', (req, res) => {
  res.send({
    code: 200,
    msg: 'test',
    data: [
      {
        x: encodeNumberRule1(123),
        y: encodeNumberRule1(-123.2),
        rule: 1,
      },
      {
        x: encodeNumberRule2(123),
        y: encodeNumberRule2(-123.2),
        rule: 2,
      }
    ],
    success: true,
  });
});

客户端

制作字体文件

将字体文件转换成svg格式（ttf转svg）
选取对应的字符，根据与后端约定的映射表修改unicode编码

下载改完unicode后的字体并转为woff与woff2，在css中设置对应字体（ttf转woff）

@font-face {
  font-family: 'icomoon-num-1';
  src: url('./assets/font/icomoon-num-1/icomoon.woff2') format('woff2'),
    url('./assets/font/icomoon-num-1/icomoon.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'icomoon-num-2';
  src: url('./assets/font/icomoon-num-2/icomoon-num-2.woff2') format('woff2'),
    url('./assets/font/icomoon-num-2/icomoon-num-2.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

.num-font-rule-1 {
  font-family: 'icomoon-num-1', sans-serif;
}
.num-font-rule-2 {
  font-family: 'icomoon-num-2', sans-serif;
}

编写解密函数

const decryptNumRule1 = (num) => {
  if (!num) {
    return '';
  }
  // 1. 将字符串转换成数组以3.1415926为分隔符
  const arr = num.split('3.1415926');
  const date = dayjs().format('YYYY-MM-DD');
  const k = Number(date.split('-')[1]);
  const b = Number(date.split('-')[2]);
  // 2. 将数组中的每一项转换成数字 x = (y - b) / k
  const result = arr.map(item => {
    if (isNaN(Number(item))) {
      return item;
    }
    const y = Number(item);
    return (y - b) / k;
  });
  // 3. 将数组转换成字符串
  return result.join('');
};

const decryptNumRule2 = (num) => {
  if (!num) {
    return '';
  }
  // 1. 将字符串转换成数组以3.1415926为分隔符
  const arr = num.split('3.1415926');
  const date = dayjs().format('YYYY-MM-DD');
  const k = Number(date.split('-')[1]);
  const b = Number(date.split('-')[2]);
  // 2. 将数组中的每一项转换成数字 x = (y - b) / k
  const result = arr.map(item => {
    if (isNaN(parseInt(item, 16))) {
      console.log(item);
      return item;
    }
    const y = parseInt(item, 16);
    return `&#x${((y - b) / k).toString(16)};`;
  });
  // 3. 将数组转换成字符串
  return result.join('');
};

开发中使用

注意：在使用四位数16进制的unicode编码时需要使用dangerouslySetInnerHTML渲染，否则将会在页面中直接显示对应的字符串，对应Vue中需要使用v-html指令

export default function Test() {
  return <>
    {
      testData.map((item, index) => {
        return <div key={index}>
          {
            item.rule === 1 && <>
              <p className='num-font-rule-1'>{utils.decryptNumRule1(item.x)}</p>
              <p className='num-font-rule-1'>{utils.decryptNumRule1(item.y)}</p>
            </>
          }
          {
            item.rule === 2 && <>
              <p className='num-font-rule-2' dangerouslySetInnerHTML={{
                __html: utils.decryptNumRule2(item.x),
              }} />
              <p className='num-font-rule-2' dangerouslySetInnerHTML={{
                __html: utils.decryptNumRule2(item.y),
              }} />
            </>
          }
          <br />
        </div>;
      })
    }
  </>
}

随心而记

使用乾坤微前端嵌入早期不同技术栈的项目

最终效果

一期需求

二期需求

主应用

可拖拽大屏平台子应用

业务代码子应用

应用间通信

OpenCode 入门指南

OpenCode 入门指南

1. 前言

2. 配置网络代理

3. 安装

3.1 macOS

3.2 Windows

3.3 验证安装

4. 配置

5. 使用

5.1 终端模式（TUI）

5.2 Web 模式

6. 常用命令

6.1 CLI 命令（终端直接输入）

6.2 TUI 内置命令（进入界面后输入 /）

7. 进阶配置

7.1 oh-my-openagent 插件

7.1.1 简介

7.1.2 核心功能

执行模式

质量保障机制

工具链集成

7.1.3 安装

7.1.4 配置模型

7.1.5 Agents 与 Categories 参考

Agents（专业代理角色）

Categories（任务分类路由）

7.2 MCP

推荐 MCP 服务

组合配置示例

常用管理命令

7.3 推荐技能（Skill）

ui-ux-pro-max — AI 驱动的 UI/UX 设计智能

从 Warp 迁移到 Ghostty

为什么离开 Warp

为什么选择 Ghostty

安装

配置

主题

迁移调整

命令行增强

提示符主题 - Spaceship

1. 安装 Oh My Zsh（前置条件）

2. 安装 Spaceship 主题

3. 启用主题

历史命令搜索 - Atuin

对比

快捷键

总结

让等待可见：起名场景的流式输出优化实践

功能背景

原方案的问题

用户的真实感受

问题本质

优化目标

方案设计

整体思路：分段输出 + 渐进渲染

阶段 1：先输出八字分析

阶段 2：名字逐条追加

阶段 3：加载中提示卡片

技术实现要点

通信协议：SSE（Server-Sent Events）

前端状态管理

渲染优化

边界情况处理

网络中断

生成失败

用户中途离开

优化效果

适用场景延伸

小结

6.2 TUI 内置命令（进入界面后输入 `/`）