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

HTML5系列(13)-- 微数据与结构化数据指南

前端技术探索系列:HTML5 微数据与结构化数据指南 📊

致读者:探索数据语义化的世界 👋

前端开发者们,

今天我们将深入探讨 HTML5 微数据与结构化数据,学习如何让网页内容更易被搜索引擎理解和解析。

微数据标准实现 🚀

基础微数据标注

<!-- 产品信息示例 -->
<div itemscope itemtype="https://schema.org/Product"><h1 itemprop="name">iPhone 13 Pro</h1><div itemprop="description">新一代 iPhone,搭载 A15 仿生芯片</div><div itemprop="offers" itemscope itemtype="https://schema.org/Offer"><span itemprop="price">7999</span><meta itemprop="priceCurrency" content="CNY"><link itemprop="availability" href="https://schema.org/InStock"><meta itemprop="priceValidUntil" content="2024-12-31"></div><div itemprop="aggregateRating" itemscope itemtype="https://schema.org/AggregateRating"><meta itemprop="ratingValue" content="4.8"><meta itemprop="reviewCount" content="2749"></div>
</div>

复杂数据结构

<!-- 企业信息示例 -->
<div itemscope itemtype="https://schema.org/Organization"><h1 itemprop="name">科技创新有限公司</h1><div itemprop="address" itemscope itemtype="https://schema.org/PostalAddress"><span itemprop="streetAddress">创新路88号</span><span itemprop="addressLocality">深圳市</span><span itemprop="addressRegion">广东省</span><meta itemprop="postalCode" content="518000"><meta itemprop="addressCountry" content="CN"></div><div itemprop="contactPoint" itemscope itemtype="https://schema.org/ContactPoint"><meta itemprop="contactType" content="customer service"><span itemprop="telephone">400-888-8888</span><span itemprop="email">support@example.com</span><meta itemprop="availableLanguage" content="zh-CN"></div>
</div>

结构化数据管理 📝

数据验证工具

class StructuredDataValidator {constructor() {this.schemas = new Map();this.loadSchemas();}async loadSchemas() {try {const response = await fetch('https://schema.org/version/latest/schemaorg-current-https.jsonld');const data = await response.json();this.parseSchemas(data);} catch (error) {console.error('Schema 加载失败:', error);}}parseSchemas(data) {data['@graph'].forEach(item => {if (item['@type'] === 'rdfs:Class') {this.schemas.set(item['@id'], {properties: new Set(),required: new Set()});}});}validateElement(element) {const itemtype = element.getAttribute('itemtype');if (!itemtype) return { valid: false, error: '缺少 itemtype' };const schemaType = this.getSchemaType(itemtype);if (!schemaType) return { valid: false, error: '未知的 Schema 类型' };return this.validateProperties(element, schemaType);}validateProperties(element, schemaType) {const errors = [];const properties = element.querySelectorAll('[itemprop]');// 检查必需属性schemaType.required.forEach(prop => {if (!this.hasProperty(properties, prop)) {errors.push(`缺少必需属性: ${prop}`);}});// 验证属性值properties.forEach(prop => {const propName = prop.getAttribute('itemprop');if (!schemaType.properties.has(propName)) {errors.push(`未知属性: ${propName}`);} else {const valueError = this.validatePropertyValue(prop);if (valueError) errors.push(valueError);}});return {valid: errors.length === 0,errors};}validatePropertyValue(prop) {const value = this.getPropertyValue(prop);const type = prop.getAttribute('itemtype');if (type && !this.schemas.has(type)) {return `无效的属性类型: ${type}`;}if (!value && !prop.hasAttribute('content')) {return `属性 ${prop.getAttribute('itemprop')} 缺少值`;}return null;}getPropertyValue(prop) {if (prop.hasAttribute('content')) {return prop.getAttribute('content');}return prop.textContent.trim();}
}

SEO 优化助手

class SEOStructuredDataHelper {constructor() {this.validator = new StructuredDataValidator();}generateJsonLD(element) {const data = this.parseStructuredData(element);return {'@context': 'https://schema.org',...data};}parseStructuredData(element) {const result = {};const type = element.getAttribute('itemtype');if (type) {result['@type'] = type.split('/').pop();}const properties = element.querySelectorAll('[itemprop]');properties.forEach(prop => {const name = prop.getAttribute('itemprop');const value = this.getPropertyValue(prop);if (prop.hasAttribute('itemscope')) {result[name] = this.parseStructuredData(prop);} else {result[name] = value;}});return result;}injectJsonLD(data) {const script = document.createElement('script');script.type = 'application/ld+json';script.textContent = JSON.stringify(data, null, 2);document.head.appendChild(script);}generateSitemap(data) {return `<?xml version="1.0" encoding="UTF-8"?><urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">${this.generateSitemapUrls(data)}</urlset>`;}generateSitemapUrls(data, baseUrl = '') {let urls = '';if (data['@type'] === 'WebPage') {urls += `<url><loc>${baseUrl}${data.url}</loc><lastmod>${data.dateModified || new Date().toISOString()}</lastmod><changefreq>weekly</changefreq><priority>0.8</priority></url>`;}return urls;}
}

实践项目:企业信息结构化 🏢

完整示例

<!DOCTYPE html>
<html lang="zh">
<head><meta charset="UTF-8"><title>企业信息 - 科技创新有限公司</title><script type="application/ld+json">{"@context": "https://schema.org","@type": "Organization","name": "科技创新有限公司","url": "https://example.com","logo": "https://example.com/logo.png","sameAs": ["https://www.facebook.com/company","https://twitter.com/company","https://linkedin.com/company"],"address": {"@type": "PostalAddress","streetAddress": "创新路88号","addressLocality": "深圳市","addressRegion": "广东省","postalCode": "518000","addressCountry": "CN"},"contactPoint": {"@type": "ContactPoint","contactType": "customer service","telephone": "+86-400-888-8888","email": "support@example.com","availableLanguage": ["zh-CN", "en"]},"department": [{"@type": "Organization","name": "研发部","employee": {"@type": "Person","name": "张三","jobTitle": "研发总监"}},{"@type": "Organization","name": "市场部","employee": {"@type": "Person","name": "李四","jobTitle": "市场总监"}}]}</script>
</head>
<body itemscope itemtype="https://schema.org/Organization"><header><h1 itemprop="name">科技创新有限公司</h1><img itemprop="logo" src="logo.png" alt="公司标志"></header><main><section id="about"><h2>关于我们</h2><p itemprop="description">科技创新有限公司成立于2010年,致力于人工智能技术研发与应用。</p></section><section id="contact"><h2>联系方式</h2><div itemprop="address" itemscope itemtype="https://schema.org/PostalAddress"><p>地址:<span itemprop="addressLocality">深圳市</span><span itemprop="addressRegion">广东省</span><span itemprop="streetAddress">创新路88号</span></p></div><div itemprop="contactPoint" itemscope itemtype="https://schema.org/ContactPoint"><p>电话:<span itemprop="telephone">400-888-8888</span><br>邮箱:<span itemprop="email">support@example.com</span></p></div></section><section id="departments"><h2>部门信息</h2><div itemprop="department" itemscope itemtype="https://schema.org/Organization"><h3 itemprop="name">研发部</h3><div itemprop="employee" itemscope itemtype="https://schema.org/Person"><p>负责人:<span itemprop="name">张三</span><span itemprop="jobTitle">研发总监</span></p></div></div></section></main>
</body>
</html>

最佳实践建议 💡

  1. SEO 优化

    • 使用正确的 Schema.org 类型
    • 提供完整的属性信息
    • 验证结构化数据
    • 定期更新内容
  2. 数据管理

    • 保持数据一致性
    • 实现自动化验证
    • 维护数据更新机制
    • 监控数据质量
  3. 开发建议

    • 使用验证工具
    • 保持代码可维护性
    • 实现渐进增强
    • 注意性能影响

写在最后 🌟

结构化数据不仅能提升网站的 SEO 表现,还能为用户提供更好的搜索体验。通过合理使用微数据,我们可以让网站内容更容易被理解和发现。

进一步学习资源 📚

  • Schema.org 文档
  • Google 结构化数据测试工具
  • JSON-LD 最佳实践
  • SEO 优化指南

如果你觉得这篇文章有帮助,欢迎点赞收藏,也期待在评论区看到你的想法和建议!👇

终身学习,共同成长。

咱们下一期见

💻

相关文章:

HTML5系列(13)-- 微数据与结构化数据指南

前端技术探索系列&#xff1a;HTML5 微数据与结构化数据指南 &#x1f4ca; 致读者&#xff1a;探索数据语义化的世界 &#x1f44b; 前端开发者们&#xff0c; 今天我们将深入探讨 HTML5 微数据与结构化数据&#xff0c;学习如何让网页内容更易被搜索引擎理解和解析。 微数…...

MAA ADB问题

模拟器官方MUMU12 连接设置 | MaaAssistantArknights 参考文档&#xff0c;找谷歌platform ADB&#xff0c;放入MAA文件夹 选择谷歌ADB&#xff0c;选择MUMU12的ADB代码 MuMu 模拟器 12 127.0.0.1:16384 重新连接 ok...

基于VTX356语音识别合成芯片的智能语音交互闹钟方案

一、方案概述 本方案旨在利用VTX356语音识别合成芯片强大的语音处理能力&#xff0c;结合蓝牙功能、APP或小程序&#xff0c;打造一款功能全面且智能化程度高的闹钟产品。除了基本的时钟显示和闹钟提醒功能外&#xff0c;还拥有正计时、倒计时、日程安排、重要日提醒以及番茄钟…...

大语言模型应用开发框架LangChain

大语言模型应用开发框架LangChain 一、LangChain项目介绍1、简介2、LangChain的价值3、实战演练 二、LangChain提示词大语言模型应用1、简介1.1、提示词模板化的优点1.2、提示词模板LLM 的应用1.3、Prompt 2、应用实战2.1、PromptTemplate LLM2.2、PromptTemplate LLM Outpu…...

php7.4安装pg扩展-contos7

今天接到一个需求&#xff0c;就是需要用thinkphp6链接pg(postgresql)数据库。废话不多说&#xff0c;直接上操作步骤 一、安装依赖 yum install -y sqlite-devel libxml2 libxml2-devel openssl openssl-devel bzip2 bzip2-devel libcurl libcurl-devel libjpeg libjpeg-dev…...

【开源】A064—基于JAVA的民族婚纱预定系统的设计与实现

&#x1f64a;作者简介&#xff1a;在校研究生&#xff0c;拥有计算机专业的研究生开发团队&#xff0c;分享技术代码帮助学生学习&#xff0c;独立完成自己的网站项目。 代码可以查看项目链接获取⬇️&#xff0c;记得注明来意哦~&#x1f339; 赠送计算机毕业设计600个选题ex…...

网络安全防护指南:筑牢网络安全防线(5/10)

一、网络安全的基本概念 &#xff08;一&#xff09;网络的定义 网络是指由计算机或者其他信息终端及相关设备组成的按照一定的规则和程序对信息收集、存储、传输、交换、处理的系统。在当今数字化时代&#xff0c;网络已经成为人们生活和工作中不可或缺的一部分。它连接了世…...

集合框架(2)List

Collection的子接口&#xff1a;List、Set 1、List接口 鉴于Java中数组用来存储数据的局限性&#xff0c;我们通常使用java.util.List替代数组List集合类中元素有序、且可重复&#xff0c;集合中的每个元素都有其对应的顺序索引。JDK API中List接口的实现类常用的有&#xff…...

12.5作业

1.完成指针的练习 1.已知数组a[10]和b[10]中元素的值递增有序&#xff0c;用指针实现将两个数组中的元素按递增的顺序输出。 ex: int arr[5]{1,3,5,7,9}; int arr1[5]{2,4,6,8,10}; 程序结束后输出1&#xff0c;2&#xff0c;3&#xff0c;4&#xff0c;5&#xff0c;6&am…...

61 基于单片机的小车雷达避障及阈值可调

所有仿真详情导航&#xff1a; PROTEUS专栏说明-CSDN博客 目录 一、主要功能 二、硬件资源 三、主程序编程 四、资源下载 一、主要功能 基于51单片机&#xff0c;采用超声波传感器检测距离&#xff0c;通过LCD1602显示屏显示&#xff0c;三个按键&#xff0c;第一个按键是…...

116. UE5 GAS RPG 实现击杀掉落战利品功能

这一篇&#xff0c;我们实现敌人被击败后&#xff0c;掉落战利品的功能。首先&#xff0c;我们将创建一个新的结构体&#xff0c;用于定义掉落体的内容&#xff0c;方便我们设置掉落物。然后&#xff0c;我们实现敌人死亡时的掉落函数&#xff0c;并在蓝图里实现对应的逻辑&…...

原子类相关

原子引用 JUC 并发包提供了&#xff1a; AtomicReferenceAtomicMarkableReferenceAtomicStampedReference AtomicReference 使用举例 public interface DecimalAccount {// 获取余额BigDecimal getBalance();// 取款void withdraw(BigDecimal amount);/*** 方法内会启动 10…...

DeCoOp: Robust Prompt Tuning with Out-of-Distribution Detection

文章汇总 me&#xff1a;看得很迷糊 新型检测器 M D \mathcal M_D MD​的训练是为了对一个子基类去划分子基类中的base和new。 在获得每个子基类之后&#xff0c;为每个检测器训练子分类器 M C \mathcal M_C MC​ 在推理时&#xff0c;如果最高得分的检测器 M D i ( x ) \ma…...

Tinker热修复框架详解:Android应用补丁生成,提升应用稳定性

Tinker 是腾讯开源的Android热修复框架&#xff0c;通过动态更新和修复应用中的代码、资源和本地库文件&#xff0c;无需用户重新安装 APK&#xff0c;便可以及时修复应用中的 bug&#xff0c;优化用户体验。 下面是Tinker在Android项目中的详细用法&#xff0c;结合Kotlin 代…...

手写—— netty 实现 rabbitMq客户端

要使用 Netty 实现一个 RabbitMQ 客户端&#xff0c;你可以将 RabbitMQ 协议封装在 Netty 中&#xff0c;通过自定义编码和解码来实现与 RabbitMQ 的通信。RabbitMQ 使用 AMQP (Advanced Message Queuing Protocol) 协议&#xff0c;因此我们需要创建合适的协议封装和处理逻辑。…...

调用高德地图天气查询api

之前使用的api一直用不了&#xff0c;才发现web端类型的没有天气查询功能 web服务才有 然后在linux的环境变量中配置一下 发现linux中配的环境变量不行&#xff0c;于是给输入amap_weather给的字典明文token。 # 选用RolePlay 配置agent from modelscope_agent.agents.role_p…...

【Vulkan入门】03-创建Device

目录 先叨叨git信息关键代码VulkanEnv::CreateDevice() 编译并运行程序题外话 先叨叨 在上篇已经选择了一个合适的PhysicalDevice。 本篇要为这个PhysicalDevice创将一个Device。Device可以理解为APP与PhysicalDevice之间的代理。 所有APP与PhysicalDevice之间交互的资源都通过…...

【Axios】如何在Vue中使用Axios请求拦截器

✨✨ 欢迎大家来到景天科技苑✨✨ &#x1f388;&#x1f388; 养成好习惯&#xff0c;先赞后看哦~&#x1f388;&#x1f388; &#x1f3c6; 作者简介&#xff1a;景天科技苑 &#x1f3c6;《头衔》&#xff1a;大厂架构师&#xff0c;华为云开发者社区专家博主&#xff0c;…...

query did not return a unique result: 2;

文章目录 错误原因分析关键位置可能原因解决方法1. 检查数据库数据2. 修改查询方法3. 限定查询返回唯一结果4. 检查业务逻辑 总结 1、LoginLogRepository2、LoginLogService3、LoginLogApiService4、MyAuthenticationSuccessHandler 微信小程序开发者工具控制台报错 {"tim…...

PHP升级

PHP升级CentOs8 wget http://rpms.famillecollet.com/enterprise/remi-release-8.rpm rpm -ivh remi-release-8.rpm --nodeps --force rpm -qa | grep remi dnf module list php dnf module enable php:remi-7.4首先&#xff0c;重置当前的 PHP 模块&#xff0c;以便清理所有已…...

C++设计模式(原型、代理、适配器、组合)

一、原型模式 1.定义 用原型实例指定创建对象的种类&#xff0c;并且通过拷贝这些原型创建新的对象。 原型模式允许通过复制现有的对象来创建新对象&#xff0c;而不是通过实例化类来创建。这种方式可以避免创建重复的对象&#xff0c;从而提高性能和降低内存消耗。 2.组成 …...

超详细搭建PhpStorm+PhpStudy开发环境

刚开始接触PHP开发&#xff0c;搭建开发环境是第一步&#xff0c;网上下载PhpStorm和PhpStudy软件&#xff0c;怎样安装和激活就不详细说了&#xff0c;我们重点来看一看怎样搭配这两个开发环境。 前提&#xff1a;现在假设你已经安装完PhpStorm和PhpStudy软件。 我的PhpStor…...

Axure RP在智慧农场可视化大屏系统设计中的应用

随着科技的飞速发展&#xff0c;智慧农业已成为现代农业的重要发展方向。智慧农场可视化大屏系统作为智慧农业的重要组成部分&#xff0c;正逐步成为农场管理、决策和展示的核心工具。Axure RP&#xff0c;作为一款强大的原型设计工具&#xff0c;其在智慧农场可视化大屏系统的…...

《嵌入式硬件设计》

一、引言 嵌入式系统在现代科技中占据着至关重要的地位&#xff0c;广泛应用于消费电子、工业控制、汽车电子、医疗设备等众多领域。嵌入式硬件设计作为嵌入式系统开发的基础&#xff0c;直接决定了系统的性能、可靠性和成本。本文将深入探讨嵌入式硬件设计的各个方面&#xff…...

【C语言篇】C 语言总复习(上):点亮编程思维,穿越代码的浩瀚星河

我的个人主页 我的专栏&#xff1a;C语言&#xff0c;希望能帮助到大家&#xff01;&#xff01;&#xff01;点赞❤ 收藏❤ 在计算机科学的广袤宇宙中&#xff0c;C语言犹如一颗璀璨的恒星&#xff0c;散发着持久而耀眼的光芒。它作为一种基础且强大的编程语言&#xff0c;承载…...

多线程——04

本节目标 1. wait 和 notify 方法 2. 代码案例 1. wait 和 notify 方法 1. 方法使用 多个线程的执行顺序本身是随机的&#xff08;抢占式执行&#xff09; wait —— 让指定线程进入阻塞状态 notify —— 唤醒对应的阻塞状态的线程 注意&#xff1a; wait, notify, notifyAl…...

使用ECS和OSS搭建个人网盘

在linux服务器 一、下载cloudreve安装包。 执行如下命令&#xff0c;下载cloudreve安装包。 wget https://labfileapp.oss-cn-hangzhou.aliyuncs.com/cloudreve_3.3.1_linux_amd64.tar.gz 下载完毕后&#xff0c;执行如下命令&#xff0c;解压cloudreve安装包。 tar -zxvf c…...

Android 单元测试断言校验方法 org.junit.Assert

判断布尔值 assertTrue assertFalse 判断对象非空 assertNull(object); 案例&#xff1a; PersistableBundle result Util.getCarrierConfig(mockContext, subId);assertNull(result); 判断是否相等 assertEquals("mocked_string", result.toString()); package or…...

SpringSecurity学习

介绍 SpringSecurity是一个作用于身份认证和权限控制的框架&#xff0c;其针对的主要就是网站的安全问题 页面代码 要使用SpringSecurity的前提是有一个可以正常访问业务逻辑的代码&#xff0c;再使用SpringSecurity实现权限控制和身份验证。 后端代码 package com.learn.…...

Eureka和Zookeeper、Nacos的区别

目录 一、Eureka与Zookeeper的区别 适用场景&#xff1a; 架构设计&#xff1a; 功能特性&#xff1a; 社区生态&#xff1a; 二、Eureka与Nacos的区别 接口方式&#xff1a; 实例类型&#xff1a; 健康检测&#xff1a; 服务发现&#xff1a; 一致性与可用性&#…...

基于gitlab API刷新MR的commit的指定status

场景介绍 自己部署的gitlab Jenkins,并已经设置好联动(如何设置可以在网上很容易搜到)每个MergeRequest都可以触发多个Jenkins pipeline&#xff0c;pipeline结束后会将状态更新到gitlab这个MR上希望可以跳过pipeline运行&#xff0c;直接将指定的MR的指定pipeline状态刷新为…...

SpringBoot | 拦截器 | 统一数据返回格式 | 统一异常处理 | 适配器模式

拦截器 拦截器是Spring框架提供的核心功能之一, 主要用来拦截用户的请求, 在指定方法前后, 根据业务需要执行预先设定的代码. 也就是说, 允许开发人员提前预定义一些逻辑, 在用户的请求响应前后执行. 也可以在用户请求前阻止其执行. 在拦截器当中&#xff0c;开发人员可以在…...

Oracle清除水位

– 清除水位 ALTER TABLE 数据库名.表名 ENABLE ROW MOVEMENT; ALTER TABLE 数据库名.表名 SHRINK SPACE CASCADE; ALTER TABLE 数据库名.表名 DISABLE ROW MOVEMENT; – 回收统计信息 BEGIN DBMS_STATS.GATHER_TABLE_STATS(OWNNAME > ‘数据库名’, TABNAME > ‘表名’…...

软件工程——期末复习(2)

Part1&#xff1a;软件工程基本概念 软件程序文档数据 在软件工程中&#xff0c;软件通常被定为程序、文档和数据的集合。程序是按事先设计的功能和性能要求编写的指令序列&#xff1b;程序是完成指定功能的一段特定语言代码。文档是描述程序操作和使用的文档&#xff0c;是与…...

RAID1技术是什么?它的发展和工作原理如何?

RIAD1是一种先进的数据存储与冗余技术&#xff0c;设计用于解决现代分布式系统中常见的数据安全、数据一致性和高可用性等问题。随着云计算和大规模分布式存储系统的兴起&#xff0c;如何保障数据在高效传输与存储过程中仍然能具备足够的安全性和可靠性&#xff0c;成为了各大企…...

【Apache Paimon】-- 8 -- flink 创建 paimon connecor 的两种方式

目录 1、使用 catalog 创建非临时表 2、使用 with 创建 temporary 表 3、对比 4、参考 1、使用 catalog 创建非临时表 CREATE CATALOG my_catalog WITH (type = paimon,warehouse = hdfs:///path/to/warehouse );USE CATALOG my_catalog; CREATE TABLE `<your-paimon-…...

js进阶-关于运算符++

一、运算符与表达式 运算符按参与的运算单元数量分为&#xff1a;一元运算符、二元运算符和三元运算符&#xff1b;表达式是运算单元和运算符一起构成的&#xff1b;每个表达式都有一个运算后的返回值。 二、关于运算符 1.概述 运算符分为两部分&#xff0c;第一部分是返回运…...

三维地图,智慧城市,商业智能BI,数据可视化大屏(Cesiumjs/UE)

绘图工具 三维地图&#xff1a;Cesiumjs 建模方式&#xff1a;激光点云建模、航拍倾斜摄影建模、GIS建模、BIM建模、手工建模 建模工具&#xff1a;C4D Blender GeoBuilding ArcGIS Cesiumjs <!DOCTYPE html> <html lang"en"> <head><meta …...

通过EPEL 仓库,在 CentOS 7 上安装 OpenResty

通过EPEL 仓库&#xff0c;在 CentOS 7 上安装 OpenResty 通过EPEL 仓库&#xff0c;在 CentOS 7 上安装 OpenResty步骤 1: 安装 EPEL 仓库步骤 2: 安装 OpenResty步骤 3: 启动 OpenResty步骤 4: 设置开机自启步骤 5: 验证安装说明 通过EPEL 仓库&#xff0c;在 CentOS 7 上安装…...

每日一题 LCR 054. 把二叉搜索树转换为累加树

LCR 054. 把二叉搜索树转换为累加树 使用后序遍历即可 class Solution { public:TreeNode* convertBST(TreeNode* root) {int temp 0;dfs(root,temp);return root;}void dfs(TreeNode* root,int &temp){if(!root){return ;}dfs(root->right,temp);temp root->val;…...

【贪心算法】贪心算法五

贪心算法五 1.跳跃游戏 II2.跳跃游戏3.加油站3.单调递增的数字 点赞&#x1f44d;&#x1f44d;收藏&#x1f31f;&#x1f31f;关注&#x1f496;&#x1f496; 你的支持是对我最大的鼓励&#xff0c;我们一起努力吧!&#x1f603;&#x1f603; 1.跳跃游戏 II 题目链接&…...

vue2播放视频和预览文件的组件以及使用方法

##文件预览组件 按照组件 解决展示pdf的问题 npm install pdfh5 npm install canvas2.8.0 --ignore-scripts npm install --save dommatrix npm install --save web-streams-polyfill解决excel和docx预览的问题 npm install vue-office/docx vue-demi0.14.6 npm inst…...

记录一下,解决js内存溢出npm ERR! code ELIFECYCLEnpm ERR! errno 134 以及 errno 9009

项目是个老项目&#xff0c;依赖包也比较大&#xff0c;咱就按正常流程走一遍来详细解决这个问题&#xff0c;先看一下node版本&#xff0c;我用的是nvm管理的&#xff0c;详细可以看我的其他文章 友情提醒&#xff1a;如果项目比较老&#xff0c;包又大&#xff0c;又有一些需…...

【批处理脚本】更改Windows系统中的 hosts 解析文件

概述 作用 修改 Windows 系统中的 hosts 文件&#xff0c;可以实现 插入 或 删除 条目。该脚本允许用户以管理员权限执行&#xff0c;将特定的域名解析到指定的 IP 地址 应用场景 非常适用于需要频繁或批量修改 hosts 文件的场景&#xff1a; 屏蔽网站、域名重定向、DNS 污染防…...

AIGC 与艺术创作:变革与机遇

在当今数字化时代&#xff0c;人工智能生成内容&#xff08;AIGC&#xff09;正以惊人的速度重塑着艺术创作的格局&#xff0c;为艺术家们带来了令人振奋的新机遇。 一.AIGC 的崛起与艺术领域的变革 随着人工智能技术的不断进步&#xff0c;AIGC 逐渐在艺术领域崭露头角。它依…...

String IP和Int IP的互相转换

android中&#xff0c;wifiManager.connectionInfo.ipAddress 可以获取到wifi的ip地址&#xff0c;但这是一个int值&#xff0c;如何转换为常见的如192.168.1.129这种形式&#xff0c;以及这种形式如何转换回int值的形式。 这里ip分为4段&#xff0c;每一段的值都是0 ~ 255&am…...

【大数据学习 | 面经】yarn的资源申请和分配的单位-Container

在yarn中&#xff0c;资源的申请和分配是以container为单位进行的&#xff0c;而不是直接以application和task为单位。 每个提交到yarn上的应用程序&#xff08;application&#xff09;都有一个对应的ApplicationMaster&#xff08;AM&#xff09;。这个AM负责与ResourceMana…...

php基础:文件处理2

1.文件属性 当我们在程序中操作文件时&#xff0c;可能会使用到文件的一些常见属性&#xff0c;比如文件的大小、类型、修改时间、访问时间以及权限等等。PHP 中提供了非常全面的用来获取这些属性的内置函数&#xff0c;如下表所示。 2.目录操作 新建目录&#xff1a;mkdir(路…...

gradle下载慢解决方案2024 /12 /1android studio (Windows环境)

gradle下载慢解决方案2024 /12 /1 默认环境配置好了,环境配置和程序安装请出门右转 打开软件,点击右上角设置,找到如下设置页 选择本地安装并制定好你已经安装好的 gradle 应用保存即可 全局插件环境配置(新版本可以直接在设置中添加了) 找对应位置添加国内源并把前面的内置源…...

使用Java将PDF文件解析成Excel文件

安装pom依赖 <!-- 解析pdf--><dependency><groupId>org.apache.pdfbox</groupId><artifactId>pdfbox</artifactId><version>2.0.27</version> <!-- 请检查并使用最新版本 --></dependency>测试读取pdf文件…...