Pages MCP Server + cursor，一句话完成旅游出行规划

最新推荐文章于 2025-05-11 15:20:11 发布

叫我阿柒啊

最新推荐文章于 2025-05-11 15:20:11 发布

阅读量1k

点赞数 35

文章标签： cursor mcp server

本文链接：https://blog.csdn.net/CatchLight/article/details/147223486

版权

前言

最近 MCP 爆火，MCP 的出现让大模型瞬间打通了任督二脉，开启了“万物互联”的新篇章，于是我开始沉迷于研究各种各样的 MCP Server，最近开始研究EdgeOne Pages Deploy MCP，这个 MCP Server，能够将 HTML 内容快速部署到 EdgeOne Pages 并生成公开访问链接，与cursor协作能够立即预览和分享 AI 生成的网页内容。

这不禁让我想起很多年前，一个网友问我干啥的，在得知我是程序员之后他就问我会不会写网页。当时只会Java，但是死要面子地从网上找个一个H5，然后保存为 HTML 扔到了 Tomcat 的 ROOT 目录下，最后潇洒地将 URL 扔给了他。

如今，这样的问题也会出现在我的身边，例如个人出行路线规划，或者朋友问我济南有什么好玩的，某某某景区有什么好吃的等，现在这些问题对我来说已经不是难题了， cursor + 三个 mcp server 轻松搞定。

Pages MCP Server：部署页面到公网
edgeone-geo-mcp-server：获取当前位置
amap-maps：高德地图mcp server，实现路线规划、位置搜索等。

MCP Server

如今，我只需一句话就能让 cursor 使用大模型帮我生成我想要的任何页面，并自动调用，Pages MCP Server，利用无服务器边缘计算能力和 KV 存储，通过 API 接收 HTML 内容，即可自动生成即时生效的公共访问链接，并实现秒级静态页面部署并内置错误处理机制。

Pages MCP Server

那么如何使用 Pages MCP Server。在 Cursor 的 Cursor Settings 中找到 MCP。

点击右侧上方的 Add new global MCP server 按钮，便自动打开 .local 目录下的 mcp.json 文件。在这个json文件中，我们将下面的 Pages MCP Server 的信息粘贴进去。

{
  "mcpServers": {
    "edgeone-pages-mcp-server": {
      "command": "npx",
      "args": ["edgeone-pages-mcp"]
    }
  }
}

这样，我们返回 MCP 页面，便可以看到配置好的 edgeone-pages-mcp-server。

如上图我们可以看到，edgeone-pages-mcp-server 只有一个名为 deploy_html 的 tool，在 edgeone-pages-mcp 源码中也可以看到 deploy_html 的代码实现。

我们在使用的时候，不需要去管代码实现，配置完成之后，cursor 中的大模型便拥有了 Pages MCP Server 的 deploy_html 自动部署的能力。

edgeone-geo-mcp-server

edgeone-geo-mcp-server 可以获取我们当前的位置，我们需要本地部署这个 mcp server。EdgeOne Pages 提供了丰富的模版，我们登录EdgeOne控制台。

在 Pages 页面下选择 从模版开始。

搜索edgeone-geo，然后点击部署。

选择 gitee 或者 github 作为git平台，开始进行部署。

部署完成之后，edgeone-geo 就会部署到 edgeone 平台上，并返回一个公共url。

点击url，我们可以访问到 edgeone-geo 的页面信息。

点击函数，我们可以看到部署的路由信息。

这里是有一个 get_geo 的路由，通过公共url + 路由即可调用获取当前位置的服务。同时在 gitee 上也看到了 edgeone 的仓库。

将这个仓库下载到本地，然后复制目录路径，将 mcp server 信息复制到 mcp.json 中。

"edgeone-geo-mcp-server": {
      "command": "tsx",
      "args": ["/Users/aqi/app/ai/mcp/mcp-geo/index.ts"]
    }

这样，在 cursor 中，就可以调用 edgeone-geo-mcp-server。

同时也可以看到 edgeone-geo-mcp-server 只有一个 get_location 的 tool。那么，这里就会有一个疑问，只是使用 mcp server 的话，为什么要部署 edgeone-geo-mcp-server，直接下载源码到本地不就可以吗？

确实如此，但是如果想要让页面实现定位使用者位置，并规划路线的话，就需要使用接口调用，这样调用 get_geo 这个路由即可。

amap-maps

最后就是配置高德地图的 mcp server，我们首先去高德开放平台获取应用key。

在这里要注意的是，mcp server 使用的是 web应用 类型的key，html 中应该使用 JavaScript 类型的key。在申请完key之后，我们复 mcp server 配置到 mcp.json 中。

{
    "mcpServers": {
        "amap-maps": {
            "command": "npx",
            "args": [
                "-y",
                "@amap/amap-maps-mcp-server"
            ],
            "env": {
                "AMAP_MAPS_API_KEY": "您在高德官网上申请的key"
            }
        }
    }
}

这样，就能看到 amap-maps 的 tools 信息。

指针放在上面可以看到对应tool的详细信息。

路线规划

在三个 mcp server 配置好了之后，我们就可以在 curssor 中调用。在对话框中选择 Agent，然后选择输入以下提示词：

获取我当前位置，搜索济南的景区位置，并规划路线，然后本地生成一个html页面，集成高德地图，然后点击每个景区，在页面上方都会显示高德地图，并高亮路线

然后就开始调用 edgeone-geo-mcp-server 的 get_geolocation 工具来定位以当前的信息。

然后调用高德地图的 amap-maps mcp sever 的 maps_text_search 来搜索附近的景区。

在收到高德地图返回的景区信息之后，就要调用 maps_search_detail 来查询每个景区的详细信息。

详细信息如下：

{
	  "id": "B021305SHC",
	  "name": "趵突泉",
	  "location": "117.015893,36.661087",
	  "address": "趵突泉南路1号",
	  "business_area": "共青团路",
	  "city": "济南市",
	  "type": "风景名胜;风景名胜;国家级景点",
	  "alias": "趵突泉公园",
	  "cost": "20.00",
	  "opentime2": "周一至周日 07:00-19:00",
	  "level": "AAAAA",
	  "rating": "4.9",
	  "open_time": "07:00-19:00",
	  "ticket_ordering": "0"
}