从零到全球部署:用边缘函数 + MCP Server 1分钟上线一个游戏

利用ESA边缘函数和ESA MCP Server,结合大模型与AI编程工具,通过简单配置,用1句话1分钟即可实现2048游戏的全球网页部署。

效果演示

方案优势

image

方案概览

实现快速创建并部署2048小游戏,只需以下几步:

  1. 开通ESA边缘函数服务:基于ESA边缘函数的全球部署、超低延迟、自动扩容、Serverless等特性,为游戏提供运行环境。

  2. 配置AI编程工具Cline:通过ClineIDE与大模型之间建立高效连接,只需一句话指令,即可实现代码的智能生成、快速调试,并调用ESA MCP Server将代码部署至ESA边缘节点。

  3. 配置ESA MCP Server:MCP(Model Context Protocol) 是一种标准化协议,旨在为大模型与外部系统之间建立双向通信机制。借助 MCP,大模型可以获取当前上下文信息(如用户身份、设备状态等),并调用平台接口执行远程操作(如读写数据、控制设备等),从而更准确地响应用户的指令和需求。

    ESA MCP Server 是 ESA 提供的一个标准化、开放的接口服务,支持与大模型的集成。开发者可通过大模型驱动的方式,借助ESA MCP Server触发边缘函数的创建、更新与发布等操作,实现智能化的边缘计算任务管理。

  4. 生成并部署游戏代码:完成以上几个步骤之后,就可以通过一句话让大模型自动生成代码,并且通过ESA MCP Server在边缘节点上进行全球部署。

开通ESA边缘函数服务

初次开通默认为免费模式,支持按需切换为按量付费模式。更多信息请参见边缘函数计费说明
  1. 打开ESA控制台,进入边缘函数页面。

  2. 新用户点击页面的立即开通按钮,根据指引完成开通。

image.png

配置AI编程工具Cline

申请API Key

此处申请的API Key将用于Cline调用百炼大模型时的鉴权。您可以优先使用百炼的新人免费额度,免费额度使用完之后会按照大模型产品计费规则进行收费
  1. 前往我的API-KEY页面,单击创建我的API-KEY

  2. 在已创建的API Key操作列,单击查看,获取API KEY

    image

VS Code中安装并配置Cline

  1. VS CodeExtensions中,搜索Cline,并根据指引完成安装。

    image

  2. 打开Cline的设置页,配置大模型的API信息。以下四项为必填项,其余保持默认。

    • API Provider:Alibaba Qwen

    • Alibaba API Line:China API

    • Qwen API Key:上个步骤申请的API Key

    • Model:推荐使用qwen-max-latest

    image

配置ESA MCP Server

申请RAM账户的AK、SK

此处申请的AK、SK将用于ESA MCP Server调用ESA边缘函数的鉴权。
  1. 进入RAM 访问控制工作台,创建一个新的RAM用户。

  2. 用户创建成功之后,请及时保存AccessKey IDAccessKey Secret。页面关闭后无法再次获取。

    image

RAM账户配置权限

根据RAM 用户仅授予必要的最小化权限原则,此处只给该账号授予ESA的操作权限。
  1. 找到上一步创建的用户,点击添加权限

    image

  2. 权限管理页签,点击新增授权

  3. 在新增授权的权限策略模块选择AliyunESAFullAccess,然后点击确认新增授权

    image

Cline中配置ESA MCP Server

  1. 如下图所示,打开Clinecline_mcp_settings.json文件。

    image

  2. 将下边的配置代码复制到cline_mcp_settings.json配置文件中。并使用上一步申请的AccessKey IDAccessKey Secret分别替换ALIBABA_CLOUD_ACCESS_KEY_IDALIBABA_CLOUD_ACCESS_KEY_SECRET的值。随后使用快捷键Ctrl + S(Windows/Linux)或command + S(Mac)保存配置。

    {
      "mcpServers": {
        "esa-mcp-server": {
          "command": "npx",
          "args": ["-y", "mcp-server-esa"],
          "env": {
            "ALIBABA_CLOUD_ACCESS_KEY_ID": "your AK",
            "ALIBABA_CLOUD_ACCESS_KEY_SECRET": "your SK"
          }
        }
      }
    }

    image

  3. 保存后等待3-5秒的时间,ClineMCP ServerInstalled列表中会出现esa-mcp-server服务,并且显示绿色已启用状态(下图所示),表示ESA MCP Server配置成功。

    image

生成并部署游戏代码

  1. 一切准备就绪,这时我们向Cline提出我们的需求:

    帮我写个2048小游戏并部署在阿里云ESAroutine上,并展示ER默认提供的访问地址url。

    可以看到大模型会根据我们的需求,调用ESA MCP Server提供的各种tools,这些tools的调用将完成函数创建、代码提交、全球部署等操作,并最终返回一个可以通过公网访问的URL地址。

    image.png

    image.png

  2. 完成《2048》小游戏的生成了部署后,便可以直接使用ESA提供的域名对游戏页面进行访问,从向AI提出需求到实现网页的公网访问,整个流程可以在分钟级完成。

    image

拓展阅读

什么是MCP

image

MCP是一种开放协议,它标准化了应用程序如何向LLMs提供上下文将 MCP 想象成 AI 应用的 USB-C 端口。就像 USB-C 提供了一种标准化的方式将您的设备连接到各种外围设备和配件一样,MCP 提供了一种标准化的方式将 AI 模型连接到不同的数据源和工具。目前有3种类型的MCP:

  • STDIO

  • SSE

  • Streamable HTTP

目前本文中使用的方式为STDIO,在用户本地部署Server。后续会推出SSEStreamable HTTPremote Mcp Server。

什么是边缘函数ER

边缘函数(EdgeRoutine,简称ER)是阿里云ESA产品(阿里云CDN升级版)提供的Serverless服务,它允许开发者编写JavaScript代码并秒级在阿里云全球边缘节点上部署和执行,支持ES6语法,兼容Nodejs、Deno生态。将您的应用部署在ESA边缘函数,用户的请求可以直接在离用户最近的ESA边缘节点上得到响应处理,相比于您将程序部署到其他中心式服务端,部署在边缘函数可以显著减少延迟、提高响应速度,并实现更低时延的体验。

image.png

  • 全球部署,就近调度,超低延迟:边缘函数与常见的函数计算、弹性计算等云计算服务不同的是,您无需再局限地将函数部署在指定的单个地域(Region)上。边缘函数运行在遍布全球的边缘节点上,客户端的请求将被自动调度至距离最近的边缘节点上,触发边缘函数的代码执行,对请求进行处理并返回结果给客户端。边缘函数可以显著降低客户端请求的响应时间,让您获得低延迟的计算体验。

  • 自动扩容,按量付费:阿里云在全球拥有超过3200+个边缘节点,巨大的边缘节点网络天然具备弹性扩容的特点。当一个区域的客户端请求数量突增,这些请求将被由近及远地调度至有充足计算资源的边缘节点处理,扩容和调度自动化完成。边缘函数按函数的调用次数按量计费,没有请求调用时不会产生费用。

  • Serverless模式,简单易用:使用边缘函数时,您也无需关心底层服务器的CPU、内存、网络、操作系统等基础设施,您可以专注业务代码的开发,只需将代码通过控制台或OpenAPI上传即可完成应用部署。Serverless的开发模式可以有效地降低您的开发运维成本。