你当前正在访问 Microsoft Azure Global Edition 技术文档网站。 如果需要访问由世纪互联运营的 Microsoft Azure 中国技术文档网站，请访问 https://docs.azure.cn。
Azure Web PubSub 可帮助开发人员使用 WebSocket 和发布-订阅模式轻松生成实时消息传送 Web 应用程序。
在本教程中，你将在 Visual Studio Code 的帮助下使用 Azure Web PubSub 创建聊天应用程序。
先决条件
克隆项目
打开新的 Visual Studio Code 窗口。
按 F1 打开命令面板。
输入“Git: Clone”，然后按 Enter。
输入以下 URL 克隆示例项目：
https://github.com/Azure/azure-webpubsub.git注意
本教程使用 JavaScript 项目，但步骤与语言无关。
选择要将项目克隆到的文件夹。
选择“打开 -> 在 Visual Studio Code 中打开
azure-webpubsub/samples/javascript/chatapp/nativeapi文件夹”。
登录 Azure
按 F1 打开命令面板。
选择“Azure: 登录”并按照提示进行身份验证。
登录后，返回到 Visual Studio Code。
创建 Azure Web PubSub 服务
适用于 Visual Studio Code 的 Azure Web PubSub 扩展使用户能够快速创建、管理和利用 Azure Web PubSub 服务及其开发人员工具，例如 Azure Web PubSub 本地隧道工具。 在此方案中，你将创建新的 Azure Web PubSub 服务资源，并将其配置为托管应用程序。 安装 Web PubSub 扩展后，可以在 Visual Studio Code 的 Azure 控制面板下访问其功能。
按 F1 打开命令面板并运行 Azure Web PubSub：创建 Web PubSub 服务 命令。
输入扩展提示的以下值。
Prompt 值 选择订阅 选择要使用的 Azure 订阅。 选择资源组 选择要使用的 Azure 资源组。 输入服务的名称 输入 my-wps。选择一个位置 选择靠近你的 Azure 区域。 选择定价层 选择要使用的定价层。 选择单位计数 选择要使用的单位计数。 Azure 活动日志面板随即打开并显示部署进度。 本过程可能需要几分钟才能完成。
此过程完成后，Visual Studio Code 将显示一条通知。
创建中心设置
在 Visual Studio Code 左侧的活动栏中打开 Azure 图标。
注意
如果活动栏已隐藏，则无法访问该扩展。 通过单击“视图>外观>显示活动栏”来显示活动栏
在资源树中，找到创建的 Azure Web PubSub 资源
my-wps，然后单击它展开右键单击项中心设置，然后选择“创建中心设置”
输入
sample_chat为中心名称并创建中心设置。 创建额外的事件处理程序并不重要。 等待进度通知显示为已完成项中心设置下方会显示一个新的子项中心sample_chat。 右键单击新项，然后选择“附加本地隧道”
通知提醒你创建已启用隧道的事件处理程序弹出。 单击“是”按钮。 然后输入扩展提示的以下值
Prompt 值 选择用户事件 全选 选择系统事件 选择“已连接” 输入服务器端口 输入 8080 该扩展会创建一个新的终端来运行本地隧道工具，并通知提醒你打开本地隧道门户。 单击按钮“是”或打开“http://localhost:4000"在 Web 浏览器中手动查看门户。
运行服务器应用程序
确保工作目录为
azure-webpubsub/samples/javascript/chatapp/nativeapi安装 Node.js 依赖项
npm install在活动栏中打开 Azure 图标，找到 Azure Web PubSub 资源
my-wps。 然后右键单击资源项，然后选择“复制连接字符串”。 连接字符串将复制到剪贴板运行复制连接字符串的服务器应用程序
node server.js "<connection-string>"在浏览器中打开
http://localhost:8080/index.html以尝试聊天应用程序。
提示
遇到问题？ 通过在 Azure Web PubSub 存储库中打开问题，在 GitHub 上告诉我们。