2301_79516858-优快云博客

原创前端智能化场景解决方案UI库，轻松构建你的AI应用，如何进行模型的对接

华为MateChat组件是为AI生成内容（AIGC）场景设计的UI库。MateChat，作为华为专为AIGC场景精心打造的UI库，旨在助力开发者高效构建AI对话应用。实际上，它不仅支撑了华为内部多个应用的对话需求，还融入了CodeArts、InsCode AI IDE等智能化助手的构建之中。MateChat 是由华为 DevUI 团队开发的一款开源前端 AI 组件库，旨在帮助开发者快速构建智能对话应用。

2025-12-11 16:11:44 861

原创 MateChat - 免费开源、开箱即用，华为出品的 AI 交互对话组件，轻松搭建自己的 AI Chat 应用，如何通过Cli快速创建应用

华为MateChat是一款专为AIGC场景设计的开源UI组件库，由华为DevUI团队开发。它提供即插即用的对话组件（如消息气泡、输入框等），支持React/Vue框架集成，可灵活适配OpenAI、Gemini等AI模型。该库具备高扩展性，允许自定义消息格式和主题样式，已在华为内部多个产品（如CodeArts、InsCode AI IDE）中应用。通过简洁的CLI命令可快速创建项目，支持多轮对话、深度思考功能，并提供响应式设计和主题定制能力（含深色/浅色模式及自定义配色）。开发者可轻松构建智能对话应用，降低A

2025-12-11 15:53:39 694

原创前端智能化场景解决方案UI库，轻松构建你的AI应用，如何进行Vue项目快速安装环境

华为MateChat是一款专为AI生成内容（AIGC）场景设计的开源UI组件库，由华为DevUI团队开发。它提供完整的对话式交互组件，如消息气泡、输入框等，支持快速集成到React、Vue等主流框架中。具有轻量化、高扩展性特点，可自定义消息格式和主题样式，兼容OpenAI、Gemini等主流AI模型。该组件已应用于华为内部多个产品，如CodeArts、InsCode AI IDE等，帮助开发者高效构建智能对话应用。通过简单的安装配置即可实现与大模型服务的对接，降低开发门槛，助力应用智能化升级。

2025-12-11 15:20:42 1038

原创 javascript基础从小白到高手系列六百二十八：Fetch API

Fetch API 是WHATWG 的一个“活标准”（living standard），用规范原文说，就是“Fetch 标准定义请求、Fetch API 能够执行XMLHttpRequest 对象的所有任务，但更容易使用，接口也更现代化，能够在。Fetch API 本身是使用JavaScript 请求资源的优秀工具，同时这个API 也能够应用在服务线程。fetch()方法是暴露在全局作用域中的，包括主页面执行线程、模块和工作线程。响应，以及绑定二者的流程：获取（fetch）”。

2025-12-08 20:34:04 230

原创 javascript基础从小白到高手系列六百二十七：替代性跨源技术

JSONP 是“JSON with padding”的简写，是在Web 服务上流行的一种JSON 变体。这个例子创建了一个新的Image 实例，然后为它的onload 和onerror 事件处理程序添加了同一。这个JSONP 请求的URL 是一个地理位置服务。CORS 出现之前，实现跨源Ajax 通信是有点麻烦的。数据通过查询字符串发送，响应可以随意设置，不过一般是位图图片或值为204 的状态码。函数的名称是通过请求来动态指定的。当然，图片探测的缺点是只能发。标签实现跨域通信的最早的一种技术。

2025-12-08 20:33:17 268

原创 javascript基础从小白到高手系列六百二十六：跨源资源共享

注意，服务器也可以在预检请求的。如果服务器决定响应请求，那么应该发送Access-Control-Allow-Origin 头部，包含相同的源；在这个请求发送后，服务器可以确定是否允许这种类型的请求。 Access-Control-Request-Headers：（可选）要使用的逗号分隔的自定义头部列表。对于简单的请求，比如GET 或POST 请求，没有自定义头部，而且请求体是text/plain 类型， Access-Control-Allow-Headers：服务器允许的头部（逗号分隔的列表）。

2025-12-08 20:31:49 323

原创 javascript基础从小白到高手系列六百二十五：进度事件

每次请求都会首先触发loadstart 事件，之后是一个或多个progress 事件，接着是error、abort。每次触发时，onprogress 事件处理程序都会收到event 对象，其target 属性是XHR 对象，且。onload 事件处理程序会收到一个event 对象，其target 属性设置为XHR 实例，在这个实例上。Mozilla 在XHR 对象上另一个创新是progress 事件，在浏览器接收数据期间，这个事件会反复触。只要是从服务器收到响应，无论状态码是什么，都会触发load 事件。

2025-12-08 20:31:10 334

原创 javascript基础从小白到高手系列六百二十四：读取响应状态信息

克隆Response 对象的主要方式是使用clone()方法，这个方法会创建一个一模一样的副本，不。如果响应对象的bodyUsed 属性为true（即响应体已被读取），则不能再创建这个对象的副本。此外，通过创建带有原始响应体的Response 实例，可以执行伪克隆操作。对于重定向响应，这是最终的URL，非重定向响应就是它产生的。\Response 对象包含一组只读属性，描述了请求完成后的状态，如下表所示。 error：表示响应对象是通过Response.error()创建的。可能是下列字符串值之一。

2025-12-08 20:30:34 313

原创 javascript基础从小白到高手系列六百二十三：克隆Request 对象

Fetch API 提供了两种不太一样的方式用于创建Request 对象的副本：使用Request 构造函数和使。关键在于，通过fetch 使用Request 会将请求体标记为已使用。要想基于包含请求体的相同Request 对象多次调用fetch()，必须在第一次发送fetch()请求前。第二种克隆Request 对象的方式是使用clone()方法，这个方法会创建一模一样的副本，任何值。如果请求对象的bodyUsed 属性为true（即请求体已被读取），那么上述任何一种方式都不能用来。创建这个对象的副本。

2025-12-08 20:29:59 215

原创 javascript基础从小白到高手系列六百二十二：Headers 独有的特性

response 在通过构造函数初始化Response 对象时激活不允许修改禁止修改的响应头部（参见MDN 文。Headers 实例中还不存在的头部上调用append()方法相当于调用set()。在初始化Headers 对象时，也可以使用键/值对形式的对象，Headers 实例会因来源不同而展现不同的行为，它们的行为由护卫来控制。不同的护卫设置会改变set()、append()和delete()的行为。一个HTTP 头部字段可以有多个值，而Headers 对象通过append()方法支持添加多个值。

2025-12-08 20:29:34 264

原创 javascript基础从小白到高手系列六百二十一：中断请求

Headers 与Map 类型都有get()、set()、has()和delete()Headers 实例，可以通过Request.prototype.headers 访问，每个入站Response 实例也可以通过。Response.prototype.headers 访问包含着响应头部的Headers 对象。这是合理的，因为HTTP 头部本质上是序列化后的键/值对，Headers 对象是所有外发请求和入站响应头部的容器。另外，使用new Headers()也可以创建一个新实例。// 确定值已经删除。

2025-12-08 20:26:36 302

原创 javascript基础从小白到高手系列六百二十：常见Fetch 请求模式

与XMLHttpRequest 一样，fetch()既可以发送数据也可以接收数据。使用init 对象参数，可。以配置fetch()在请求体中发送各种序列化的数据。

2025-12-08 20:26:06 382

原创 javascript基础从小白到高手系列六百一十九：Fetch API

Fetch API 是WHATWG 的一个“活标准”（living standard），用规范原文说，就是“Fetch 标准定义请求、Fetch API 能够执行XMLHttpRequest 对象的所有任务，但更容易使用，接口也更现代化，能够在。Fetch API 本身是使用JavaScript 请求资源的优秀工具，同时这个API 也能够应用在服务线程。fetch()方法是暴露在全局作用域中的，包括主页面执行线程、模块和工作线程。响应，以及绑定二者的流程：获取（fetch）”。

2025-12-08 20:24:02 293

原创 javascript基础从小白到高手系列六百一十八：替代性跨源技术

JSONP 是“JSON with padding”的简写，是在Web 服务上流行的一种JSON 变体。这个例子创建了一个新的Image 实例，然后为它的onload 和onerror 事件处理程序添加了同一。这个JSONP 请求的URL 是一个地理位置服务。CORS 出现之前，实现跨源Ajax 通信是有点麻烦的。数据通过查询字符串发送，响应可以随意设置，不过一般是位图图片或值为204 的状态码。函数的名称是通过请求来动态指定的。当然，图片探测的缺点是只能发。标签实现跨域通信的最早的一种技术。

2025-12-04 17:59:38 294

原创 javascript基础从小白到高手系列六百一十七：Request、Response 及Body 混入

Request 和Response 都使用了Fetch API 的Body 混入，以实现两者承担有效载荷的能力。可能会导致网络延迟，另一个原因是流API 本身在处理有效载荷方面是有优势的。Body 混入提供了5 个方法，用于将ReadableStream 转存到缓冲区的内存里，将缓冲区转换为某。示body 流是否已读）和一组方法，用于从流中读取内容并将结果转换为某种JavaScript 对象类型。通常，将Request 和Response 主体作为流来使用主要有两个原因。一个原因是有效载荷的大小。

2025-12-04 17:59:02 360

原创 javascript基础从小白到高手系列六百一十六：读取响应状态信息

克隆Response 对象的主要方式是使用clone()方法，这个方法会创建一个一模一样的副本，不。如果响应对象的bodyUsed 属性为true（即响应体已被读取），则不能再创建这个对象的副本。此外，通过创建带有原始响应体的Response 实例，可以执行伪克隆操作。对于重定向响应，这是最终的URL，非重定向响应就是它产生的。Response 对象包含一组只读属性，描述了请求完成后的状态，如下表所示。 error：表示响应对象是通过Response.error()创建的。可能是下列字符串值之一。

2025-12-04 17:58:22 369

原创 javascript基础从小白到高手系列六百一十五：Response 对象

Response 类还有两个用于生成Response 对象的静态方法：Response.redirect()和Response.Response 对象的期约，这个Response 对象代表实际的HTTP 响应。另一个静态方法Response.error()用于产生表示网络错误的Response 对象（网络错误会导致。还可以接收一个可选的init 对象，这个对象可以包含下表所列的键和值。大多数情况下，产生Response 对象的主要方式是调用fetch()，它返回一个最后会解决为。用响应体的不同方式。

2025-12-04 17:56:45 312

原创 javascript基础从小白到高手系列六百一十四：克隆Request 对象

Fetch API 提供了两种不太一样的方式用于创建Request 对象的副本：使用Request 构造函数和使。关键在于，通过fetch 使用Request 会将请求体标记为已使用。要想基于包含请求体的相同Request 对象多次调用fetch()，必须在第一次发送fetch()请求前。第二种克隆Request 对象的方式是使用clone()方法，这个方法会创建一模一样的副本，任何值。如果请求对象的bodyUsed 属性为true（即请求体已被读取），那么上述任何一种方式都不能用来。创建这个对象的副本。

2025-12-04 17:54:16 406

原创 javascript基础从小白到高手系列六百一十三：Headers 独有的特性

response 在通过构造函数初始化Response 对象时激活不允许修改禁止修改的响应头部（参见MDN 文。Headers 实例中还不存在的头部上调用append()方法相当于调用set()。在初始化Headers 对象时，也可以使用键/值对形式的对象，Headers 实例会因来源不同而展现不同的行为，它们的行为由护卫来控制。不同的护卫设置会改变set()、append()和delete()的行为。一个HTTP 头部字段可以有多个值，而Headers 对象通过append()方法支持添加多个值。

2025-12-04 17:53:36 375

原创 javascript基础从小白到高手系列六百一十二：中断请求

Headers 与Map 类型都有get()、set()、has()和delete()Headers 实例，可以通过Request.prototype.headers 访问，每个入站Response 实例也可以通过。Response.prototype.headers 访问包含着响应头部的Headers 对象。这是合理的，因为HTTP 头部本质上是序列化后的键/值对，Headers 对象是所有外发请求和入站响应头部的容器。另外，使用new Headers()也可以创建一个新实例。// 确定值已经删除。

2025-12-04 17:52:57 264

原创 javascript基础从小白到高手系列六百一十一：常见Fetch 请求模式

与XMLHttpRequest 一样，fetch()既可以发送数据也可以接收数据。使用init 对象参数，可。以配置fetch()在请求体中发送各种序列化的数据。

2025-12-04 17:48:55 223

原创 javascript基础从小白到高手系列六百一十：Fetch API

Fetch API 是WHATWG 的一个“活标准”（living standard），用规范原文说，就是“Fetch 标准定义请求、Fetch API 能够执行XMLHttpRequest 对象的所有任务，但更容易使用，接口也更现代化，能够在。Fetch API 本身是使用JavaScript 请求资源的优秀工具，同时这个API 也能够应用在服务线程。fetch()方法是暴露在全局作用域中的，包括主页面执行线程、模块和工作线程。响应，以及绑定二者的流程：获取（fetch）”。

2025-12-04 17:48:30 238

原创 javascript基础从小白到高手系列六百零九：替代性跨源技术

JSONP 是“JSON with padding”的简写，是在Web 服务上流行的一种JSON 变体。这个例子创建了一个新的Image 实例，然后为它的onload 和onerror 事件处理程序添加了同一。这个JSONP 请求的URL 是一个地理位置服务。、CORS 出现之前，实现跨源Ajax 通信是有点麻烦的。数据通过查询字符串发送，响应可以随意设置，不过一般是位图图片或值为204 的状态码。函数的名称是通过请求来动态指定的。当然，图片探测的缺点是只能发。标签实现跨域通信的最早的一种技术。

2025-12-04 17:47:16 294

原创 javascript基础从小白到高手系列六百零八：JSON

制定了JavaScript 对象简谱（JSON，JavaScript Object Notation）标准，即RFC 4627。JSON 是JavaScript 的严格子集，利用JavaScript 中的几种模式来表示结构。JavaScript 字符串与JSON 字符串的主要区别是，JSON 字符串必须使用双引号（单引号会导致语法。与JavaScript 不同，JSON 中的对象属性名必须始终带双引号。虽然这对JavaScript 开发者来说是标准的对象字面量，但JSON 中的对象必须使用双引号把属性名。

2025-12-03 10:44:59 218

原创 javascript基础从小白到高手系列六百零七：XSLTProcessor 类型

setParameter()方法必须在调用transformToDocument()或transformToFragment()之前调用。如果想得到文档片段，则可以调用transformToFragment()。格式为"text"时调用transformToDocument()会返回完整的XML 文档，但这个文档的内容会因浏。与参数相关的还有两个方法：getParameter()和removeParameter()。如果XSLT 样式表的输出格式是"xml"或"html"，则创建文档或文档片段理所当然。

2025-12-03 10:44:05 342

原创 javascript基础从小白到高手系列六百零六：命名空间支持

在这个XML 文档中，所有元素的命名空间都属于http://www.wrox.com/，都以wrox 前缀标识。对于使用命名空间的XML 文档，必须告诉XPathEvaluator 命名空间信息，才能进行正确求值。个方法只接收一个参数，即包含命名空间定义的文档节点。与之相关的正式API，正式的DOM 中也没有涵盖它。在并不知晓文档的哪个节点包含命名空间定义时，可以采用这种定义命名空间解析函数的方式。果想使用XPath 查询该文档，就需要指定使用的命名空间，否则求值会失败。浏览器对XSLT 的支持。

2025-12-03 10:43:31 408

原创 javascript基础从小白到高手系列六百零五：单个节点结果

XPathResult.FIRST_ORDERED_NODE_TYPE 结果类型返回匹配的第一个节点，可以通过结果的。在这个例子中，如果有任何节点匹配"employee/name"，booleanValue 属性就等于true。对于数值类型，XPath 表达式必须使用返回数值的XPath 函数，如count()可以计算匹配给定模式。对于字符串类型，evaluate()方法查找匹配XPath 表达式的第一个节点，然后返回其第一个子节。要确定返回的结果类型，可以访问求值结果的resultType 属性，如。

2025-12-03 10:42:56 271

原创 javascript基础从小白到高手系列六百零四：浏览器对XPath 的支持

 XPathResult.UNORDERED_NODE_ITERATOR_TYPE：返回匹配节点的集合，但集合中节点的顺。 XPathResult.ORDERED_NODE_SNAPSHOT_TYPE：返回节点集合的快照，在文档外部捕获节点， XPathResult.ORDERED_NODE_ITERATOR_TYPE：返回匹配节点的集合，集合中节点的顺序与。 XPathResult.ANY_UNORDERED_NODE_TYPE：返回匹配节点的集合，但集合中节点的顺序可能。要确定浏览器是否支持。

2025-12-03 10:42:14 358

原创 javascript基础从小白到高手系列六百零三：DOMParser

xmldom 变量包含DOM Level 2 Document 类型的实例，包括第12 章介绍的所有DOM 方法和属性。自从有了DOM 标准，所。在JavaScript 中处理XML 时，root 参数通常只会使用一次，因为这个参数定义的是XML DOM。DOM 标准不仅是为了在浏览器中使用，而且还为了在桌面和服务器应用程序中处理XML 数据结构。实践中，很少需要凭空创建XML 文档，然后使用DOM 方法来系统创建XML 数据结构。这个例子创建了一个XML DOM文档，该文档没有默认的命名空间和文档类型。

2025-12-03 10:41:32 213

原创 javascript基础从小白到高手系列六百零二：处理XML

xmldom 变量包含DOM Level 2 Document 类型的实例，包括第12 章介绍的所有DOM 方法和属性。自从有了DOM 标准，所。在JavaScript 中处理XML 时，root 参数通常只会使用一次，因为这个参数定义的是XML DOM。DOM 标准不仅是为了在浏览器中使用，而且还为了在桌面和服务器应用程序中处理XML 数据结构。实践中，很少需要凭空创建XML 文档，然后使用DOM 方法来系统创建XML 数据结构。这个例子创建了一个XML DOM文档，该文档没有默认的命名空间和文档类型。

2025-12-03 10:18:12 229

原创 javascript基础从小白到高手系列六百零一：语法错误

如果网页中引用的一个外部JavaScript 文件由于某种原因返回了非JavaScript 代码，则IE 会抛出语。通常，当IE 报告语法错误时，原因是很清楚的。一般来说，可以通过错误消息追踪到少了一个分。不过，有一种情况下报告的语法错误并不清楚。

2025-12-03 10:17:20 346

原创 javascript基础从小白到高手系列六百：旧版IE 的常见错误

所谓无效字符，指的是JavaScript 语法中没有定义过的字符。IE 的event 对象是作为window 的一个属性存在的，会在事件。接下来几节分别讨论旧版IE 中可能会出现的常见且难于调试的JavaScript 错误。如前所述，旧版IE 中所有DOM对象都是用COM 对象实现的，并非原生JavaScript 对象。事件处理程序退出后，event 对象会被销毁，因此闭包中对它的引用也就不存在了，于是就会报告未找。在将块级元素插入不恰当的位置时，其他浏览器会尝试纠正，这样就不会发生错误，但IE 在这种。

2025-12-03 10:16:40 316

原创 javascript基础从小白到高手系列五百九十九：命名空间支持

在这个XML 文档中，所有元素的命名空间都属于http://www.wrox.com/，都以wrox 前缀标识。对于使用命名空间的XML 文档，必须告诉XPathEvaluator 命名空间信息，才能进行正确求值。个方法只接收一个参数，即包含命名空间定义的文档节点。与之相关的正式API，正式的DOM 中也没有涵盖它。在并不知晓文档的哪个节点包含命名空间定义时，可以采用这种定义命名空间解析函数的方式。果想使用XPath 查询该文档，就需要指定使用的命名空间，否则求值会失败。浏览器对XSLT 的支持。

2025-12-03 10:15:50 309

原创 javascript基础从小白到高手系列五百九十八：单个节点结果

XPathResult.FIRST_ORDERED_NODE_TYPE 结果类型返回匹配的第一个节点，可以通过结果的。在这个例子中，如果有任何节点匹配"employee/name"，booleanValue 属性就等于true。对于数值类型，XPath 表达式必须使用返回数值的XPath 函数，如count()可以计算匹配给定模式。对于字符串类型，evaluate()方法查找匹配XPath 表达式的第一个节点，然后返回其第一个子节。要确定返回的结果类型，可以访问求值结果的resultType 属性，如。

2025-12-02 17:18:05 378

原创 javascript基础从小白到高手系列五百九十七：浏览器对XPath 的支持

 XPathResult.UNORDERED_NODE_ITERATOR_TYPE：返回匹配节点的集合，但集合中节点的顺。 XPathResult.ORDERED_NODE_SNAPSHOT_TYPE：返回节点集合的快照，在文档外部捕获节点， XPathResult.ORDERED_NODE_ITERATOR_TYPE：返回匹配节点的集合，集合中节点的顺序与。 XPathResult.ANY_UNORDERED_NODE_TYPE：返回匹配节点的集合，但集合中节点的顺序可能。要确定浏览器是否支持。

2025-12-02 17:17:35 260

原创 javascript基础从小白到高手系列五百九十六：DOMParser 类型

Firefox 和Opera 此时会返回document 元素为的文档，而在Chrome 和Safari 返回的文。要使用DOMParser，需要先创建它的一个实例，然后再调用parseFromString()方法。档传给serializeToString()时，这个文档会被当成XML 文档，因此得到的结果是格式良好的。DOMParser 只能解析格式良好的XML，因此不能把HTML 解析为HTML文档。档中，是的第一个子元素。这个例子中解析的XML 字符串少一个标签，因此会导致解析错误。

2025-12-02 17:16:48 344

原创 javascript基础从小白到高手系列五百九十五：处理XML

xmldom 变量包含DOM Level 2 Document 类型的实例，包括第12 章介绍的所有DOM 方法和属性。自从有了DOM 标准，所。在JavaScript 中处理XML 时，root 参数通常只会使用一次，因为这个参数定义的是XML DOM。DOM 标准不仅是为了在浏览器中使用，而且还为了在桌面和服务器应用程序中处理XML 数据结构。实践中，很少需要凭空创建XML 文档，然后使用DOM 方法来系统创建XML 数据结构。这个例子创建了一个XML DOM文档，该文档没有默认的命名空间和文档类型。

2025-12-02 17:16:09 256

原创 javascript基础从小白到高手系列五百九十四：语法错误

如果网页中引用的一个外部JavaScript 文件由于某种原因返回了非JavaScript 代码，则IE 会抛出语。通常，当IE 报告语法错误时，原因是很清楚的。一般来说，可以通过错误消息追踪到少了一个分。不过，有一种情况下报告的语法错误并不清楚。

2025-12-02 17:15:36 279

原创 javascript基础从小白到高手系列五百九十三：旧版IE 的常见错误

所谓无效字符，指的是JavaScript 语法中没有定义过的字符。IE 的event 对象是作为window 的一个属性存在的，会在事件。接下来几节分别讨论旧版IE 中可能会出现的常见且难于调试的JavaScript 错误。如前所述，旧版IE 中所有DOM对象都是用COM 对象实现的，并非原生JavaScript 对象。事件处理程序退出后，event 对象会被销毁，因此闭包中对它的引用也就不存在了，于是就会报告未找。在将块级元素插入不恰当的位置时，其他浏览器会尝试纠正，这样就不会发生错误，但IE 在这种。

2025-12-02 17:15:05 401

原创 javascript基础从小白到高手系列五百九十二：补充控制台方法

好的错误消息包含关于错误原因的确切信息，因此可以减少额外调试的工作量。这个简单的函数执行两个数的除法，但如果任何一个参数不是数值，则返回NaN。相比于之前的例子，使用assert()函数可以减少抛出自定义错误所需的代码量，并且让代码更好。报告这个错误消息时，你立即就能根据它包含的信息定位到问题，包括问题的解决方案。这样，其他代码调用的将是这个函数，而不是通用的日志方法。的方法，这样无论在哪里用到的日志打印方法，都会按照自定义的方式行事。具体的浏览器错误消息，这个错误消息显示更有价值。

2025-12-02 17:14:35 313

空空如也

空空如也