# LLMApi:与LLMM和信号R的实时模拟数据:实用指南 # 一. 导言 导言 导言 导言 导言 导言 一,导言 导言 导言 导言 导言 导言 [![N Nuget 元数](https://img.shields.io/nuget/v/mostlylucid.mockllmapi.svg)](https://www.nuget.org/packages/mostlylucid.mockllmapi) [![N Nuget 元数](https://img.shields.io/nuget/dt/mostlylucid.mockllmapi.svg)](https://www.nuget.org/packages/mostlylucid.mockllmapi) > 注意: THS 的文章主要是 AI 作为我发行文件的金币包的一部分生成的。 这很有趣, 所以我把它放在这里, 但是如果你有问题, 请忽略它 。 作为我的一部分 [Niget 软件包 LLMApi / 多数为lucid. mockllmapi ](https://www.nuget.org/packages/mostlylucid.mockllmapi) 我需要有一个页面来使用它具有的信号R特性( 它可以用 LLMM 模拟信号R feed 来提供数据 ) 。 因此这就是我所想出来的 。 你可以找到[ 吉特Hub在这里 ](https://github.com/scottgal/LLMApi)对于项目,所有公共领域等等... 它迅速变成一个不错的工具! ![信号R 模拟器](signalrsimulator.png) 如果你在实际数据源存在之前需要建立仪表板或实时界面界面, 你知道挑战是什么。 你最终会写硬编码的 JSON 装置或详细描述 `setInterval()` 循环,在相同的小对象中旋转。 我构建了这个信号R 演示, 以更灵活的方式解决这个问题。 您描述您需要的普通英语数据, 而本地的 LLM 生成现实的、多样的 JSON 实时流到您的浏览器中。 没有固定装置可以保存, 没有种子文件可以更新, 只要描述您想要的东西并观看它流动 。 让我告诉你它是如何运作的 如何得到最大程度的利用 [TOC] ## 此工具要做什么 信号R 演示页( S)`Index.cshtml`是一个管理实时数据流的控制面板。 1. 您创建了“ EXTU”( 名为数据流) 2. 您用普通英语描述您想要什么样的数据 3. 根据您的描述, LLM 产生适当的 JSON 4. 信号R 每5秒将新数据推进到浏览器 5. 您可以看到实时以语法突出突出显示的语法结果 当您在原型设计、 建立演示、 或者在前端功能上工作时, 等待后端 API 准备就绪时, 它特别有用 。 数据看起来很现实, 因为 LLM 理解上下文并生成适当的值 。 ### 大图片 ```mermaid graph TB Browser[Your Browser] UI[Demo UI] API[Management API] Hub[SignalR Hub] Manager[Context Manager] BG[Background Service] LLM[LLM Ollama/OpenAI] Cache[Response Cache] Browser -->|Create Context| API API -->|Store Config| Manager Browser -->|Connect Subscribe| Hub Hub -->|Register Client| Manager BG -->|Generate Data| LLM LLM -->|Return JSON| BG BG -->|Cache Responses| Cache BG -->|Push to Clients| Hub Hub -->|Real-time Updates| Browser ``` ## 为什么实时更新信号? 信号R 在您的浏览器和服务器之间保持持续的 WebSocket 连接。 服务器不使用 HTTP 请求每几秒钟对端点进行检查, 而是在数据准备好后按下数据。 这样您就可以真正实时更新数据, 并使用最小的管理管理费 。 连接保持开放,数据流动即时,你的UI感觉反应更加灵敏。它与聊天应用程序、实时仪表板以及即时更新重要的协作工具所使用的技术相同。 ## 快速启动: 5分钟后运行 让我们从最快的路径开始看这个工作。我给你们展示一个股票市场数据的例子。 **第1步:启动应用程序** ```bash dotnet run --project LLMApi/LLMApi.csproj ``` 导航至 `http://localhost:5116` (根据实际端口检查控制台输出) 。 **第2步:使用快速启动示例** 您可以看到五个预先配置的绿色“ Launch” 按钮示例。 单击“ 斯德哥尔摩市场” , 您就可以完成。 页面自动 : - 创建股市数据环境 - 订阅浏览器以接收更新 - 开始显示带有价格、数量和变化的活存量数据 **步骤3:观察数据流** 每5秒钟,新数据就会以语法突出显示。每一份更新都显示不同的股票,价格和交易量都符合实际情况。LLM每次生成新的数据,所以你可以看到多样性,同时保持结构一致。 这就对了! 你现在正在流出模拟股票市场数据。 请随意探索另一个快速启动的例子, 以查看不同的数据模式 。 ## 创建您自定义自定义数据流 快速启动按钮很方便, 但真正的能量来自于描述您需要的。 让我们创建自定义的示例 。 **示例:咖啡机遥测** 说你正在建造一个IOT仪表板 需要模拟咖啡机数据 ``` Context Name: coffee-machines Description: Coffee machine telemetry with machine ID, beans remaining percentage, water temperature in Celsius, cups brewed today, and last maintenance timestamp ``` 点击“ 创建和订阅” 关闭。 ### 场景后发生的事 ```mermaid sequenceDiagram participant Browser participant API participant Manager participant BG as Background Service participant LLM participant Hub Browser->>API: POST /api/mock/contexts
{name, description} API->>Manager: Store context config Manager-->>API: Context created ✓ API-->>Browser: 200 OK Browser->>Hub: invoke('SubscribeToContext', 'coffee-machines') Hub->>Manager: Register subscription Manager-->>Hub: Subscription confirmed Hub-->>Browser: on('Subscribed') Note over BG,LLM: Every 5 seconds... BG->>LLM: Generate data for 'coffee-machines'
Prompt includes description LLM-->>BG: JSON response BG->>Hub: Broadcast to 'coffee-machines' group Hub-->>Browser: on('DataUpdate', {data}) Browser->>Browser: Display with syntax highlighting ``` 系统: 1. 在后端创建上下文 2. 订阅浏览器,以便通过信号接收更新 3. 开始根据您的描述生成数据 4. 推动每5秒更新一次 你会看到这样的输出: ```json { "machineId": "CM-2847", "beansRemaining": 67, "waterTemp": 94.5, "cupsBrewed": 142, "lastMaintenance": "2025-01-03T08:23:00Z" } ``` 每次更新都有不同的值,但保持结构。 LLM理解“咖啡机遥测 ” , 并生成在这个背景下有意义的数字。 ## 理解背景 A A A **环境背景** 是一个称为数据流配置的数据。把它视为一个频道或主题。 当您创建一个时,请指定: - **名称名称名称名称名称**:一种独特的识别符号(例如, `weather`, `stock-market`, `sensors`) - **说明说明**:您想要的数据结构,用普通英语 后端 : - 创建使用此名称的信号R 组 - 根据您的描述构建 LLLM 提示 - 定期生成新数据(默认情况下每5秒) - 向所有订阅客户播放 多个浏览器可以订阅相同的上下文, 并且它们都同时接收相同的数据 。 这对测试仪表板非常有用, 这些仪表板需要显示不同屏幕或组件的同步更新 。 ### 国家机器 ```mermaid stateDiagram-v2 [*] --> Created: Create Context
(POST /contexts) Created --> Active: Start
(auto or manual) Active --> Stopped: Stop
(POST /stop) Stopped --> Active: Start
(POST /start) Created --> Subscribed: Client Subscribes Active --> Subscribed: Client Subscribes Stopped --> Subscribed: Client Subscribes
(no data sent) Subscribed --> Receiving: Data Push
(if Active) Receiving --> Subscribed: Client Connected Subscribed --> Created: Unsubscribe Subscribed --> Active: Unsubscribe Subscribed --> Stopped: Unsubscribe Created --> [*]: Delete Active --> [*]: Delete Stopped --> [*]: Delete Subscribed --> [*]: Delete note right of Active Generates data Pushes to clients Shows "Active" badge end note note right of Stopped No data generation Clients stay connected Shows "Stopped" badge end note ``` ## 理解 UI 布局 该接口有三个面板来保持组织: ### 左侧: 创建上下文 这是您定义新数据流的地方。 您需要 : - **上下文名称**:使其独一和描述性。使用小写和缩略语效果很好。 - **说明说明**: 具体描述你想要什么。 LLM 工作最精细的描述是“ 用户简介, 名称、 电子邮件、 年龄和溢价状态布林 ” 。 你不需要写Json Schemas或解释数据类型。LLM从自然语言描述中推断出的结构出奇地好。 ### 中度: 活动上下文 显示所有运行的上下文 : - 姓名和身份徽章(主动/停止) - 连接计数( 有多少客户目前订阅) - 控制按钮: 连接、 断开、 启动、 停止、 删除 **连接/断开** 控制浏览器的订阅。 单击连接开始接收数据, 断开连接停止而不删除上下文 。 **开始/停止** 控制后端数据生成。 如果您想要在不破坏上下文配置的情况下暂停流, 这会有用 。 **删除删除删除** 完全删除上下文。 使用它来清理您用特定数据流完成的数据流时 。 ### 权利:实况数据 这里看到的是实时更新 : - 连接状态指标(连接/断开) - 目前订阅的上下文名称 - 带有时间戳和语法突出显示的最后 10 条信息 数据在顶部显示最新第一, 所以您总是看到最新的更新, 而不滚动 。 ## JavaScript 连接模式 该页面使用 HTMX 格式提交和信号R 实时连接。 如果您正在建立自己的客户端, 下面是信号R 模式, 您需要的 : ### 客户连接流量 ```mermaid sequenceDiagram participant Page as Your Page participant SR as SignalR Client participant Hub as /hub/mock participant BG as Background Service Page->>SR: new HubConnectionBuilder()
.withUrl('/hub/mock') Page->>SR: connection.start() SR->>Hub: WebSocket connection Hub-->>SR: Connected ✓ SR-->>Page: Trigger 'connected' event Page->>SR: invoke('SubscribeToContext', 'weather') SR->>Hub: SubscribeToContext('weather') Hub->>Hub: Add to 'weather' group Hub-->>SR: on('Subscribed', {context: 'weather'}) SR-->>Page: Display "Subscribed" loop Every 5 seconds BG->>Hub: Broadcast to 'weather' group Hub->>SR: on('DataUpdate', {data, timestamp}) SR->>Page: Update UI with new data end Page->>SR: invoke('UnsubscribeFromContext', 'weather') SR->>Hub: UnsubscribeFromContext('weather') Hub->>Hub: Remove from 'weather' group ``` **设置连接 :** ```javascript const connection = new signalR.HubConnectionBuilder() .withUrl('/hub/mock') .withAutomaticReconnect() .build(); connection.on('DataUpdate', (message) => { // message.context: which context sent this // message.data: the actual JSON payload // message.timestamp: Unix timestamp in milliseconds }); await connection.start(); ``` **签署接收数据:** ```javascript await connection.invoke('SubscribeToContext', 'my-context-name'); ``` **完成时取消订阅 :** ```javascript await connection.invoke('UnsubscribeFromContext', 'my-context-name'); ``` 演示页自动处理所有这一切, 但这三个模式都是您需要的自定义执行 。 ## 实际使用案例 以下是一些该工具真正闪耀的情景: **1. 在单亲前建立UIs** 您正在制作一个仪表板, 后端团队仍在设计 API 模型。 而不是阻碍他们的工作, 描述您期望的数据结构, 并用模拟流构建您的 UI 。 当真正的 API 准备就绪时, 您只能交换终点 。 **2. 客户演示** 您正在将现场监控仪表板降级给客户, 但实际的数据管道还没有准备好。 创建符合您计划的数据结构的环境, 并在演示期间显示现实的、 变化中的数据 。 它看起来很专业, 有助于客户对最终产品进行视觉化 。 **3. 前端开发和测试** 您需要现实、 多样的数据来测试您的图表、 表格和组件如何处理更新 。 创建您需要的结构背景, 并开发您的 UI, 相信它能处理真实世界的数据模式 。 **4. 装载测试实时地物** 您想要看到您的 UI 在快速更新中如何运行 。 创建一个高频环境, 并查看您的组件如何处理数据流 。 这有助于在生产前识别性能问题 。 **5. 教授网络软件库和实时概念** 您正在教授信号或WebSocket 概念, 并希望学生看到实时更新而不建立完整的后端。 演示提供了他们可以试验和学习的工作范例 。 ## 快速启动示例解释 五个预先配置的示例显示了不同的共同数据模式: **IOT 传感器**:带有设备元数据的数字传感器读数 **股票市场**:与价格、数量和百分比变化有关的财务数据 **电子商务命令**:带有顺序项目阵列的嵌顶对象 **服务器计量数**:具有多重性能指标的系统监测 **博博主导板**:有统计和状态的玩家排名 这些示例已经准备就绪。 单击启动, 查看数据, 并使用它们作为您自身背景的模板 。 ## API 一体化终点 如果您正在建立客户端客户端或将此整合到另一个应用程序中, 以下是 HTTP 端点 : **创建上下文 :** ```bash curl -X POST http://localhost:5116/api/mock/contexts \ -H "Content-Type: application/json" \ -d '{"name": "sensors", "description": "Temperature sensors with device ID and readings"}' ``` **列出全部上下文 :** ```bash curl http://localhost:5116/api/mock/contexts ``` **获取具体的上下文 :** ```bash curl http://localhost:5116/api/mock/contexts/sensors ``` **启动或停止数据生成 :** ```bash curl -X POST http://localhost:5116/api/mock/contexts/sensors/start curl -X POST http://localhost:5116/api/mock/contexts/sensors/stop ``` **删除上下文 :** ```bash curl -X DELETE http://localhost:5116/api/mock/contexts/sensors ``` 创建上下文后, 连接到 SignalR 中心 `/hub/mock` 并订阅开始接收更新 。 ## LLM 如何生产LLM 创建上下文时,系统: 1. 1. 说明 2. 构建一个包括随机性的提示( GUID 种子+各种时间戳) 3. 要求LLM 生成与您描述相匹配的适当 JSON 。 4. 验证响应为实际 JSON( 必要时标记) 5. 快速交付的多重反应 6. 在背景中生成更多内容以保持缓存的填充 温度定在1.2( 相对高) 以确保多样性。 当您要求“ 用户数据 ” 时, 每次会得到不同的名称和值, 而不是重复无休止的相同数量。 数据在结构上保持一致性, 而现实上会有所不同 。 ## 性能和智能缓存 数据生成发生在背景中, 而不是按需按按按键进行。 这样可以保持更新的一致性, 并减少 LLM 负荷 。 以下是它是如何工作的: - 启动时, 系统会先填充缓存, 包括每个活动环境的响应 - 它衡量代数多久(例如,每要求500米) - 它计算最佳批量大小: 推间 生成时间 (5000ms 500ms = 10 项) - 它在背景中生成批量, 以保持缓存安装 - 到了推的时候,它会立刻从缓存中拔出来 结果:你的第一则讯息即刻即时到达, 其后的讯息每5秒就发出一次, 而LLM并不是被持续地敲敲。 ### 聪明的缓缓流 ```mermaid graph LR subgraph Startup A[App Starts] --> B[Pre-fill Cache] B --> C[Measure Gen Time
500ms] C --> D[Calculate Batch
5000ms / 500ms = 10] end subgraph Runtime Loop E[Timer Tick
Every 5s] --> F{Cache > 50%?} F -->|Yes| G[Pop from Cache] F -->|No| H[Generate Batch
in Background] G --> I[Push to Clients] H --> J[Refill Cache] J --> G I --> E end D --> E style B stroke:#10b981,stroke-width:3px style G stroke:#0ea5e9,stroke-width:3px style H stroke:#ef4444,stroke-width:3px style I stroke:#f59e0b,stroke-width:3px ``` ## 解决共同问题 **连接显示“ 断开连接” , 不再连接** - 请检查您的 LLLM 服务 (Ollama/ OpenAI) 正在运行 - 默认配置期待 Ollama 于 `http://localhost:11434` - 运行运行中 `ollama list` 来验证您安装了模型 - 检查浏览器控制台的信号信号连接错误 **创建了上下文但没有出现数据** - 看看“积极背景”小组——显示“积极背景”的背景是“积极背景”的背景吗? - 如果您尚未订阅, 请单击连接按钮 - 校验连接状态在 LiveData 数据面板中显示绿色( 连接) 。 - 检查服务器日志以查看 LLLM 生成器是否正常工作 **数据结构与您所期望的不符** - 使你的描述更加具体和具体 - 示例:“ 温度值在 0 到 100 之间的数值” 要比“ 温度” 有效 。 - 尝试改写您的描述 - 这是工作时的快速工程 - 检查生成的数据,并根据您看到的内容改进您的描述 **浏览器控制台显示 SignalR 重新连接尝试** - 后端可能没有正在运行 - 检查您的终端 - 您可能已经更改了端口—— 需要时更新了信号R中枢 URL URL - 检查防火墙或网络问题(特别是在Docker/WSL环境中) ## 配置选项 您可以自定义行为 `appsettings.json`: ```json { "MockLlmApi": { "SignalRPushIntervalMs": 5000, // How often to push data (milliseconds) "ModelName": "llama3", // Which LLM model to use "Temperature": 1.2, // Creativity level (0.0-2.0, higher = more varied) "BaseUrl": "http://localhost:11434", // LLM service URL "HubContexts": [ // Optional: pre-configured contexts { "Name": "weather", "Description": "Weather data with temperature, humidity, wind speed", "IsActive": true } ] } } ``` **信号RPush 中间**: 设定更快捷更新的更低位, 高位以减少 LLM 负载 **温度**:高值提供更多创造性/随机数据,低值提供更一致的结果 **中心图文**:定义应用程序启动时自动开始的背景 ## 与您的应用程序结合 如果您正在构建一个实际的仪表板, 并且想要在开发过程中使用这个, 以下是一个反应示例: ```javascript import * as signalR from '@microsoft/signalr'; const connection = new signalR.HubConnectionBuilder() .withUrl('http://localhost:5116/hub/mock') .withAutomaticReconnect() .build(); connection.on('DataUpdate', (message) => { if (message.context === 'stock-market') { updateStockChart(message.data); } }); await connection.start(); await connection.invoke('SubscribeToContext', 'stock-market'); ``` 当您准备切换到生产时, 请更改中心 URL 。 信号R 接口 (SignalR) 。`on()` 和 `invoke()`与真正的后端工作的方式相同。 ## 为什么要建这个? 外边有很好的模拟数据图书馆。 Faker.js 非常好。 Mockaroo 做得很好。 那么为什么要另建一个工具呢 ? 这一工具解决了具体的挑战: 1. **实时流流**: 大多数工具都为您提供静态数据集或 REST 端点, 而不是实时 WebSocket 流 2. **自然语言界面**:描述您想要的东西而不是写 JSON 计划 3. **符合实际情况的数据**: LLMs 产生现实的数值,这些数值可以一起理解,而不仅仅是碰巧适合某一类型的随机字符串。 4. **自我文件编制**:描述是您数据结构的文档。 5. **灵活结构**:在不更新固定装置的情况下,改变数据模型的中度开发,而不更新固定装置 它是为特定的工作流程设计的: 在您需要不同且现实的数据且没有配置间接费用的情况下, 建立实时 UI 。 ## 开始 理解这个工具的最佳方法是使用它: 1. 启动应用程序 : `dotnet run --project LLMApi` 2. 打开浏览器 `http://localhost:5116` 3. 单击绿色“ Launch” 按钮之一 4. 监视数据流 从那里, 请尝试创建您自己的上下文, 描述您的项目需求。 当您将工具用于真正的开发工作时, 此工具最为宝贵 。 我之所以建这个,是因为我一直遇到同样的问题:需要现实的、为演示和发展而改变数据。如果你也面对这一挑战,我希望这个工具能帮助你的工作流程。 --- ## 快速快速参考 **启动 :** ```bash dotnet run --project LLMApi ``` **默认 URL :** `http://localhost:5116` **信号枢纽 :** `/hub/mock` **关键方法 :** - `SubscribeToContext(name)` - 开始接收数据 - `UnsubscribeFromContext(name)` - 停止接收数据 **关键活动:** - `DataUpdate` - 收到新数据 - `Subscribed` - 确认订阅 - `Unsubscribed` - 确认取消订阅 这就是你需要知道的 剩下的只是探索你能用它建造什么