MCP插件使用（browser-tools-mcp为例）

Ne0inhk

— 2 min read
MCP插件使用（browser-tools-mcp为例）

1. 环境配置（Brower Tools为例）

python 安装 nodejs 安装 mkdir C:\Users\Suoxd\Documents\Cline\MCP\browser-tools-mcp git clone https://github.com/AgentDeskAI/browser-tools-mcp.git "C:\Users\Suoxd\Documents\Cline\MCP\browser-tools-mcp"

2. MCP服务安装启动

cd C:\Users\Suoxd\Documents\Cline\MCP\browser-tools-mcp npminstall @agentdeskai/[email protected] npx @agentdeskai/[email protected] npx @agentdeskai/[email protected]

参考https://browsertools.agentdesk.ai/installation

在这里插入图片描述


在这里插入图片描述


在这里插入图片描述
在这里插入图片描述


在这里插入图片描述
在这里插入图片描述

3. 浏览器插件配置

https://github.com/AgentDeskAI/browser-tools-mcp/releases/download/v1.2.0/BrowserTools-1.2.0-extension.zip
在这里插入图片描述

4. Cline 服务配置

"browser-tools-mcp":{"command":"node","args":["d:/Suo/code/tmp-AI/browser-tools-mcp/browser-tools-mcp/dist/mcp-server.js"],"disabled":false,"autoApprove":[]}

5. 最终效果

浏览器端调试工具增加了插件页面

在这里插入图片描述


在这里插入图片描述
在这里插入图片描述

Read more

Flutter 三方库 gtin_toolkit 的鸿蒙化适配指南 - 实现全球标准商品条码（GTIN）的正向解析与合法性校检、支持端侧零售与物流供应链扫码实战

Flutter 三方库 gtin_toolkit 的鸿蒙化适配指南 - 实现全球标准商品条码（GTIN）的正向解析与合法性校检、支持端侧零售与物流供应链扫码实战

欢迎加入开源鸿蒙跨平台社区：https://openharmonycrossplatform.ZEEKLOG.net Flutter 三方库 gtin_toolkit 的鸿蒙化适配指南 - 实现全球标准商品条码（GTIN）的正向解析与合法性校检、支持端侧零售与物流供应链扫码实战 前言 在进行 Flutter for OpenHarmony 的新零售、仓储管理或跨境物流应用开发时，如何准确识别并验证全球通用的商品条码？GTIN（Global Trade Item Number）涵盖了 EAN-13, EAN-8, UPC-A, UPC-E 以及 ITF-14 等多种格式。gtin_toolkit 是一款专为 GTIN 协议处理设计的工具库。它不仅能解析条码，还能计算动态校检位（Check Digit）。本文将介绍如何在鸿蒙端构建极致的条码数据治理能力。 一、原直观解析 / 概念介绍 1.

By Ne0inhk
Flutter for OpenHarmony：web_socket 纯 Dart 标准 WebSocket 客户端（跨平台兼容性之王） 深度解析与鸿蒙

Flutter for OpenHarmony：web_socket 纯 Dart 标准 WebSocket 客户端（跨平台兼容性之王） 深度解析与鸿蒙

欢迎加入开源鸿蒙跨平台社区：https://openharmonycrossplatform.ZEEKLOG.net 前言 虽然 dart:io 提供了 WebSocket 类，dart:html 也提供了 WebSocket 类，但这种“分裂”的 API 设计让编写跨平台（同时支持 Mobile/Web/Desktop）的代码变得异常痛苦。你需要使用条件导入 (if (dart.library.io) ...) 来分别处理。 web_socket 库就是为了解决这个问题而诞生的。它提供了一个统一的、平台无关的WebSocket 接口。 无论你的代码运行在 Android、iOS、Web 还是 OpenHarmony 上，它都会自动选择最底层的实现（在鸿蒙上通常是 dart:io）

By Ne0inhk
Flutter 组件 sse_stream 的适配 鸿蒙Harmony 实战 - 驾驭高性能 Server-Sent Events 流、实现鸿蒙端实时数据推送与长连接保活优化方案

Flutter 组件 sse_stream 的适配 鸿蒙Harmony 实战 - 驾驭高性能 Server-Sent Events 流、实现鸿蒙端实时数据推送与长连接保活优化方案

欢迎加入开源鸿蒙跨平台社区：https://openharmonycrossplatform.ZEEKLOG.net Flutter 组件 sse_stream 的适配 鸿蒙Harmony 实战 - 驾驭高性能 Server-Sent Events 流、实现鸿蒙端实时数据推送与长连接保活优化方案 前言 在鸿蒙（OpenHarmony）生态的即时性应用场景中，如金融级实时行情、直播间弹幕以及 AI 模型的流式回复（Streaming Response），我们需要一种比轮询更高效、比 WebSocket 更轻量的数据下发机制。 SSE（Server-Sent Events）作为 HTML5 规范下的长连接利器，以其对 HTTP 协议的完美兼容和自动重连的天生特性，在现代移动开发中大放异彩。 sse_stream 库为 Flutter 提供了精简且强大的 SSE 接入能力。在鸿蒙适配实战中，

By Ne0inhk
鸿蒙金融理财全栈项目——运维监控、性能优化、安全加固

鸿蒙金融理财全栈项目——运维监控、性能优化、安全加固

《鸿蒙APP开发从入门到精通》第20篇：鸿蒙金融理财全栈项目——运维监控、性能优化、安全加固 📊🔧🛡️ 内容承接与核心价值 这是《鸿蒙APP开发从入门到精通》的第20篇——运维监控、性能优化、安全加固篇，100%承接第19篇的生态合作、用户运营、数据变现架构，并基于金融场景的运维监控、性能优化、安全加固要求，设计并实现鸿蒙金融理财全栈项目的运维监控、性能优化、安全加固功能。 学习目标： * 掌握鸿蒙金融理财项目的运维监控设计与实现； * 实现应用监控、服务器监控、数据库监控； * 理解性能优化在金融场景的核心设计与实现； * 实现前端优化、后端优化、数据库优化； * 掌握安全加固在金融场景的设计与实现； * 实现代码加固、数据加密、安全审计； * 优化金融理财项目的用户体验（运维监控、性能优化、安全加固）。 学习重点： * 鸿蒙金融理财项目的运维监控设计原则； * 性能优化在金融场景的应用； * 安全加固在金融场景的设计要点。 一、 运维监控基础 🎯 1.1 运维监控定义 运维监控是指对金融理财项目的应用、

By Ne0inhk