隶笔难书

Hello—Agent-1

waite@waite.wang (Waite) — Tue, 02 Jun 2026 07:30:38 +0000

Agent 基础

Agent 的本质

Agent 就是一个能自己干活的 AI。

更工程一点：你给它一个目标、一个工具箱和一套边界（预算 / 权限 / 审批 / 沙箱），它在循环里推进任务，直到完成或停下。

Sentry 的安装部署以及邮件无法发送问题解决

waite@waite.wang (Waite) — Wed, 17 Dec 2025 10:05:54 +0800

安装

注意这里安装的是 Sentry 9.1.2 版本，该版本是 Docker 仓库支持的最后一个版本，对服务器要求较低。如果服务器支持，可以安装最新版本，安装方法会有所不同，具体可以参考官方文档 https://develop.sentry.dev/self-hosted/

K8S 学习笔记（一）—— 集群的启动以及部署

waite@waite.wang (Waite) — Mon, 01 Dec 2025 09:05:54 +0800

集群的启动以及部署

kubectl

https://kubernetes.io/docs/tasks/tools/#kubectl

Kubernetes 命令行工具 kubectl允许您对 Kubernetes 集群运行命令。您可以使用 kubectl 部署应用程序、检查和管理集群资源以及查看日志。有关更多信息（包括 kubectl 操作的完整列表），请参阅 kubectl参考文档。

Vue PDF 预览与标注实现解析

waite@waite.wang (Waite) — Tue, 11 Nov 2025 12:04:23 +0800

最近在做一个文件预览功能，需要在浏览器里展示 PDF 并支持位置标记和缩放。折腾了一段时间，把实现思路整理一下。

PDF 渲染

PDF 在浏览器里渲染，直接用 @tato30/vue-pdf 这个库。它基于 pdf.js，用起来还算顺手。

WebSocket连接管理与Redis集成实现

waite@waite.wang (Waite) — Thu, 21 Aug 2025 16:04:23 +0800

在构建分布式聊天系统时，我们面临着一个核心挑战：如何在多个服务器实例之间有效管理WebSocket连接，并确保消息能够准确传递到正确的机器人客户端。本文详细介绍了解决方案，包括Redis集成、跨实例消息转发、心跳机制等关键技术实现。

Python 实践网页报告生成与邮件分发

waite@waite.wang (Waite) — Wed, 07 May 2025 16:04:23 +0800

项目背景

在现代化应用中，自动化报告生成和邮件分发是常见的需求。本文将介绍两个 Python 工具模块：long_screenshot.py 和 send_email.py，它们分别负责网页长截图和邮件发送功能，可以协同工作，实现从网页截图到邮件分发的完整流程。

Vue+Flask实现一个最基础的LLM请求响应以及渲染

waite@waite.wang (Waite) — Fri, 28 Mar 2025 07:30:38 +0000

后端请求

后端封装

from abc import ABC, abstractmethod
from openai import OpenAI
import config


class BaseAIService(ABC):
 """AI服务的抽象基类"""

 @abstractmethod
 def get_stream_completion(self, messages):
 """获取流式响应"""
 pass

 @abstractmethod
 async def process_stream_response(self, response):
 """处理流式响应"""
 pass


 class HuoShanAIService(BaseAIService):
 """火山引擎 AI 服务实现"""

 def __init__(self):
 self.config = config.HUO_SHAN_COMPLETION_CONFIG
 self.client = OpenAI(
 api_key=self.config["api_key"],
 base_url=self.config["base_url"]
 )

 def get_stream_completion(self, messages):
 """获取流式响应"""
 return self.client.chat.completions.create(
 model=self.config["fast_llm"],
 messages=messages,
 temperature=0.3,
 top_p=1,
 max_tokens=8192,
 stream=True
 )

 async def process_stream_response(self, response):
 """处理流式响应"""
 reasoning_content = ""
 answer_content = ""
 is_answering = False

 try:
 for chunk in response:
 try:
 if not chunk.choices or not chunk.choices[0].delta:
 continue

 delta = chunk.choices[0].delta

 # 处理思考过程
 if hasattr(delta, 'reasoning_content') and delta.reasoning_content:
 reasoning_text = delta.reasoning_content
 print(reasoning_text, end='', flush=True)
 reasoning_content += reasoning_text
 yield f"__r__{reasoning_text}".encode('utf-8', errors='ignore')

 # 处理回复内容
 elif hasattr(delta, 'content') and delta.content:
 if not is_answering:
 print("\n" + "=" * 20 + "完整回复" + "=" * 20 + "\n")
 is_answering = True

 content_text = delta.content
 print(content_text, end='', flush=True)
 answer_content += content_text
 yield f"__a__{content_text}".encode('utf-8', errors='ignore')

 except UnicodeEncodeError as e:
 print(f"Encoding error: {e}")
 continue
 except Exception as e:
 print(f"Error processing chunk: {e}")
 yield f"__a__处理响应时发生错误: {str(e)}".encode('utf-8', errors='ignore')

 except Exception as e:
 print(f"Stream processing error: {e}")
 yield f"__a__处理流式响应时发生错误: {str(e)}".encode('utf-8', errors='ignore')


 def get_ai_service(provider="huoshan"):
 """工厂函数，根据提供商返回对应的 AI 服务实例"""
 providers = {
 "huoshan": HuoShanAIService,
 # 未来可以添加其他提供商
 # "openai": OpenAIService,
 # "azure": AzureAIService,
 }

 service_class = providers.get(provider)
 if not service_class:
 raise ValueError(f"不支持的 AI 提供商: {provider}")

 return service_class()

调用并且返回值

Vue 实现公历,农历日期选择效果

waite@waite.wang (Waite) — Sat, 22 Mar 2025 21:05:54 +0800

Vue 学习笔记-系统学习 Pinia

单例模式以及事件管理器在 Cocos 中的应用

waite@waite.wang (Waite) — Thu, 13 Mar 2025 07:30:38 +0000

单例模式

单例模式是设计模式中最常用的模式之一，它确保一个类只有一个实例，并提供一个全局访问点。在游戏开发中，单例模式尤其有用，因为它能够有效地管理全局资源和状态。

Cursor 无限续杯方案

waite@waite.wang (Waite) — Sun, 12 Jan 2025 20:55:23 +0800

Cursor 无限续杯.

博客迁移小记

waite@waite.wang (Waite) — Sat, 28 Dec 2024 11:30:03 +0000

这里是副标题.

使用Cursor+DevBox 从零创建一个 TodeList 网页应用

waite@waite.wang (Waite) — Fri, 27 Dec 2024 22:02:05 +0800

使用Cursor+DevBox 从零创建一个 TodeList 网页应用

Http 基础

waite@waite.wang (Waite) — Wed, 23 Oct 2024 16:04:23 +0800

HTTP

[HTTP
](#http)
- 一、基础概念
  - 请求和响应报文
  - URL
- 二、HTTP 方法
  - GET
  - HEAD
  - POST
  - PUT
  - PATCH
  - DELETE
  - OPTIONS
  - CONNECT
  - TRACE
- 三、HTTP 状态码
- 四、HTTP 首部

静态文档 Github 自动同步服务器

waite@waite.wang (Waite) — Fri, 28 Jun 2024 22:05:32 +0800

Vuepress 或部分静态文档自动同步服务器

使用 Github action 加服务器 git commit hash 匹配

本文以 Vuepress 为例子, 其他同理

请确保服务器安装 git 环境, 本文不再赘述

Github Action

原理: 通过 Github Action 工作流把代码编译并且部署到 gh_pages 分支

Django自带 Auth 数据库扩展字段

waite@waite.wang (Waite) — Sat, 22 Jun 2024 16:04:23 +0800

auth模块的介绍

1、导包
```
from django.contrib import auth
```

2、默认使用auth_user表来存储用户数据

# 默认用户表是位置
from django.contrib.auth.models import User

mysql> show tables;
+----------------------------+
| Tables_in_django_rest01 |
+----------------------------+
| auth_group |
| auth_group_permissions |
| auth_permission |
| auth_user |
| auth_user_groups |
| auth_user_user_permissions |
| django_admin_log |
| django_content_type |
| django_migrations |
| django_session |
+----------------------------+
10 rows in set (0.00 sec)

auth_group: 存储用户组信息。每个用户组可以有多个权限。
auth_group_permissions: 存储用户组和权限的关联关系。一个用户组可以有多个权限。
auth_permission: 存储系统中定义的所有权限。权限通常与特定的模型和操作相关联。
auth_user: 存储用户账户信息，如用户名、密码、电子邮件等。
auth_user_groups: 存储用户和用户组的关联关系。一个用户可以属于多个用户组。
auth_user_user_permissions: 存储用户特定的权限，这些权限不会通过用户组继承。
django_admin_log: 存储管理站点的操作日志，如添加、更改或删除记录。
django_content_type: 存储Django中所有模型的元数据，包括app_label和model字段，用于确定对象类型。
django_migrations: 存储关于应用的迁移历史信息，包括迁移的名称和应用时间。
django_session: 存储会话数据，用于支持Django的会话框架。

mysql> desc auth_user;
+--------------+--------------+------+-----+---------+----------------+
| Field | Type | Null | Key | Default | Extra |
+--------------+--------------+------+-----+---------+----------------+
| id | int(11) | NO | PRI | NULL | auto_increment |
| password | varchar(128) | NO | | NULL | |
| last_login | datetime(6) | YES | | NULL | |
| is_superuser | tinyint(1) | NO | | NULL | |
| username | varchar(150) | NO | UNI | NULL | |
| first_name | varchar(30) | NO | | NULL | |
| last_name | varchar(150) | NO | | NULL | |
| email | varchar(254) | NO | | NULL | |
| is_staff | tinyint(1) | NO | | NULL | |
| is_active | tinyint(1) | NO | | NULL | |
| date_joined | datetime(6) | NO | | NULL | |
+--------------+--------------+------+-----+---------+----------------+
11 rows in set (0.01 sec)

mysql>

常用方法

1、authenticate()用来校验用户名及密码

uniapp+vite+vue3+ts配置eslint代码检查及prettier规范检查

waite@waite.wang (Waite) — Thu, 02 May 2024 20:49:12 +0800

这里是副标题.

鸿蒙学习笔记3

waite@waite.wang (Waite) — Sat, 06 Apr 2024 16:04:23 +0800

Stage 模型

https://developer.huawei.com/consumer/cn/doc/harmonyos-guides-V2/start-with-ets-stage-0000001477980905-V2

一个应用只能有一个 @EntryAbility，但可以有多个 @PageAbility。

（Stage模型）目录结构

AppScope > app.json5：应用的全局配置信息。
entry：HarmonyOS工程模块，编译构建生成一个HAP包。
- src > main > ets：用于存放ArkTS源码。 src > main > ets > entryability：应用/服务的入口。
- src > main > ets > pages：应用/服务包含的页面
- src > main > resources：用于存放应用/服务所用到的资源文件，如图形、多媒体、字符串、布局文件等。关于资源文件，详见资源分类与访问。
- src > main > module.json5：Stage模型模块配置文件。主要包含HAP包的配置信息、应用/服务在具体设备上的配置信息以及应用/服务的全局配置信息。具体的配置文件说明，详见 module.json5配置文件。
- build-profile.json5：当前的模块信息、编译信息配置项，包括buildOption、targets配置等。其中targets中可配置当前运行环境，默认为HarmonyOS。
- hvigorfile.ts：模块级编译构建任务脚本，开发者可以自定义相关任务和代码实现。
oh_modules：用于存放三方库依赖信息。关于原npm工程适配ohpm操作，请参考历史工程迁移。
build-profile.json5：应用级配置信息，包括签名、产品配置等。
hvigorfile.ts：应用级编译构建任务脚本。

应用配置文件

https://developer.huawei.com/consumer/cn/doc/harmonyos-guides-V2/14d_u7f6e_u6587_u4ef6_uff08stage_u6a21_u578b_uff09-0000001427902192-V2

鸿蒙学习笔记2

waite@waite.wang (Waite) — Fri, 29 Mar 2024 16:04:23 +0800

页面路由

页面路由指在应用程序中实现不同页面之间的跳转和数据传递。HarmonyOS提供了Router模块，通过不同的url地址，可以方便地进行页面路由，轻松地访问不同的页面。

鸿蒙学习笔记1

waite@waite.wang (Waite) — Sat, 23 Mar 2024 16:04:23 +0800

编辑器安装

安装

下载安装包
正常安装包, 下一步安装

配置开发环境

选择 Agree, 进入配置选择页面, 选择不导入配置

选择要安装的Node.is和hpm位置，其中ohpm是Open Harmony Package Management的缩写，也就是类似npm的包管理工具。这里有几点注意事项:

UniApp 入门

waite@waite.wang (Waite) — Sat, 02 Mar 2024 20:46:38 +0800

UniApp 学习笔记

vue 项目规范设置

waite@waite.wang (Waite) — Mon, 22 Jan 2024 16:04:23 +0800

集成editorconfig配置

EditorConfig 有助于为不同 IDE 编辑器上处理同一项目的多个开发人员维护一致的编码风格。

# http://editorconfig.org

root = true

[*] # 表示所有文件适用
charset = utf-8 # 设置文件字符集为 utf-8
indent_style = space # 缩进风格（tab | space）
indent_size = 2 # 缩进大小
end_of_line = lf # 控制换行类型(lf | cr | crlf)
trim_trailing_whitespace = true # 去除行首的任意空白字符
insert_final_newline = true # 始终在文件末尾插入一个新行

[*.md] # 表示仅 md 文件适用以下规则
max_line_length = off
trim_trailing_whitespace = false

VSCode需要安装一个插件：EditorConfig for VS Code

Vue3 CompositionAPI

waite@waite.wang (Waite) — Fri, 29 Dec 2023 16:04:23 +0800

Options API的弊端

在Vue2中，我们编写组件的方式是Options API：
- Options API的一大特点就是在对应的属性中编写对应的功能模块；
- 比如data定义数据、methods中定义方法、computed中定义计算属性、watch中监听属性改变，也包括生命周期钩子；
但是这种代码有一个很大的弊端：

七牛云 + Typora + PicGo

waite@waite.wang (Waite) — Thu, 28 Dec 2023 22:05:32 +0800

Typora 免费版本: https://github.com/L1ne-cd/Typora_Unlocker

七牛云

七牛云: https://www.qiniu.com/

注册实名 2. 对象存储, 新建空间

选择离你最近的存储区域(建议服务器哪的就选哪个区) 访问控制选择公有

个人中心 > 密钥管理 > 复制待用

Pinia 数据持久化储存（pinia-plugin-persistedstate）

waite@waite.wang (Waite) — Wed, 22 Nov 2023 16:04:23 +0800

pinia需要使用pinia-plugin-persistedstate插件来进行数据的存储插件官网地址： https://prazdevs.github.io/pinia-plugin-persistedstate/guide/config.html

安装以及使用

pnpm i pinia-plugin-persistedstate

npm i pinia-plugin-persistedstate

yarn add pinia-plugin-persistedstate

import { createPinia } from 'pinia'
import piniaPluginPersistedstate from 'pinia-plugin-persistedstate'

const pinia = createPinia()
pinia.use(piniaPluginPersistedstate)

关于全部缓存及部分缓存的说明

（1）将store的state中的全部数据进行缓存，直接在state同级下面添加persist对象

系统学习 Pinia

waite@waite.wang (Waite) — Sat, 11 Nov 2023 21:05:54 +0800

Vue 学习笔记-系统学习 Pinia

系统学习 VueX 1

waite@waite.wang (Waite) — Sat, 11 Nov 2023 21:05:54 +0800

Vue 学习笔记-VueX

Vue3 基本指令(二)

waite@waite.wang (Waite) — Sun, 22 Oct 2023 16:04:23 +0800

本文章来源于王红元老师（coderwhy）的 Vue3 + Ts 课程第二章节 - Vue3 基本指令附上链接：https//ke.qq.com/course/3453141 permalink: /archives/vue3-ji-ben-zhi-ling-er

邂逅 Vue3 开发(一)

waite@waite.wang (Waite) — Sat, 30 Sep 2023 16:04:23 +0800

本文章来源于王红元老师（coderwhy）的 Vue3 + Ts 课程第二章节 - Vue3 基本指令附上链接：https//ke.qq.com/course/3453141 permalink: /archives/vue3-ji-ben-zhi-ling-er

Windows11家庭中文版系统安装Docker

waite@waite.wang (Waite) — Sun, 24 Sep 2023 16:04:23 +0800

title: Windows11家庭中文版系统安装Docker id: a293d46a-9b4e-4e42-8bbc-0bcec5c21662 date: 2023-09-24 22:29:15 auther: admin cover:

安装到 D 盘(软链接)

docker 默认安装路劲为 C:\Program Files\Docker
docker 虚拟磁盘默认安装路劲为 C:\Users\<YourName>\AppData\Local\Docker

用 管理员身份打开cmd窗口
执行如下命令

mklink /j "C:\Program Files\Docker" "D:\Program Files\Docker"

已经安装Docker，需要重新再安装一次。
安装后C盘下的Docker文件就只是一个软链接了，映射的真实路径在D盘Docker文件夹下(注意: 软链接后需要在相应目录创建文件夹, 不然后续安装会报错)

Hyper-Vr

查看自己的系统, 如果你的系统跟我一样是window11家庭中文版，则会找不到Hyper-Vr，这时则需要自己创建，讲下述代码复制在txt文本里，并重命名为Hyper.cmd，右键以管理员方式运行，最后输入“Y”重启电脑后即可。

cookie、session和localStorage的区别

waite@waite.wang (Waite) — Fri, 22 Sep 2023 16:04:23 +0800

概念的理解

webstorage本地存储

webstorage是本地存储，存储在客户端，包括localStorage和sessionStorage
localStorage生命周期是永久，这意味着除非用户显示在浏览器提供的UI上清除localStorage信息，否则这些信息将永远存在。存放数据大小为一般为5MB,而且它仅在客户端（即浏览器）中保存，不参与和服务器的通信
sessionStorage仅在当前会话下有效，关闭页面或浏览器后被清除。存放数据大小为一般为5MB,而且它仅在客户端（即浏览器）中保存，不参与和服务器的通信。源生接口可以接受，亦可再次封装来对Object和Array有更好的支持
WebStorage的目标提供一种在cookie之外存储会话数据的路径提供一种存储大量可以跨会话存在的数据的机制 HTML5的WebStorage提供了两种API：localStorage（本地存储）和sessionStorage（会话存储）
作用域的不同：不同浏览器无法共享localStorage或sessionStorage中的信息。相同浏览器的不同页面间可以共享相同的 localStorage（页面属于相同域名和端口），但是不同页面或标签页间无法共享sessionStorage的信息。这里需要注意的是，页面及标签页仅指顶级窗口，如果一个标签页包含多个iframe标签且他们属于同源页面，那么他们之间是可以共享sessionStorage的
存储大小： localStorage和sessionStorage的存储数据大小一般都是：5MB
存储位置： localStorage和sessionStorage都保存在客户端，不与服务器进行交互通信
存储内容类型： localStorage和sessionStorage只能存储字符串类型，对于复杂的对象可以使用ECMAScript提供的JSON对象的stringify和parse来处理
获取方式： localStorage：window.localStorage;；sessionStorage：window.sessionStorage;
应用场景： localStoragese：常用于长期登录（+判断用户是否已登录），适合长期保存在本地的数据，而sessionStorage：敏感账号一次性登录
WebStorage的优点：存储空间更大：cookie为4KB，而WebStorage是5MB 节省网络流量：WebStorage不会传送到服务器，存储在本地的数据可以直接获取，也不会像cookie一样美词请求都会传送到服务器，所以减少了客户端和服务器端的交互，节省了网络流量对于那种只需要在用户浏览一组页面期间保存而关闭浏览器后就可以丢弃的数据，sessionStorage会非常方便快速显示：有的数据存储在WebStorage上，再加上浏览器本身的缓存。获取数据时可以从本地获取会比从服务器端获取快得多，所以速度更快安全性：WebStorage不会随着HTTP header发送到服务器端，所以安全性相对于cookie来说比较高一些，不会担心截获，但是仍然存在伪造问题 WebStorage提供了一些方法，数据操作比cookie方便 setItem (key, value) —— 保存数据，以键值对的方式储存信息。 getItem (key) —— 获取数据，将键值传入，即可获取到对应的value值。 removeItem (key) —— 删除单个数据，根据键值移除对应的信息。 clear () —— 删除所有的数据 key (index) —— 获取某个索引的key

HTTP Cookie简称cookie,在HTTP请求发送Set-Cookie HTTP头作为响应的一部分。通过name=value的形式存储
cookie的构成：名称：name(不区分大小写,但最好认为它是区分的) 值:value(通过URL编码:encodeURIComponent) 域路径失效时间:一般默认是浏览器关闭失效,可以自己设置失效时间安全标志:设置安全标志后只有SSL连接的时候才发送到服务器
cookie的作用:主要用于保存登录信息
生命期为只在设置的cookie过期时间之前一直有效，即使窗口或浏览器关闭。存放数据大小为4K左右。有个数限制（各浏览器不同），一般不能超过20个。与服务器端通信：每次都会携带在HTTP头中，如果使用cookie保存过多数据会带来性能问题
cookie的优点：具有极高的扩展性和可用性通过良好的编程，控制保存在cookie中的session对象的大小通过加密和安全传输技术，减少cookie被破解的可能性只有在cookie中存放不敏感的数据，即使被盗取也不会有很大的损失控制cookie的生命期，使之不会永远有效。这样的话偷盗者很可能拿到的就是一个过期的cookie
cookie的缺点： cookie的长度和数量的限制。每个domain最多只能有20条cookie，每个cookie长度不能超过4KB，否则会被截掉安全性问题。如果cookie被人拦掉了，那个人就可以获取到所有session信息。加密的话也不起什么作用有些状态不可能保存在客户端。例如，为了防止重复提交表单，我们需要在服务端保存一个计数器。若吧计数器保存在客户端，则起不到什么作用

sessionStorage

sessionStorage是Storage类型的一个对象，拥有clear(),getItem(name),key(index),removeItem(name),setItem(name,value)方法
sessionStorage对象存储特定于某个会话的数据,也就是该数据只保持到浏览器关闭
将数据保存在session对象中。所谓session，是指用户在浏览某个网站时，从进入网站到浏览器关闭所经过的这段时间，也就是用户浏览这个网站所花费的时间。session对象可以用来保存在这段时间内所要求保存的任何数据
sessionStorage为临时保存

localStorage

localStorage也是Storage类型的一个对象
在HTML5中localStorage作为持久保存在客户端数据的方案取代了globalStorage(globalStorage必须指定域名)
localStorage会永久存储会话数据，除非removeItem,否则会话数据一直存在
将数据保存在客户端本地的硬件设备(通常指硬盘，也可以是其他硬件设备)中，即使浏览器被关闭了，该数据仍然存在，下次打开浏览器访问网站时仍然可以继续使用 5. localStorage为永久保存

区别的比较

本地储存localStorage与cookie的区别

cookie在浏览器与服务器之间来回传递 sessionStorage和localStorage不会把数据发给服务器，仅在本地保存
数据有效期不同 cookie只在设置的cookie过期时间之前一直有效，即使窗口或浏览器关闭 sessionStorage：仅在当前浏览器窗口关闭前有效 localStorage 始终有效，长期保存
cookie数据还有路径的概念，可以限制cookie只属于某个路径下存储大小也不同，cookie数据不能超过4k，sessionStorage和localStorage 虽然也有存储大小的限制，但比cookie大得多，可以达到5M或更大
作用域不用 sessionStorage不在不同的浏览器窗口中共享 localStorage在所有同源窗口中都是共享的 cookie也是在所有同源窗口中都是共享的 WebStorage 支持事件通知机制，可以将数据更新的通知发送给监听者。Web Storage 的 api 接口使用更方便

cookie、session和localStorage的区别

cookie的内容主要包括：名字、值、过期时间、路径和域，路径与域一起构成cookie的作用范围。若不设置时间，则表示这个cookie的生命期为浏览器会话期间，关闭浏览器窗口，cookie就会消失，这种生命期为浏览器会话期的cookie被称为会话cookie
会话cookie一般不存储在硬盘而是保存在内存里，当然这个行为并不是规范规定的。若设置了过期时间，浏览器就会把cookie保存到硬盘上，关闭后再打开浏览器这些cookie仍然有效直到超过设定的过期时间。对于保存在内存里的cookie，不同的浏览器有不同的处理方式session机制。
当程序需要为某个客户端的请求创建一个session时，服务器首先检查这个客户端的请求里是否已包含了一个session标识（称为session id），如果已包含则说明以前已经为此客户端创建过session，服务器就按照session id把这个session检索出来使用（检索不到，会新建一个），如果客户端请求不包含session id，则为客户端创建一个session并且生成一个与此session相关联的session id，session id的值应该是一个既不会重复，又不容易被找到规律以仿造的字符串，这个session id将被在本次响应中返回给客户端保存。保存这个session id的方式可以采用cookie，这样在交互过程中浏览器可以自动的按照规则把这个标识发送给服务器。

cookie和session的区别

cookie数据存放在客户的浏览器上，session数据放在服务器上
cookie不是很安全，别人可以分析存放在本地的cookie并进行cookie欺骗，考虑到安全应当使用session
session会在一定时间内保存在服务器上，当访问增多，会比较占用你服务器的性能，考虑到减轻服务器性能方面，应当使用cookie
单个cookie保存的数*据不能超过4K，很多浏览器都限制一个站点最多保存20个cookie
建议将登录信息等重要信息存放为session，其他信息如果需要保留，可以放在cookie中
session保存在服务器，客户端不知道其中的信心；cookie保存在客户端，服务器能够知道其中的信息
session中保存的是对象，cookie中保存的是字符串 8. session不能区分路径，同一个用户在访问一个网站期间，所有的session在任何一个地方都可以访问到，而cookie中如果设置了路径参数，那么同一个网站中不同路径下的cookie互相是访问不到的

web Storage和cookie的区别

Web Storage的概念和cookie相似，区别是它是为了更大容量存储设计的，cookie的大小是受限的，并且每次请求一个新的页面的时候cookie都会被发送过去，这样无形中浪费了带宽，另外cookie还需要指定作用域，不可跨域调用
web storage拥有setItem,getItem,removeItem,clear等方法，不像cookie需要前端开发者自己封装setCookie，getCookie
但是cookie也是不可或缺的，cookie的作用是与服务器进行交互，作为http规范的一部分而存在的，而web Storage仅仅是为了在本地“存储”数据而生 sessionStorage、localStorage、cookie都是在浏览器端存储的数据，其中sessionStorage的概念很特别，引入了一个“浏览器窗口”的概念，sessionStorage是在同源的同窗口中，始终存在的数据，也就是说只要这个浏览器窗口没有关闭，即使刷新页面或进入同源另一个页面，数据仍然存在，关闭窗口后，sessionStorage就会被销毁，同时“独立”打开的不同窗口，即使是同一页面，sessionStorage对象也是不同的
Web Storage的好处减少网络流量：一旦数据保存在本地之后，就可以避免再向服务器请求数据，因此减少不必要的数据请求，减少数据在浏览器和服务器间不必要的来回传递快速显示数据：性能好，从本地读数据比通过网络从服务器上获得数据快得多，本地数据可以及时获得，再加上网页本身也可以有缓存，因此整个页面和数据都在本地的话，可以立即显示临时存储：很多时候数据只需要在用户浏览一组页面期间使用，关闭窗口后数据就可以丢弃了，这种情况使用sessionStorage非常方便

浏览器本地存储与服务器端存储的区别

数据既可以在浏览器本地存储，也可以在服务器端存储
浏览器可以保存一些数据，需要的时候直接从本地存取，sessionStorage、localStorage和cookie都是由浏览器存储在本地的数据
服务器端也可以保存所有用户的所有数据，但需要的时候浏览器要向服务器请求数据
服务器端可以保存用户的持久数据，如数据库和云存储将用户的大量数据保存在服务器端，服务器端也可以保存用户的临时会话数据，服务器端的session机制，如jsp的session对象，数据保存在服务器上
服务器和浏览器之间仅需传递session id即可，服务器根据session id找到对应用户的session对象，会话数据仅在一段时间内有效，这个时间就是server端设置的session有效期
服务器端保存所有的用户的数据，所以服务器端的开销较大，而浏览器端保存则把不同用户需要的数据分别保存在用户各自的浏览器中，浏览器端一般只用来存储小数据，而非服务可以存储大数据或小数据服务器存储数据安全一些，浏览器只适合存储一般数据

sessionStorage、localStorage和cookie的区别

相同点是都是保存在浏览器端、且同源的
cookie数据始终在同源的http请求中携带（即使不需要），即cookie在浏览器和服务器间来回传递，而sessionStorage和localStorage不会自动把数据发送给服务器，仅在本地保存。cookie数据还有路径（path）的概念，可以限制cookie只属于某个路径下
存储大小限制也不同，cookie数据不能超过4K，同时因为每次http请求都会携带cookie、所以cookie只适合保存很小的数据，如会话标识。sessionStorage和localStorage虽然也有存储大小的限制，但比cookie大得多，可以达到5M或更大
数据有效期不同，sessionStorage：仅在当前浏览器窗口关闭之前有效；localStorage：始终有效，窗口或浏览器关闭也一直保存，因此用作持久数据；cookie：只在设置的cookie过期时间之前有效，即使窗口关闭或浏览器关闭
作用域不同，sessionStorage不在不同的浏览器窗口中共享，即使是同一个页面；localstorage在所有同源窗口中都是共享的；cookie也是在所有同源窗口中都是共享的
web Storage支持事件通知机制，可以将数据更新的通知发送给监听者
web Storage的api接口使用更方便

sessionStorage与页面js数据对象的区别

页面中一般的js对象的生存期仅在当前页面有效，因此刷新页面或转到另一页面这样的重新加载页面的情况，数据就不存在了
sessionStorage只要同源的同窗口中，刷新页面或进入同源的不同页面，数据始终存在，也就是说只要浏览器不关闭，数据仍然存在

某高考平台逆向

waite@waite.wang (Waite) — Fri, 22 Sep 2023 16:04:23 +0800

以下代码取的是院校专业分数线

F12 得到接口
https://api.eol.cn/web/api/?local_batch_id=14&local_province_id=31&local_type_id=3&page=1&school_id=31&size=10&special_group=&uri=apidata/api/gk/score/special&year=2021&signsafe=6cdbc334a395abd2a99b9bd8cc29c42f

推断参数含义

signsafe 数据加密签名获取

搜索锁定 signsafe 字段以及加密

以上看到，t就是请求中的signsafe参数。而且，函数中也出现了HmacSHA1、base64等方法。由此可知，定位的加密位置是正确的。接下来需要将加密函数抠下来改写，方便调用。下断点继续跟踪方法调用。跟踪v.a.enc.Utf8.parse方法，如下多次尝试, 最终试出

Win11 改虚拟内存到C盘之外的盘

waite@waite.wang (Waite) — Sun, 03 Sep 2023 16:04:23 +0800

参考 https://answers.microsoft.com/zh-hans/windows/forum/all/win11%E6%97%A0%E6%B3%95%E6%8A%8A%E8%99%9A%E6%8B%9F/50381a46-ce77-40f5-8bde-a9d01b361e6c

解决: WIN11无法把虚拟内存更改到其他盘，改完后重启显示由于启动页面文件配置的问题,然后虚拟内存又回c盘了

分页文件更改

此电脑 -> 右键属性 -> 高级系统设置
选择高级 -> 性能(设置) -> 高级 -> 虚拟内存 -> 更改

初识 Django

waite@waite.wang (Waite) — Sat, 02 Sep 2023 20:40:50 +0800

Django 是一个高级的 Python Web 框架，它鼓励快速开发和干净、实用的设计。

gcc 安装 + vscode 搭建

waite@waite.wang (Waite) — Tue, 22 Aug 2023 16:04:23 +0800

安装 MinGW

MinGW（Minimalist GNU for Windows）, 是一个适用于微软windows应用程序的极简洁的开发环境。MinGW提供了一个完整的开源编程工具集，适用于原生MS-Windows应用程序的开发，并且不依赖于任何第三方C运行时DLL。MinGW主要供在MS-Windows平台上工作的开发人员使用，但也可跨平台使用。

TypeScript 入门

waite@waite.wang (Waite) — Tue, 22 Aug 2023 16:04:23 +0800

什么是 TypeScript

TypeScript既是一种语言又是一组工具。TypeScript是JavaScript的一个超集。换句话说，TypeScript是JavaScript加上一些额外的功能。

基于 Win10 管理员权限不足的升权操作

waite@waite.wang (Waite) — Tue, 22 Aug 2023 16:04:23 +0800

首先由于 Win10 家庭版没有 gpedit.msc (本地策略组编辑器), cmd 以下代码将电脑模拟为专业版

@echo off

pushd "%~dp0"

dir /b C:\Windows\servicing\Packages\Microsoft-Windows-GroupPolicy-ClientExtensions-Package~3*.mum >List.txt

dir /b C:\Windows\servicing\Packages\Microsoft-Windows-GroupPolicy-ClientTools-Package~3*.mum >>List.txt

for /f %%i in ('findstr /i . List.txt 2^>nul') do dism /online /norestart /add-package:"C:\Windows\servicing\Packages\%%i"

pause

Win + R 打开 gpedit.msc, 将 “以管理员批准模式运行所有管理员

Alist 美化指南

waite@waite.wang (Waite) — Thu, 22 Jun 2023 16:04:23 +0800

窗口透明

<style>
 .hope-ui-light{
 background-image: url("https://www.dmoe.cc/random.php") !important;
 background-repeat:no-repeat;background-size:cover;background-attachment:fixed;background-position-x:center;
 }
 .obj-box {
 border-radius: 15px !important;
 }
 .hope-ui-light .obj-box {
 background-color: #ffffff70 !important;
 }
 .hope-c-PJLV .hope-c-PJLV-ikSuVsl-css {
 border-radius: 15px !important;
 background-color: #ffffff70 !important;
 }
 .hope-c-PJLV .hope-c-PJLV-ibtHApG-css {
 border-radius: 15px !important;
 background-color: #ffffff70 !important;
 }
</style>

看板娘

<script src="https://eqcn.ajz.miesnfu.com/wp-content/plugins/wp-3d-pony/live2dw/lib/L2Dwidget.min.js"></script>

<!-- 看板娘 -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/font-awesome/css/font-awesome.min.css">
<script src="https://cdn.jsdelivr.net/gh/stevenjoezhang/live2d-widget@latest/autoload.js"></script>

鼠标点击效果

<!--鼠标点击效果-->
<script src="https://cdn.jsdelivr.net/gh/TRHX/CDN-for-itrhx.com@3.0.8/js/maodian.js"></script>

Aplayer、Meting

<!-- aplayer、meting -->
<!-- require APlayer -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/aplayer/dist/APlayer.min.css">
<script src="https://cdn.jsdelivr.net/npm/aplayer/dist/APlayer.min.js"></script>
<!-- require MetingJS -->
<script src="https://cdn.jsdelivr.net/npm/meting@2/dist/Meting.min.js"></script>

<!-- 不显示歌词 -->
<script>
 function removelrc() {
 //检测是否存在歌词按钮
 if (!document.querySelector(".aplayer-icon-lrc"))
 return;
 else
 {
 //触发以后立刻移除监听
 document.removeEventListener("DOMNodeInserted",removelrc);
 //稍作延时保证触发函数时存在按钮
 setTimeout(function() {
 //以触发按钮的方式隐藏歌词，防止在点击显示歌词按钮时需要点击两次才能出现的问题
 document.querySelector(".aplayer-icon-lrc").click();
 }, 1);
 console.log("success");
 return;
 }
 }

 document.addEventListener('DOMNodeInserted', removelrc)
</script>

Meting Body部分

Vite B端后台管理起始项

waite@waite.wang (Waite) — Wed, 05 Apr 2023 16:04:23 +0800

创建vite项目并安装vscode插件

Vite

Vite 是一个 web 开发构建工具，由于其原生 ES 模块导入方式，可以实现闪电般的冷服务器启动.通过在终端中运行以下命令，可以使用 Vite 快速构建 Vue 项目

电商后台管理系统后端api接口文档

waite@waite.wang (Waite) — Wed, 05 Apr 2023 16:04:23 +0800

一、API V2 接口说明

接口基准地址：http://www.tangxiaoyang.vip:8888/api/v2/
服务端已开启 CORS 跨域支持
API V2 认证统一使用 Token 认证

系统学习 Vue -- 3-脚手架学习

waite@waite.wang (Waite) — Sat, 11 Mar 2023 21:05:54 +0800

Vue 学习笔记-Vue脚手架学习

系统学习 Vue -- 4. 动画和路由

waite@waite.wang (Waite) — Sat, 11 Mar 2023 21:05:54 +0800

Vue 学习笔记-Vue 动画和路由

微信小程序入门

waite@waite.wang (Waite) — Thu, 02 Mar 2023 20:52:46 +0800

微信小程序学习笔记

系统学习 Vue -- 2-深入组件

waite@waite.wang (Waite) — Tue, 07 Feb 2023 21:05:54 +0800

Vue 学习笔记-Vue组件化

系统学习 Vue 1

waite@waite.wang (Waite) — Mon, 02 Jan 2023 21:05:54 +0800

Vue 学习笔记-Vue基础

Idea2023.2 创建 Servlet 项目

waite@waite.wang (Waite) — Sun, 23 Oct 2022 16:04:23 +0800

Idea2023.2 创建 Servlet 项目

前期准备

正常创建 Java 项目, 添加框架支持 Web 模块
- 2023.2 之后 Idea 新 UI 把添加框架支持移到了 Ctrl + Alt + Shift + S(项目结构) -> 模块 -> +
- 如果想要之前一样右键添加框架支持, 可以设置 -> 添加按键映射 -> 添加快捷键 -> 之后用快捷键使用即可

JSP 访问数据库

waite@waite.wang (Waite) — Sun, 23 Oct 2022 16:04:23 +0800

JSP 访问数据库

mysql-connector-java的jar包下载

官方下载地址 https://dev.mysql.com/downloads/connector/j/

解压, 把JDBC驱动放在lib文件夹下（直接复制过来就可以了）

记得导入, 不然会报错

<%@ page import="java.sql.*" %>

基本用法

连接MySQL数据库

在JSP中连接MySQL数据库的步骤如下：

nvm 的使用

waite@waite.wang (Waite) — Sat, 22 Oct 2022 16:04:23 +0800

nvm 的使用

nvm 可以快速的切换 nodejs 的版本

nvm 是什么？

nvm 是一个 node 的版本管理工具，可以简单操作 node 版本的切换、安装、查看。。。等等，与 npm 不同的是，npm 是依赖包的管理工具。

Tomcat + Idea 配置及使用

waite@waite.wang (Waite) — Sat, 22 Oct 2022 16:04:23 +0800

Jdk 安装

Tomcat

注意 Tomcat 版本与 Jdk 匹配

官网地址：https://tomcat.apache.org/

我这里选择的是Tomcat9.0版本，大家可以选择自己需要的版本

hadoop的安装与配置

waite@waite.wang (Waite) — Mon, 10 Oct 2022 16:04:23 +0800

hadoop的安装与配置

hadoop集群的安装与配置

waite@waite.wang (Waite) — Mon, 10 Oct 2022 16:04:23 +0800

hadoop集群的安装与配置

Vue2 核心语法

waite@waite.wang (Waite) — Sat, 22 Jan 2022 16:04:23 +0800

https://v2.cn.vuejs.org/

简单使用

https://v2.cn.vuejs.org/v2/guide/installation.html

直接用 script 引入

直接下载并用标签引入，Vue 会被注册为一个全局变量。(在开发环境下不要使用压缩版本，不然你就失去了所有常见错误相关的警告!)

友链

waite@waite.wang (Waite) — Mon, 01 Jan 0001 00:00:00 +0000

links