如何用WinUI和Semantic Kernel结合Playwright，优雅解析网页内容？

前言 这算是一篇学习记录博客了，主要是学习语义内核（Semantic Kernel）的实践，以及Aspire进行全栈开发的上手体验，我是采用Aspire同时启动API服务，Blazor前端服务以及WinUI的桌面端项目，同时进行三个项目的代码修改，整体感觉很方便，如果代码都修改了只需要启动Aspire项目，不用每个项目单独起一遍了，而且速度很快，即使是有用容器服务的情况下。 技术方案 1. 框架选型 WebApi使用Asp.Net Core WebApi实现。 Bing搜索结果获取，以及网页解析内容提取使用的是PlayWright库。 网页内容总结使用的是WinUI编写的客户端，结合语义内核（Semantic Kernel）调用国产智普清言LLM。 后台管理页面使用的Blazor，不过只是一个demo页面。 2. 为什么这样选 作为一个.Net开发，肯定优先使用.Net相关的技术了，也为了能实践最新的技术，就进行了一些新技术的选择。 主要说明一下选择这几个技术框架的原因： Playwright 原因是通过测试发现它的表现最好，其他类型的库也有测试，比如Selenium，HtmlAgilityPack，HtmlAgilityPack对静态网页解析比较好，但是如果遇到js渲染的数据很多的页面就不好了，Selenium比Playwright提取的内容差了一些，Playwright是通过模拟用户操作启动浏览器，然后获取内容，感觉如果一次性处理很多的页面应该也会负载很大。 Aspire 这个是因为这是微软最新的专门给开发人员开发的工具，那既然是给开发人员做的，那肯定要体验一把了，体验完感觉是真的不错，能够节省很多的步骤。 语义内核（Semantic Kernel）选择它是因为这算是.Net社区对接大语言模型最流行的框架了，提供了很多的开箱即用的功能，对于开发智能APP帮助很大，而且社区热度也很高。 智普清言LLM 选择它是多方面考虑的结果，第一是它兼容OpenAI的接口，这样语义内核就可以通过配置就能使用它，第二是它是支持Function Call的,也就是说它可以作为OpenAI的国内平替，用它开发一些智能APP是很好的。 WinUI 选择它是个人对客户端开发主要使用的是WinUI，而且用它对接大语言模型不把对接放到后端也是为了后面对接离线大语言模型做基础，比如微软的Phi3之类的。 代码讲解 本博客涉及的代码链接如下： https://github.com/GreenShadeZhang/BingSearchSummary 1. 搜索结果获取 示例代码如下： 先创建Playwright实例，然后进行用户操作模拟。 var playwright = await Playwright.CreateAsync(); var browser = await playwright.Chromium.LaunchAsync(new BrowserTypeLaunchOptions { Headless = true }); var page = await browser.NewPageAsync(); // 设置 User-Agent 和视口大小 var js = @"Object.defineProperties(navigator, {webdriver:{get:()=>false}});"; await page.AddInitScriptAsync(js); await page.GotoAsync("https://www.bing.com"); // 模拟用户输入搜索关键词 await page.FillAsync("input[name=q]", keyword); await page.Keyboard.PressAsync("Enter"); // 等待搜索结果加载 await page.WaitForLoadStateAsync(LoadState.NetworkIdle); // 获取搜索结果内容 var content = await page.ContentAsync(); var dataList = BingSearchHelper.ParseHtmlToJson(content); var result = new List<BingSearchItem>(); 将搜索结果解析成json数据如下： 这一步是因为我没有bing搜索的订阅，所以只能解析页面，如果有bing搜索的订阅这一步可以省略。