当前位置：首页 > news >正文

时区转换工具+PWA离线网页

news 来源：原创 2025/9/21 6:13:28

时区转换工具+PWA离线网页

一、时区转换工具对比

工具	说明
Date	原生 JS API，有限的时区支持，无法指定时区，仅使用本地时区。
Intl.DateTimeFormat	原生格式化显示，可指定时区，但不能修改时区逻辑。
luxon	强烈推荐，现代、轻量、功能强，原生支持时区、时间戳、格式化等。
dayjs + timezone 插件	类似 moment，更现代，但时区支持需插件。
moment-timezone	功能全面但体积大，moment 官方已不推荐用于新项目。

二、Luxon 使用示例

1. 美国时间 -> 中国时间

import { DateTime } from 'luxon'const usTime = DateTime.fromISO('2025-04-01T11:11:00', { zone: 'America/Los_Angeles' })const timestamp = usTime.toMillis()const cnTime = usTime.setZone('Asia/Shanghai')console.log('美国时间：', usTime.toFormat('yyyy-MM-dd HH:mm:ss ZZZZ'))
console.log('时间戳：', timestamp)
console.log('对应的中国时间：', cnTime.toFormat('yyyy-MM-dd HH:mm:ss ZZZZ'))

美国时间：2025-04-01 11:11:00 GMT-7
时间戳：1743521460000
对应的中国时间：2025-04-02 02:11:00 GMT+8

2. 中国时间 -> 美国时间

const cn = DateTime.fromISO('2025-04-01T11:11:00', { zone: 'Asia/Shanghai' })const us = cn.setZone('America/Los_Angeles')console.log('中国时间：', cn.toFormat('yyyy-MM-dd HH:mm:ss ZZZZ'))
console.log('对应的美国时间：', us.toFormat('yyyy-MM-dd HH:mm:ss ZZZZ'))
console.log('时间戳（UTC）：', cn.toMillis())

3. 转换逻辑总结

场景	方法
指定时区的时间 → 时间戳	DateTime.fromISO(…).toMillis()
时间戳 → 指定时区时间	DateTime.fromMillis(…).setZone(…)
不同时区之间转换	.setZone(…)
时间格式化	.toFormat(‘yyyy-MM-dd HH:mm:ss’) 等

4. 常用时区 ID 表

名称	IANA 时区 ID
北京/上海（Asia/Shanghai）	Asia/Shanghai
香港（Asia/Hong_Kong）	Asia/Hong_Kong
日本（Asia/Tokyo）	Asia/Tokyo
韩国（Asia/Seoul）	Asia/Seoul
新加坡（Asia/Singapore）	Asia/Singapore
印度（Asia/Kolkata）	Asia/Kolkata
美国西部 - 洛杉矶（America/Los_Angeles）	America/Los_Angeles
美国中部 - 芝加哥（America/Chicago）	America/Chicago
美国东部 - 纽约（America/New_York）	America/New_York
英国（Europe/London）	Europe/London
德国（Europe/Berlin）	Europe/Berlin
法国（Europe/Paris）	Europe/Paris
澳大利亚 - 悉尼（Australia/Sydney）	Australia/Sydney
新西兰（Pacific/Auckland）	Pacific/Auckland
夏威夷（Pacific/Honolulu）	Pacific/Honolulu
UTC（协调世界时）	UTC

三、时区转换脚本

1. NodeJS 脚本（使用 luxon）

const { DateTime } = require('luxon')function convertTime({timeStr = '2025-04-01 11:11:00',fromZone = 'America/Los_Angeles',toZone = 'Asia/Shanghai'
}) {const fromTime = DateTime.fromFormat(timeStr, 'yyyy-MM-dd HH:mm:ss', { zone: fromZone })const toTime = fromTime.setZone(toZone)console.log(`原始时间 (${fromZone}):`, fromTime.toFormat('yyyy-MM-dd HH:mm:ss ZZZZ'))console.log(`时间戳（UTC 毫秒）:`, fromTime.toMillis())console.log(`转换后 (${toZone}):`, toTime.toFormat('yyyy-MM-dd HH:mm:ss ZZZZ'))
}// 修改这里的参数即可
convertTime({timeStr: '2025-04-01 11:11:00',fromZone: 'America/Los_Angeles',toZone: 'Asia/Shanghai'
})

2. Python 脚本（使用 pytz）

pip install pytz

from datetime import datetime
import pytzdef convert_time(time_str='2025-04-01 11:11:00', from_zone='America/Los_Angeles', to_zone='Asia/Shanghai'):from_tz = pytz.timezone(from_zone)to_tz = pytz.timezone(to_zone)naive_dt = datetime.strptime(time_str, '%Y-%m-%d %H:%M:%S')from_dt = from_tz.localize(naive_dt)to_dt = from_dt.astimezone(to_tz)print(f'原始时间 ({from_zone}): {from_dt.strftime("%Y-%m-%d %H:%M:%S %Z%z")}')print(f'时间戳（UTC 秒）: {int(from_dt.timestamp())}')print(f'转换后 ({to_zone}): {to_dt.strftime("%Y-%m-%d %H:%M:%S %Z%z")}')# 修改参数即可
convert_time(time_str='2025-04-01 11:11:00',from_zone='America/Los_Angeles',to_zone='Asia/Shanghai'
)

四、网页小工具

使用 Luxon + HTML 原生控件制作的小工具，支持：

输入时间
原始/目标时区选择
时间戳显示
一键复制

1. 代码展示

<!DOCTYPE html>
<html lang="zh">
<head><meta charset="UTF-8" /><title>🌏 时区时间转换工具</title><script src="https://cdn.jsdelivr.net/npm/luxon@3/build/global/luxon.min.js"></script><style>body {font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;padding: 2rem;max-width: 700px;margin: auto;background: #f8f9fa;}h2 {text-align: center;margin-bottom: 2rem;}label {font-weight: bold;margin-top: 1rem;display: block;}input, select, button {width: 100%;padding: 0.6rem;margin: 0.4rem 0 1rem;border: 1px solid #ccc;border-radius: 5px;font-size: 1rem;}button {background: #007bff;color: white;cursor: pointer;border: none;transition: background 0.3s;}button:hover {background: #0056b3;}.result {background: #fff;border-left: 5px solid #007bff;padding: 1rem;margin-top: 1rem;border-radius: 5px;white-space: pre-wrap;font-size: 0.95rem;}.error {color: red;margin-top: 1rem;}.copy-btn {margin-top: 0.5rem;background: #28a745;}.copy-btn:hover {background: #1e7e34;}table {width: 100%;border-collapse: collapse;margin-top: 2rem;background: #fff;}th, td {border: 1px solid #ddd;padding: 0.6rem;text-align: left;}th {background-color: #007bff;color: white;}</style>
</head>
<body><h2>🕒 时区转换小工具</h2><label for="inputDate">选择时间</label><input type="datetime-local" id="inputDate" /><label for="fromZone">原始时区</label><select id="fromZone"></select><label for="toZone">目标时区</label><select id="toZone"></select><button onclick="convertTime()">转换时间</button><div class="result" id="output">👇 转换结果将在这里显示</div><button class="copy-btn" onclick="copyResult()">📋 复制结果</button><div class="error" id="error"></div><script>const { DateTime } = luxonconst timezones = [{ label: '北京（Asia/Shanghai）', value: 'Asia/Shanghai' },{ label: '香港（Asia/Hong_Kong）', value: 'Asia/Hong_Kong' },{ label: '日本（Asia/Tokyo）', value: 'Asia/Tokyo' },{ label: '韩国（Asia/Seoul）', value: 'Asia/Seoul' },{ label: '新加坡（Asia/Singapore）', value: 'Asia/Singapore' },{ label: '印度（Asia/Kolkata）', value: 'Asia/Kolkata' },{ label: '美国西部 - 洛杉矶（America/Los_Angeles）', value: 'America/Los_Angeles' },{ label: '美国中部 - 芝加哥（America/Chicago）', value: 'America/Chicago' },{ label: '美国东部 - 纽约（America/New_York）', value: 'America/New_York' },{ label: '英国（Europe/London）', value: 'Europe/London' },{ label: '德国（Europe/Berlin）', value: 'Europe/Berlin' },{ label: '法国（Europe/Paris）', value: 'Europe/Paris' },{ label: '澳大利亚 - 悉尼（Australia/Sydney）', value: 'Australia/Sydney' },{ label: '新西兰（Pacific/Auckland）', value: 'Pacific/Auckland' },{ label: '夏威夷（Pacific/Honolulu）', value: 'Pacific/Honolulu' },{ label: 'UTC（协调世界时）', value: 'UTC' },]function renderTimezoneOptions() {const fromSelect = document.getElementById('fromZone')const toSelect = document.getElementById('toZone')const tableBody = document.getElementById('timezoneTable')timezones.forEach(({ label, value }) => {const opt1 = new Option(label, value)const opt2 = new Option(label, value)fromSelect.appendChild(opt1)toSelect.appendChild(opt2)})fromSelect.value = 'Asia/Shanghai'toSelect.value = 'America/Los_Angeles'}document.addEventListener('DOMContentLoaded', () => {renderTimezoneOptions()const now = new Date()const local = now.toISOString().slice(0, 16)document.getElementById('inputDate').value = local})function convertTime() {const input = document.getElementById('inputDate').valueconst fromZone = document.getElementById('fromZone').valueconst toZone = document.getElementById('toZone').valueconst output = document.getElementById('output')const error = document.getElementById('error')error.textContent = ''if (!input) {error.textContent = '❌ 请选择一个时间'return}try {const dt = DateTime.fromISO(input, { zone: fromZone })const toTime = dt.setZone(toZone)const result = `
🌍 原始时间（${fromZone}）:${dt.toFormat('yyyy-MM-dd HH:mm:ss ZZZZ')}🕗 时间戳（UTC 毫秒）:${dt.toMillis()}➡️ 转换后时间（${toZone}）:${toTime.toFormat('yyyy-MM-dd HH:mm:ss ZZZZ')}`.trim()output.textContent = result}catch (e) {error.textContent = '❌ 转换失败，请检查输入'}}function copyResult() {const result = document.getElementById('output').textContentif (!result || result.includes('将在这里显示'))returnnavigator.clipboard.writeText(result).then(() => {alert('✅ 已复制到剪贴板！')})}</script>
</body>
</html>

2. 示例截图

五、PWA 应用支持

1. PWA 结构

.
├── icons
│   ├── time_192.png
│   └── time_512.png
├── index.html
├── luxon.min.js
├── manifest.json
└── service-worker.js

2. manifest.json

用于定义名称、图标、启动方式等：

{"name": "时区时间转换工具","short_name": "时区转换","start_url": "./index.html","display": "standalone","background_color": "#ffffff","theme_color": "#007bff","description": "支持多时区时间互转、时间戳生成的轻量工具","icons": [{"src": "icons/time_192.png","sizes": "192x192","type": "image/png"},{"src": "icons/time_512.png","sizes": "512x512","type": "image/png"}]
}

3. service-worker.js

实现核心缓存功能，支持离线访问：

const CACHE_NAME = 'timezone-converter-0.0.1'
const urlsToCache = ['./','./index.html','./manifest.json','./service-worker.js','./icons/time_192.png','./icons/time_512.png','./luxon.min.js'
]// 安装时预缓存核心资源
self.addEventListener('install', event => {self.skipWaiting()event.waitUntil(caches.open(CACHE_NAME).then(cache => cache.addAll(urlsToCache)))
})// 激活时清除旧缓存
self.addEventListener('activate', event => {event.waitUntil(caches.keys().then(keys =>Promise.all(keys.filter(k => k !== CACHE_NAME).map(k => caches.delete(k)))))self.clients.claim()
})// 拦截所有请求，优先从缓存读取，失败则网络请求
self.addEventListener('fetch', event => {const request = event.requestevent.respondWith(caches.match(request).then(cachedResponse => {if (cachedResponse) return cachedResponsereturn fetch(request).then(networkResponse => {if (networkResponse &&networkResponse.status === 200 &&request.url.startsWith(self.location.origin)) {const cloned = networkResponse.clone()caches.open(CACHE_NAME).then(cache => {cache.put(request, cloned)})}return networkResponse}).catch(() => {if (request.headers.get('accept')?.includes('text/html')) {return caches.match('./index.html')}})}))
})

4. html 文件

整合 Luxon + PWA 注册逻辑

<!DOCTYPE html>
<html lang="zh">
<head><meta charset="UTF-8" /><title>🌏 时区时间转换工具1</title><meta name="viewport" content="width=device-width, initial-scale=1" /><meta name="theme-color" content="#007bff" /><link rel="manifest" href="manifest.json" /><link rel="icon" href="icons/time_192.png" /><link rel="apple-touch-icon" href="icons/time_512.png" /><script src="./luxon.min.js"></script><style>body {font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;padding: 2rem;max-width: 700px;margin: auto;background: #f8f9fa;}h2 {text-align: center;margin-bottom: 2rem;}label {font-weight: bold;margin-top: 1rem;display: block;}input, select, button {width: 100%;padding: 0.6rem;margin: 0.4rem 0 1rem;border: 1px solid #ccc;border-radius: 5px;font-size: 1rem;}button {background: #007bff;color: white;cursor: pointer;border: none;transition: background 0.3s;}button:hover {background: #0056b3;}.result {background: #fff;border-left: 5px solid #007bff;padding: 1rem;margin-top: 1rem;border-radius: 5px;white-space: pre-wrap;font-size: 0.95rem;}.error {color: red;margin-top: 1rem;}.copy-btn {margin-top: 0.5rem;background: #28a745;}.copy-btn:hover {background: #1e7e34;}table {width: 100%;border-collapse: collapse;margin-top: 2rem;background: #fff;}th, td {border: 1px solid #ddd;padding: 0.6rem;text-align: left;}th {background-color: #007bff;color: white;}</style>
</head>
<body><h2>🕒 时区转换小工具</h2><label for="inputDate">选择时间</label><input type="datetime-local" id="inputDate" /><label for="fromZone">原始时区</label><select id="fromZone"></select><label for="toZone">目标时区</label><select id="toZone"></select><button onclick="convertTime()">转换时间</button><div class="result" id="output">👇 转换结果将在这里显示</div><button class="copy-btn" onclick="copyResult()">📋 复制结果</button><div class="error" id="error"></div><script>const { DateTime } = luxonconst timezones = [{ label: '北京（Asia/Shanghai）', value: 'Asia/Shanghai' },{ label: '香港（Asia/Hong_Kong）', value: 'Asia/Hong_Kong' },{ label: '日本（Asia/Tokyo）', value: 'Asia/Tokyo' },{ label: '韩国（Asia/Seoul）', value: 'Asia/Seoul' },{ label: '新加坡（Asia/Singapore）', value: 'Asia/Singapore' },{ label: '印度（Asia/Kolkata）', value: 'Asia/Kolkata' },{ label: '美国西部 - 洛杉矶（America/Los_Angeles）', value: 'America/Los_Angeles' },{ label: '美国中部 - 芝加哥（America/Chicago）', value: 'America/Chicago' },{ label: '美国东部 - 纽约（America/New_York）', value: 'America/New_York' },{ label: '英国（Europe/London）', value: 'Europe/London' },{ label: '德国（Europe/Berlin）', value: 'Europe/Berlin' },{ label: '法国（Europe/Paris）', value: 'Europe/Paris' },{ label: '澳大利亚 - 悉尼（Australia/Sydney）', value: 'Australia/Sydney' },{ label: '新西兰（Pacific/Auckland）', value: 'Pacific/Auckland' },{ label: '夏威夷（Pacific/Honolulu）', value: 'Pacific/Honolulu' },{ label: 'UTC（协调世界时）', value: 'UTC' }]function renderTimezoneOptions() {const fromSelect = document.getElementById('fromZone')const toSelect = document.getElementById('toZone')timezones.forEach(({ label, value }) => {const opt1 = new Option(label, value)const opt2 = new Option(label, value)fromSelect.appendChild(opt1)toSelect.appendChild(opt2)})fromSelect.value = 'Asia/Shanghai'toSelect.value = 'America/Los_Angeles'}function convertTime() {const input = document.getElementById('inputDate').valueconst fromZone = document.getElementById('fromZone').valueconst toZone = document.getElementById('toZone').valueconst output = document.getElementById('output')const error = document.getElementById('error')error.textContent = ''if (!input) {error.textContent = '❌ 请选择一个时间'return}try {const dt = DateTime.fromISO(input, { zone: fromZone })const toTime = dt.setZone(toZone)const result = `
🌍 原始时间（${fromZone}）:
${dt.toFormat('yyyy-MM-dd HH:mm:ss ZZZZ')}🕗 时间戳（UTC 毫秒）:
${dt.toMillis()}➡️ 转换后时间（${toZone}）:
${toTime.toFormat('yyyy-MM-dd HH:mm:ss ZZZZ')}`.trim()output.textContent = result} catch (e) {error.textContent = '❌ 转换失败，请检查输入'}}function copyResult() {const result = document.getElementById('output').textContentif (!result || result.includes('将在这里显示')) returnnavigator.clipboard.writeText(result).then(() => {alert('✅ 已复制到剪贴板！')})}// 初始化document.addEventListener('DOMContentLoaded', () => {renderTimezoneOptions()const now = new Date()const local = now.toISOString().slice(0, 16)document.getElementById('inputDate').value = local})// 注册 PWA service workerif ('serviceWorker' in navigator) {window.addEventListener('load', () => {navigator.serviceWorker.register('service-worker.js').then(() => console.log('✅ Service Worker 注册成功')).catch(err => console.log('❌ 注册失败:', err))})}</script>
</body>
</html>

5. Live server 启动

启动完成安装到本地即可

六、总结

本项目对比并选用 Luxon 实现多时区转换，支持各时区时间互转。
提供 NodeJS 与 Python 脚本、网页小工具及 PWA 应用，功能完整、结构清晰。
适用于快速使用、系统集成或离线访问，具备良好扩展性。

时区转换工具+PWA离线网页

时区转换工具PWA离线网页一、时区转换工具对比工具说明Date原生 JS API，有限的时区支持，无法指定时区，仅使用本地时区。Intl.DateTimeFormat原生格式化显示，可指定时区，但不能修改时区逻辑。luxon强烈推荐&#xf…...

编程日记 2025/9/21 6:13:28

首先创建两个类两个类的代码 Student类： import org.apache.hadoop.io.Writable;import java.io.DataInput; import java.io.DataOutput; import java.io.IOException;public class Student implements Writable {public Student(String name, int age) {this.n…...

编程日记 2025/9/21 6:13:27

Github AI开发者生态最新动态今日速览（20250408）

以下是截至2025年4月8日的GitHub AI开发者生态最新动态速览，结合技术更新、工具发布及行业趋势： 1. GitHub Copilot 重大升级与生态扩展 Agent Mode全量发布：Copilot在VS Code中启用Agent模式，可自主完成多文件代码重构、测试驱动…...

编程日记 2025/9/21 6:12:27

通过扣子平台将数据写入飞书多维表格

目录 1.1 创建飞书开放平台应用 1.2 创建飞书多维表格 1.3 创建扣子平台插件 1.1 创建飞书开放平台应用 1.1.1 打开地址：飞书开放平台，点击创建应用注：商店应用需要申请ISV资质，填写企业主体信息，个人的话&#x…...

编程日记 2025/9/21 6:12:26

WEB安全--内网渗透--Kerberos之AS_REQAS_REP

一、前言之前的文章提到过，在内网的域环境中，服务器之间默认使用的是Kerberos协议。光了解NTLM协议是远远不够的，为了内网渗透，我后面将详细介绍Kerberos协议的原理以及漏洞的利用。二、Kerberos协议 Kerberos是一种网络身份…...

编程日记 2025/9/19 1:37:56

【Hadoop入门】Hadoop生态之MapReduce简介

1 MapReduce核心原理 MapReduce是一种分布式计算框架，专为处理大规模数据集设计。其核心理念是将复杂计算任务分解为两个核心阶段： Map阶段：将输入数据分割为独立片段，并行处理生成中间键值对Reduce阶段：对Map阶段输出…...

编程日记 2025/9/20 23:08:14

使用Scrapy编写图像下载程序示例

最近闲来无事想要用Scrapy库来编写一个图像下载程序。首先，我得回忆一下Scrapy的基本结构。Scrapy是一个强大的爬虫框架，适合用来抓取网页数据，包括图片。不过，用户可能不太熟悉Scrapy的具体用法，特别是图片下载的部分…...

编程日记 2025/9/19 6:10:32

Linux/树莓派网络配置、远程登录与图形界面访问实验

一.准备工作 1.修改网络适配器（选择本机网卡） 2.创建一个新的用户。 3.使用新用户登录，使用ip a指令查看IP（现代 Linux 发行版（如 Ubuntu、Debian、CentOS、Fedora 等））。通过sudo arp-sca…...

编程日记 2025/9/14 1:33:23

01-Redis-基础

1 redis诞生历程 redis的作者笔名叫做antirez，2008年的时候他做了一个记录网站访问情况的系统，比如每天有多少个用户，多少个页面被浏览，访客的IP、操作系统、浏览器、使用的搜索关键词等等(跟百度统计、CNZZ功能一样)。最开始存储…...

编程日记 2025/9/12 3:34:58

MCP-Playwright: 赋予AI模型操控浏览器的能力

在人工智能快速发展的时代，我们一直在寻找让AI与现实世界更好地交互的方式。今天我想向大家介绍一个强大的开源项目：MCP-Playwright，它正在改变AI模型与Web环境交互的方式。源码地址：https://github.com/executeautomation/mcp-…...

编程日记 2025/9/11 1:16:27

Scala集合计算高级函数及案例

一、说明 1.过滤：遍历集合，获取满足指定条件的元素组成新集合 2.转化 / 映射（map）：将集合中的每个元素映射到某一个函数 List(1, 2, 3, 4, 5, 6, 7, 8, 9)中每个元素加 1，得到List(2, 3, 4, 5, 6, 7, 8,…...

编程日记 2025/9/18 13:07:27

如何测试一个API接口？从原理到实践详解

在微服务架构和前后端分离的现代软件开发中，API接口是系统的“血管”，承担着数据传输与逻辑处理的核心功能。本文将用通俗的语言，结合实例，系统讲解API接口测试的原理、方法及工具，助你掌握这一关键技能。目录 …...

编程日记 2025/9/18 18:58:56

弹簧质点系统（C++实现）

本文实现一个简单的物理算法：弹簧质点系统（Mass-Spring System）。这是一个经典的物理模拟算法，常用于模拟弹性物体（如布料、弹簧等）的行为。我们将使用C来实现这个算法，并结合链表数据结构来管理…...

编程日记 2025/9/20 2:14:35

java设计模式-代理模式

代理模式(proxy) 基本介绍 1、代理模式：为一个对象提供一个替身，一控制对这个对象的访问。即通过代理对象访问目标对象。这样做的好处是：可以在目标对象实现的基础上，增强额外的功能操作，及扩展目标对象的功能。 2、被…...

编程日记 2025/9/4 20:41:30

【比赛编排软件的设计与实现】

有个朋友想要一个比赛编排软件，闲来无事，花几个晚上的时间帮忙编写了一下，主要本人也比较喜欢看NBA，想尝试实现类似的功能。最终实现功能展示如下： ![请添加图片描述](https://i-blog.csdnimg.cn/direct/6af8f323452…...

编程日记 2025/9/16 0:52:28

nginx如何实现负载均衡？

Nginx 是一款高性能的 Web 服务器和反向代理服务器，它可以通过配置实现负载均衡功能。以下是实现负载均衡的详细步骤和方法： 1. 基本概念负载均衡是将客户端请求分发到多个后端服务器上，以提高系统的可用性和性能。Nginx 支持多种负载均衡策…...

编程日记 2025/9/12 8:04:16

Jetson NX开发板基础配置全指南

一、系统刷机教程 1. 准备工作硬件准备： ✅ Jetson NX开发板 ✅ 19V 电源适配器 ✅ Type-C数据线 ✅ 16GB以上Micro SD卡软件准备： 🔹 SDK Manager 🔹 Ubuntu 20.04虚拟机或者物理机 2. 刷机步骤进入恢复模式： …...

编程日记 2025/9/15 6:02:39

【Linux高级IO（三）】Reactor

核心代码 Epoller.hpp #pragma once#include "nocopy.hpp" #include <cerrno> #include <sys/epoll.h> #include <unistd.h> #include <string.h> #include "Log.hpp"class Epoller : public nocopy //类Epoller继承自nocopy类&a…...

编程日记 2025/9/21 1:13:43

山东大学计算机网络第五章习题解析

参考教材：计算机网络：自顶向下方法：原书第 8 版 / （美）詹姆斯F. 库罗斯（James F. Kurose），（美）基恩W. 罗斯（Keith W. Rose）著&#xf…...

编程日记 2025/9/21 4:06:10

openexr-2.3.0-windows编译

本文操作按照《c&c开源库编译指南》中内容规范编写，编译环境配置、工具下载、目录规划，及更多其他开源库编译方法请参考该文章。 c&c开源库编译指南：https://blog.csdn.net/binary0006/article/details/144086155 本文章中的源代码已…...

编程日记 2025/9/8 10:13:33

【NLP 面经 8】

目录一、文本生成任务模型架构方面训练数据方面生成策略方面二、命名实体识别任务NER 模型架构方面特征工程方面训练优化方面三、情感分析任务模型架构方面训练数据方面超参数调整方面四、计算余弦相似度并添加符合条件结果提示： 思路与算法任由深渊的…...

编程日记 2025/9/19 13:31:12

Qt项目——记事本

目录前言工程文档一、功能介绍二、界面预览三、UI设计师工具四、给三个按钮设置贴图五、信号与槽六、实现文件打开功能代码实现代码实现七、实现文件保存代码内容八、实现文件关闭代码实现九、显示高亮和行列位置代码实现十、实现快捷功能代码实现总结前言这个项目就是…...

编程日记 2025/9/20 6:58:22

WHAT - React 惰性初始化

目录在 React 中如何使用惰性初始化示例：常规初始化 vs. 惰性初始化1. 常规初始化2. 惰性初始化为什么使用惰性初始化示例：从 localStorage 获取值并使用惰性初始化总结在 React 中，惰性初始化（Lazy Initialization&#xff09…...

编程日记 2025/8/22 13:03:07

HOW - 如何测试 React 代码

目录一、使用 React 测试库：testing-library/react二、使用测试演练场：testing-playground.com三、使用 Cypress 或 Playwright 进行端到端测试四、使用 MSW 在测试中模拟网络请求一、使用 React 测试库：testing-library/react testing-li…...

编程日记 2025/9/19 22:20:41

React 条件渲染

开发环境：Reacttsantd 通常你的组件会需要根据不同的情况显示不同的内容。在 React 中，你可以通过使用 JavaScript 的 if 语句、&& 和 ? : 运算符来选择性地渲染 JSX。例子我们在满足 isPacked{true} 条件的物品清单旁加上一个勾选符号✔。…...

编程日记 2025/9/11 13:10:22

使用 Canal 实现 MySQL 与 ES 数据同步的技术实践

前言本文将详细讲解如何使用阿里的 Canal 工具，实现 MySQL 向 ES（Elasticsearch）的数据同步。数据同步有多种方式，双写同步数据方式因性能慢、存在分布式事务及数据一致性问题、业务耦合度高且难以扩展，不适合采用…...

编程日记 2025/9/9 12:28:11

《实战AI智能体》什么是 Scrum 项目管理及为什么需要它

Scrum 项目管理是一种敏捷项目管理方法，强调团队合作、迭代开发和客户参与。它的核心概念包括 Scrum 团队、产品待办事项列表、Sprint、每日站立会议、Sprint 回顾会议等。Scrum 团队由产品负责人、Scrum 主管和开发团队组成，他们共同负责项目的规划、执行和交付：产品待办事…...

编程日记 2025/9/9 6:41:04

智能硬件开发革命：低代码平台+物联网

物联网和低代码开发初识物联网物联网的概念 20 世纪末，随着计算机网络和通信技术的兴起，互联网开始走进并融入人们的生活。传统互联网通常以人作为主体，数据的产生和传输都在人的控制下进行，数据的应用结果也在具体的人身上得…...

编程日记 2025/9/11 0:39:02

「合诚」携手企企通共建新材料和健康产业采购数智化新生态

在科技革命与产业变革深度融合的时代背景下，新材料与健康产业正迎来数字化、智能化的快速发展。技术突破与消费升级的双重驱动，推动着行业不断创新，同时也对企业的供应链管理提出了更高要求。 1、合诚：聚焦新材料与健康产业&am…...

编程日记 2025/9/18 15:07:30

ansible角色

一、角色 role 本质上就是目录 /etc/ansible/roles 1、创建角色 tree查看目录结构在同一个角色中，相互引用文件、操作时，不需要添加任何路径删除角色，将角色目录中的角色文件删除案例：部署zabbix agent 执行角色...

编程日记 2025/9/8 3:55:21

WHAT - React 元素接收的 ref 详解

目录 1. ref 的基本概念2. 如何使用 ref2.1 基本用法2.2 类组件使用 createRef 3. forwardRef 转发 ref4. ref 的应用场景5. ref 和函数组件总结在 React 中，ref（引用）用于访问 DOM 元素或类组件实例。它允许我们直接与元素进行交互&#xf…...

编程日记 2025/9/7 11:14:46

数字游戏（继Day 10）

主体: #include<stdio.h> #include<time.h> #include<stdlib.h>#include"mygetch.h"#define MAX 51 //定义测试字母的最大长度void help() {printf("\n****************************************");printf("\n*输入过程中无法退出…...

编程日记 2025/9/18 14:15:28

react 中将生成二维码保存到相册

需求：生成二维码，能保存到相册框架用的 react 所以直接 qrcode.react 插件，然后直接用插件生成二维码，这里一定要写 renderAs{‘svg’} 属性，否则会报错，这里为什么会报错？？&#…...

编程日记 2025/9/14 1:33:24

React-05React中props属性（传递数据），propTypes校验，类式与函数式组件props的使用

1.类式组件props基本数据读取与解构运算符传递 <script type"text/babel">// 创建组件class PersonalInfo extends React.Component {render() {// 读取props属性并读取值console.log(props,this.props);return(<ul><li>姓名：{this.p…...

编程日记 2025/9/10 17:26:39

export default function？在react中在前面还是后面呢？

好的！我将通过几个具体场景的代码示例，展示不同 export default 使用方式的适用情况，并给出推荐实践。场景 1：基础组件（推荐直接导出） 适用情况：简单组件，无需额外处理 // 方式A:…...

编程日记 2025/9/15 6:56:07

红米手机输入正确密码也无法解锁的问题的可尝试解决方法

文章目录问题现象官方途径没看到有能给解决的可尝试解决方法（汇总小红书成功解决方法，但从回复来看，多为成功的个例，整体而言希望不大）重启/强制重启尝试之前的密码等待一晚上后再次尝试输入密码，包括重启…...

编程日记 2025/9/20 14:37:10

优选算法系列（6.模拟）

一.替换所有的问号（easy） 题目链接：1576. 替换所有的问号 - 力扣（LeetCode） 解法： 纯模拟。从前往后遍历整个字符串，找到问号之后，就用 a ~ z 的每⼀个字符去尝试替换即可。代码…...

编程日记 2025/9/19 8:42:40

罗技K860键盘

罗技蓝牙键盘的顶部功能键F1-F12的原本功能单击罗技键盘的功能键时，默认响应的是键盘上面显示的快进、调节音量等功能。改变回F1~F12原本功能，同时按下 fn和esc组合键...

编程日记 2025/9/6 22:13:39

⭐算法OJ⭐数据流的中位数【最小堆】Find Median from Data Stream

最小堆最小堆是一种特殊的完全二叉树数据结构。基本定义堆性质：每个节点的值都小于或等于其子节点的值（根节点是最小值）完全二叉树性质：除了最底层外，其他层的节点都是满的，且最底层的节点都靠左排列…...

编程日记 2025/9/19 19:02:43

node-modules-inspector 使用以及 node_modules可视化依赖关联关系快速分析

node-modules-inspector 使用以及 node_modules可视化依赖关联关系快速分析 node-modules-inspector 简介 node-modules-inspector 是一个用于分析和可视化 node_modules 依赖关系的工具，主要功能包括： 依赖可视化：以交互式图表展示项目的依…...

编程日记 2025/9/18 23:29:39

python自动登录远程设备的几种方式（华为设备）

其实登录远程设备（交换机路由器）的方式无非就是通过SSH或者是Telnet这两个协议，当然最主要的还是SSH，这里主要讲的是通过这两个协议登录远程设备的几个方式拓扑本文都是用的这个拓扑，主要通过编写python脚本来登录其…...

编程日记 2025/9/20 17:17:58

【android bluetooth 框架分析 01】【关键线程 1】【关键线程介绍】

1. 为什么学习蓝牙协议栈之前，必须先梳理清楚这几大线程？ 为什么学习协议栈之前最好是要先梳理清楚关键线程 bt_stack_manager_threadbt_jni_threadbt_main_threadbt_a2dp_sink_worker_thread 1.1 蓝牙协议栈是典型的“多线程异步系统” 蓝牙协议…...

编程日记 2025/9/12 22:20:26

LDAP高效数据同步：Syncrepl复制模式实战指南

#作者：朱雷文章目录一、Syncrepl 复制简介1.1. 什么是复制模式1.2. 什么是 syncrepl同步复制二、Ldap环境部署三、配置复制类型3.1. 提供者端配置3.2. 消费者端配置3.3.启动服务3.4.测试同步是否生效四、总结一、Syncrepl 复制简介 1.1. 什么是复制模式 Ope…...

编程日记 2025/9/12 6:14:08

SeeGround: See and Ground for Zero-Shot Open-Vocabulary 3D Visual Grounding

CVPR 2025 核心问题与动机问题背景：3D视觉定位（3DVG）要求根据文本描述在3D场景中定位目标物体，是增强现实、机器人导航等应用的关键技术。传统方法依赖标注的3D数据集和预定义类别，限制了其在开放场景中的扩展性。现…...

编程日记 2025/9/16 4:57:48

深入理解Spring IoCDI

1. 引言：为什么需要IoC和DI？ 传统开发方式的耦合性问题在传统开发中，对象通常通过 new 关键字直接创建，例如： // 直接依赖具体实现类 UserService userService new UserServiceImpl(); OrderService orderService…...

编程日记 2025/9/18 13:36:47