本站点主要记录在日常工作开发中的问题以及功能实现
from openai import OpenAI def client_chat(): client = OpenAI(api_key=os.getenv("API_KEY"), base_url="https://xx.xx.xx") response = client.chat.completions.create( model="deepseek-chat", messages=[ {"role": "system", "content": "You are a helpful assistant"}, {"role": "user", "content": "Hello"}, ], stream=True )
textarea 在开发中常常被使用到,但默认的 textarea 效果并不能满足我们的需求,比如信息发送框,如果直接使用 input 的话,在长文本内容中会显得十分拥挤,如果直接使用 textarea 则在未填充内容时显得过于空旷,因此我们需要自定义 textarea 的样式,使其在未填充内容时也能保持一定的宽度,同时也能在长文本内容中自动换行并调整高度。效果如下:这里主要通过监听 textarea 的 input 事件,从而获取 textarea 的内容区域高度,从而调整 textarea 的高度,实现文本内容超出宽度时高度调整的效果。代码示例:<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <t
将 monaco-editor 下载到本地,地址:https://microsoft.github.io/monaco-editor/目录结构:代码示例:<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <link rel="stylesheet" href="./monaco-editor-0.50.0/package/min/vs/editor/editor.main.css"> </head> <body> <div id=&quo
"urllib3 v2.0 only supports OpenSSL 1.1.1+, currently "ImportError: urllib3 v2.0 only supports OpenSSL 1.1.1+, currently the 'ssl' module is compiled with 'OpenSSL 1.0.2k-fips 26 Jan 2017'. See: https://github.com/urllib3/urllib3/issues/2168requests 指定安装版本pip install requests==2.6
介绍Shadow DOM 是 Web 组件规范的一部分,它允许将封装的“影子” DOM 树附加到常规 DOM 树中的元素。影子 DOM 封装了 DOM 和样式,使开发人员可以控制这些元素,而不会与页面上的其他代码或样式发生冲突。术语影子宿主(Shadow host):影子 DOM 附加到的常规 DOM 节点。影子树(Shadow tree):影子 DOM 内部的 DOM 树。影子边界(Shadow boundary):影子 DOM 终止,常规 DOM 开始的地方。影子根(Shadow root):影子树的根节点。创建 Shadow DOMconst host = document.querySelector('#host') // 创建一个 Shandow DOM 元素 const shadow = host.attachShadow({mode: 'open'}) const span = document.createElement('span') span.textContent = 'Hello World' // 向 Shadow DOM 元素内填充内容 shadow.a
在做JS逆向时常常会遇到需要模拟浏览器环境的情况,比如需要获取浏览器的location、document对象等。当然,如果只是类似获取 location 对象中的某个值的话,我们可以直接在浏览器端将参数值都复制过来。但是,如果需要对 document 进行操作那么就无能为力了,此时就需要使用到一个 NodeJS 包:jsdom。jsdom 是一个 NodeJS 包,它可以在 NodeJS 环境中模拟浏览器环境,包括创建一个 window 对象、document 对象等。使用 jsdom 包,我们可以创建一个虚拟的浏览器环境,然后在该环境中执行 JS 代码,从而实现对 document 对象的操作。安装npm install jsdom使用 const { JSDOM } = require('jsdom'); const dom = new JSDOM('<!DOCTYPE html><html><body></body></html>'); const window = dom.window;
execjs 能够让你在 Python 环境中运行 JavaScript 代码。它提供了一个接口,可以使用各种 JavaScript 运行时引擎来执行 JavaScript 代码,包括 NodeJS、PhantomJS、PyV8等。安装pip install PyExecJS运行 js 代码import execjs # js 代码 js_code = """ function add(x, y) { return x + y; } """ # 创建一个 JavaScript 运行环境 ctx = execjs.compile(js_code) # 在 JavaScript 运行环境中调用 JavaScript 函数 result = ctx.call("add", 3, 5) # JavaScript 代码返回参数 print(result) # 输出:8call 方法:第一个参数为需要调用的 JavaScript 函数名后续参数为函数的传参切换运行环境import execjs #
@echo off REM 指定要使用的 Python 解释器路径 set "PYTHON_EXE=.\venv\Scripts\python.exe" REM 使用指定路径的 Python 解释器执行脚本 "%PYTHON_EXE%" main.py pause
import random user_agent = [ "Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/39.0.2171.95 Safari/537.36 OPR/26.0.1656.60", "Opera/8.0 (Windows NT 5.1; U; en)", "Mozilla/5.0 (Windows NT 5.1; U; en; rv:1.8.1) Gecko/20061208 Firefox/2.0.0 Opera 9.50", "Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.1; en) Opera 9.50", "Opera/9.80 (Macintosh; Intel Mac OS X 10.6.8; U; en) Presto/2.8.131 Version/11.1
有时在 .ts 文件中需要通过 import config from 'config.json' 方式来导入写在 json 中的配置信息。我们需要在 tsconfig.json 文件中开启一下配置:{ "compilerOptions": { "resolveJsonModule": true } }
使用 pinia 时遇到的报错问题:“getActivePinia was called with no active Pinia. Did you forget to install pinia?“,此错误通常是在没有注册pinia时就使用了pinia时产生的报错信息可能你会觉得我已经在 main.ts 中注入了 pinia 了啊?怎么还是报错呢?这可能是你在使用 pinia 时不规范,如下面代码:// src/hooks/useUser.ts import { useUserStore } from '@/store' const user = useUserStore() export function useUser() { const userName = user.name return {} }有经验的同学可能已经注意到了上面代码的问题所在,这里在 pinia 没有注册的时候就直接 const user = useUserStore() 了,这显然是不对的。正确的做法是:// src/hooks/useUser.ts import { useUserSt
什么是模板引擎模板引擎是一种用于动态生成HTML、XML等内容的工具或框架。它允许开发者将数据与HTML模板结合,以生成最终的页面内容。通常,模板引擎会使用一种特定的语法来表示动态数据和逻辑,然后将这些模板与实际数据进行渲染,生成最终的输出。模板引擎的主要作用是简化动态内容的生成过程,并提高页面的可维护性。它们通常支持一些基本的逻辑控制,如条件判断和循环,以便根据不同情况生成不同的输出。常见的模板引擎包括Mustache、Handlebars、EJS等,它们各自具有不同的特性和语法。ejs 简介ejs(Embedded JavaScript templating)是一种流行的模板引擎,支持在nodejs和浏览器环境上使用。它允许开发者使用JavaScript代码嵌入HTML模板中,以便根据需要动态生成内容。ejs 的语法简单易懂,类似于普通的HTML标记,但可以使用<%= %>标签来插入JavaScript代码,<% %>标签来执行JavaScript代码,以及<%- %>标签来插入未经转义的HTML内容。这使得ejs非常灵活,可以方便地处理各种动态
简介Node Version Manager(NVM)是一个常用的 Node.js 版本管理工具,可用于在开发过程中方便地切换不同版本的 Node.js。通过 NVM,用户可以根据项目需求选择不同的 Node.js 版本,而无需手动安装和卸载多个版本的 Node.js。安装注意:为了避免版本冲突和环境混乱,在安装 nvm 之前先卸载之前安装的 Node.js。删除 node.js 相关的目录。查看 C:\Users\用户名 目录下是否拥有 .npmrc、.yarnrc 等都要进行删除。查看环境变量中是否拥有关于 node.js 相关的配置也要进行相应的删除。nvm 下载地址1. 选择 nvm 安装路径2. 选择 node.js 安装路径3. 之后就是一直 next4. 检测是否安装成功通过 nvm version 命令查看版本号nvm version配置安装 node1. 查看可安装 node 版本nvm list available2. 安装相应的 node 版本nvm install xx.xx.xx3. 查看已安装 node 版本nvm list目前已经安装了指定版本的 node
call函数调用时动态的改变函数的上下文,从而指定函数体内部 this 的指向。语法:function.call(context, arg1, arg2, ...)示例:const obj = { name: '小明', greeting: function(text) { console.log(`${text}, ${this.name}!`) } } obj.greeting('你好'); // 输出:你好, 小明! const person = { name: '小红' } obj.greeting.call(person, '你好'); // 输出:你好, 小红!这里将 obj.greeting 方法中的 this 绑定到 person 对象上,因此对应的读取 person 中的 name。applyapply 和 call 一样也是函数调用时动态的改变函数的上下文,从而指定函数体内部 this 的指向。唯一不同的地方是是参数形式不同,capply 需要通过数组的方式进行传递。语法:function.apply(conte
简介pnpm(performant npm)在 2017 年正式发布,定义为快速的,节省磁盘空间的包管理工具,开创了一套新的依赖管理机制。优势在介绍 pnpm 的优势之前,先来了解一下在以前 npm 和 yarn 的一些问题。早期的 npm1、npm2 主要是采用简单的依赖递归方式,造成了高度的依赖嵌套,此时就造成了以下问题:重复依赖嵌套地狱:重复大量的依赖嵌套,增加文件体积,造成了磁盘空间的浪费,使得安装速度过慢。文件路径过长:window 系统下,路径过长会导致爆错,最多260多个字符。之后 npm3 采用扁平化的方式,将依赖提升到根目录,解决了路径过长的问题,但是也带来了新的问题:扁平化依赖算法耗时长幻影依赖(Phantom dependencies):由于扁平化的方式使得依赖提升到了根目录,此时项目中的 package.json 并没有记录某个依赖,但是却能够在项目中使用,此时就造成了幻影依赖。幻影依赖可能会导致依赖之间的兼容问题,导致项目不能正常运行。不确定性(Non-Determinism):由于依赖提升只能提升一个,如 A包安装B@1,C包和D包安装B@2,此时一个B依赖
简介FileReader 对象提供了读取文件内容的,它允许网页通过异步方式读取用户计算机上的文件内容。属性error在读取文件的过程中发生错误时,该属性包含一个错误对象。readyState表示 FileReader 状态的数字,表示以下值之一:0 (EMPTY):尚未初始化。1 (LOADING):正在读取。2 (DONE):已完成读取。result返回读取文件的 ArrayBuffer、Blob、DataURL 或 Text 格式。方法abort()取消读取操作。在返回时,readyState 属性为 DONE。readAsArrayBuffer(blob)开始读取指定的 Blob 中的内容。一旦完成,result 属性中就包含一个 ArrayBuffer 对象。readAsBinaryString(blob) 【已弃用】开始读取指定的 Blob 中的内容。一旦完成,result 属性中将包含所读取文件的原始二进制数据。readAsDataURL(blob)开始读取指定的 Blob 中的内容。一旦完成,result 属性中将包含一个 data: URL 格式的 Base64 字符串
报错信息:npm ERR! code ERESOLVE npm ERR! ERESOLVE unable to resolve dependency tree npm ERR! npm ERR! While resolving: nest-app@0.0.1 npm ERR! Found: @nestjs/common@10.3.3 npm ERR! node_modules/@nestjs/common npm ERR! @nestjs/common@"^10.0.0" from the root project npm ERR! npm ERR! Could not resolve dependency: npm ERR! peer @nestjs/common@"^7.0.0" from @nestx-log4js/core@1.5.1 npm ERR! node_modules/@nestx-log4js/core npm ERR! @nestx-log4js/core@"*" from the root pr
在写个人小demo时需要使用到一种效果就是一开始为 input 框,当用户点击时变化为 textarea 并光标能够进行聚焦。通过 ref 来获取 textarea 组件,并使用 focus() 事件来对文本框进行光标的聚焦。<template> <NInput v-model:value="desc" v-if="!isFocusDesc" @focus="handleFocusDesc"/> <NInput v-model:value="desc" type="textarea" v-else ref="textarea" @blur="isFocusDesc = false"/> </template> <script setup> import {ref, nextTick} from 'vue' import {NInput} from 'naive-ui' let d
作用inset 属性结合了 top, right, bottom, left 四个方向上的值,使得设置元素位置更为简洁和方便。使用inset 属性可以接受一个至四个值,分别代表 top, right, bottom, left 四个方向上的偏移量,顺序为顺时针顺序。例如:.element { inset: 10px; /* 上右下左均偏移 10 像素 */ } .element { inset: 10px 20px; /* 上下偏移 10 像素,左右偏移 20 像素 */ } .element { inset: 10px 20px 30px; /* 上偏移 10 像素,左右偏移 20 像素,下偏移 30 像素 */ } .element { inset: 10px 20px 30px 40px; /* 上偏移 10 働素,右偏移 20 像素,下偏移 30 働素,左偏移 40 働素 */ }注意事项如果只提供一个值,将应用到所有四个方向,相当于 top, right, bottom, left 均设置为这个值。如果提供两个值,第一个值应用于 top 和 bottom
在访问自己的站点时发现访问速度缓慢,刚开始以为是网络问题,当再次访问时发现连数据库都无法进行访问了,还以为是受到攻击了。当我急忙的登录宝塔查看时才知道是磁盘爆满了,由于磁盘爆满导致数据库被停止了。通过 df -h 查看磁盘使用情况,这里是已经清理过之后的了,在没清理前 /dev/vda1 使用率已经达到百分之九十多。 我们可以通过 du -sh * 命令查看当前目录下的文件磁盘使用情况。这里可以看到 /www 目录的使用量是最大的,我们进入 /www 目录下查看具体情况。(这也是清理后的,在没清理前为百分之四五十)这里可以看到主要是 /www/backup/panel 目录里面占用情况是最大的。那么 /www/backup/panel 目录里存放的文件是做什么的呢?/www/backup/panel 目录下的文件存放的都是宝塔面板的备份文件,宝塔面板每天会自动生成备份文件将其存放在 /www/backup/panel 目录下并以时间进行命令。知道了 /www/backup/panel 目录是干什么的了之后,就知道了,只要将 /www/backup/panel 目录下的文件删除就可以了
在项目下创建虚拟环境$ pip -m vevn venv在虚拟环境中安装依赖,如上目录:$ /home/messageGrab/venv/bin/pip install -r requirements.txt如果使用python项目管理器来设置,由于python项目管理器在2.0版本之后搭建的 md5_venv 虚拟环境中不会生成 activate 文件了,所以需要手动创建一个虚拟环境安装好后,在计划任务中设置cd /home/messageGrab source venv/bin/activate python3 main.pycd /home/messageGrab source venv/bin/activate venv/bin/python main.pypython3 main.py 是运行 py 文件,不一定大家的都是 python3,py 文件也要按实际情况来 参考文件:https://blog.csdn.net/weixin_43575792/article/details/124838204https://blog.csdn.net/sincala/article/
创建虚拟环境python -m venv [venv_name][venv_name] 是虚拟环境名安装依赖在虚拟环境中安装依赖也是通过 pip,只是是使用虚拟环境中的 pip 来安装依赖venv 是我创建的虚拟环境,在 venv 文件目录下拥有一个 Scripts在 Scripts 目录下运行 cmd 通过 pip 来安装依赖此时虚拟环境安装的依赖不会对全局环境造成影响
简介pip 是 Python 官方推荐的包管理工具,它为开发者提供了一种方便、快捷的方式来安装、升级和管理 Python 包。pip 可以从 Python Package Index(PyPI)上搜索并获取众多开源的 Python 包,大大简化了依赖包的管理问题。pip 的基本操作安装 pip在大多数现代的 Python 发行版中,pip 已经默认安装,你可以通过以下命令来检查它是否已安装:$ pip --version如果能成功输出版本号,表示 pip 已经安装并且准备就绪。如果 pip 未安装,你可以使用以下命令来安装它(根据你的操作系统可能会有所不同):# 在 Linux/macOS 上 $ sudo apt-get install python3-pip # 在 Windows 上 $ py -m ensurepip --upgrade --default-pip搜索包使用 pip 可以轻松地搜索 Python 包。你可以使用以下命令来搜索特定的包:$ pip search [package_name]这将返回与包名称相关的列表,并显示一些基本信息,如包的名称、描述和最新版本
介绍fiddler 是一款 HTTP 协议调试代理工具,它能够抓取记录本机所有 HTTP(S) 请求。其运行机制其实就是本机 127.0.0.1 上监听 8888 端口库的 HTTP 代理。fiddler 无论对开发人员或者测试人员来说,都是非常有用的工具。工作原理Fiddler 工作原理_fiddler的实现原理-CSDN博客Fiddler 工作原理及界面简介_fidder的工作原理-CSDN博客fiddler 基本配置fiddler 在没有配置之前是不可以抓取 HTTPS 的包的。按照以下进行配置Tools -> HTTPS -> Decrypt HTTPS traffic。勾选后会弹出安装证书提示,根据提示进行安装即可。Tools -> Telerik Fiddler Options -> Connections。重启 fiddlerfiddler 抓取 IE 浏览器 fiddler 都可以进行数据抓取,但是使用其他的浏览器 fiddler 可能会抓取不到数据,需要而外设置代理。设置过滤右侧窗口拥有一个 filters,勾上 Use Filters 进行启
a
不过是些许风霜罢了