1.7.2使用Cursor开发项目
1.7.2.1设置您的目录和工具
在您的桌面上,创建一个名为--aepUserLdap---commerce的新目录
右键单击您的文件夹,然后选择在文件夹新建终端。
您应该会看到此内容。
您现在需要克隆现有的Github存储库,以便查看https://github.com/adobe/commerce-integration-starter-kit。
此存储库是Adobe的集成入门工具包,它使用Adobe Developer App Builder提高Adobe Commerce与其他后台系统(如ERP、CRM和PIM)的集成的实时连接可靠性并缩短上市时间。
有多种方法可克隆此存储库,在此示例中使用“终端”。
在“终端”窗口中输入以下命令并执行它。
git clone https://github.com/adobe/commerce-integration-starter-kit
几秒钟后,您应该会看到此结果。
接下来,您应该导航到刚刚创建的文件夹。 输入以下命令,然后执行它。
cd commerce-integration-starter-kit
您应该会看到此内容。
接下来,您需要为Cursor设置Commerce可扩展性工具。 输入以下命令,然后执行它。
aio commerce extensibility tools-setup
选择当前目录。
选择游标。
选择npm。
几分钟后,您应该会看到此内容。
通过安装用于Cursor的Commerce可扩展性工具,现在可以将MCP服务器作为Cursor环境的一部分提供。 在接下来的练习中,您将使用该MCP服务器来帮助您开发和部署App Builder项目。
1.7.2.2设置您的webhook
在本练习中,您将需要配置一个webhook,以便在创建订单时,可以将订单事件流式传输到该webhook。 在本练习中,您将使用https://pipedream.com/requestbin的示例终结点。
转到https://pipedream.com/requestbin,创建一个帐户,然后创建一个工作区。 创建工作区后,您将看到类似以下的内容。
单击 复制 复制URL。 您需要在下一个练习中指定此URL。 此示例中的URL是https://eodts05snjmjz67.m.pipedream.net。
1.7.2.3使用光标创建应用程序
打开光标。 单击打开项目。
导航到您创建的文件夹,该文件夹应名为--aepUserLdap---commerce。 在该文件夹中,选择名为commerce-integration-starter-kit的文件夹。 单击打开。
您应该会看到此内容。 在继续之前,请确保在Cursor中打开的顶级文件夹为commerce-integration-starter-kit。
使用键盘快捷键Cmd + Shift + J打开“光标”设置。 您应该会看到此内容。 转到工具& MCP。
启用MCP服务器commerce-extensibility。 完成后,单击 X 关闭窗口。
复制以下提示并将其粘贴到光标中。 然后,单击 发送 按钮。
I would like to build an app that subscribes to order created events and sends them to a configurable URL with basic authentication
游标将开始推理和执行。 光标会要求您确认几次。 发生这种情况时,请单击运行。 根据推理和您的设置,这种情况可能会出现5-10次。
几分钟后,您应该会看到类似这样的内容。
如Cursor所示,下一步是创建名为.env的文件,并在其中提供所需的变量。
1.7.2.4创建您的.env文件
选择文件env.dist。 输入命令Cmd + C,然后输入命令Cmd + V。
将新创建的文件重命名为.env。
接下来,您需要为文件 .env 中的所有变量提供值。
您可以在此处找到所有必需的信息。
Commerce端点
您可以通过转到https://experience.adobe.com找到这些变量。 单击Commerce。
您应该会看到此内容。 单击ACCS环境旁边的 信息 图标,该图标应命名为--aepUserLdap-- - ACCS。 复制REST端点和GraphQL端点的值。
在本例中,这些是要复制的值。 将它们粘贴到文件 .env 第6行和第7行的以下变量旁边。
- COMMERCE_BASE_URL = https://na1-sandbox.api.commerce.adobe.com/Lkp3U7tvTBNAmpFvwnZJ4B/
- COMMERCE_GRAPHQL_ENDPOINT = https://na1-sandbox.api.commerce.adobe.com/Lkp3U7tvTBNAmpFvwnZJ4B/graphql
然后,您应将它放入文件 .env 中。
Adobe I/O项目变量
您可以通过转到https://developer.adobe.com/console找到这些变量。 转到项目,然后单击以打开您在上一个练习中创建的、应命名为--aepUserLdap-- Commerce Events的Adobe I/O项目。
转到生产。
转到OAuth服务器到服务器。 您应该会看到此内容。
复制字段客户端ID、客户端密钥、技术帐户ID、技术帐户电子邮件和 组织ID 的值,并将其粘贴到文件 .env 中第13-17行的以下变量旁边。
- OAUTH_CLIENT_ID= 客户端ID
- OAUTH_CLIENT_SECRET= 客户端密钥
- OAUTH_TECHNICAL_ACCOUNT_ID= 技术帐户ID
- OAUTH_TECHNICAL_ACCOUNT_EMAIL= 技术帐户电子邮件
- OAUTH_ORG_ID= 组织ID
然后,您应将它放入文件 .env 中。
Commerce_ADOBE_IO_EVENTS_MERCHANT_ID
对于字段COMMERCE_ADOBE_IO_EVENTS_MERCHANT_ID=,请在文件--aepUserLdap--_commerce_events.env 中输入第34行的值。
然后,您应将它放入文件 .env 中。
Workspace配置
要检索这些变量,请返回您的Adobe I/O项目,然后单击Workspace概述。
在转到 Workspace概述 后,请查看URL,它应如下所示: https://developer.adobe.com/console/projects/133309/4566206088345586770/workspaces/4566206088345619105/details。
此示例中的第一个数字133309是用于字段 IO_CONSUMER_ID 的值。
此示例中的第二个数字4566206088345586770是用于字段 IO_PROJECT_ID 的值。
此示例中的第三个数字4566206088345619105是用于字段 IO_WORKSPACE_ID 的值。
- IO_CONSUMER_ID= 133309
- IO_PROJECT_ID= 4566206088345586770
- IO_WORKSPACE_ID= 4566206088345619105
复制这些值,并将其粘贴到文件 .env 中第42-44行的以下变量旁边。
EVENT_PREFIX
对于字段EVENT_PREFIX =,在文件--aepUserLdap--_.env 的第47行中输入值。
然后,您应将它放入文件 .env 中。
Webhook
对于字段ORDER_WEBHOOK_URL,您应该粘贴本练习前面创建的webhook的URL,它应该如下所示: https://eodts05snjmjz67.m.pipedream.net。
然后,您应将它放入文件 .env 中。
App Builder凭据
您应该更新文件 .env 中第54-55行的以下变量:
- AIO_RUNTIME_NAMESPACE=
- AIO_RUNTIME_AUTH=
您可以通过返回您的Adobe I/O项目来检索这些变量的值。 转到 Workspace概述 并单击全部下载。
随后将下载类似这样的文件。 使用文本编辑器打开该文件。
向右滚动,直到看到运行时。 然后您应该会看到包含 AIO_RUNTIME_NAMESPACE 值的字段name。
进一步向右滚动直到看到auth,其中包含 AIO_RUNTIME_AUTH 的值。
将这两个值粘贴到文件 .env 的第54-55行上,然后您应该拥有它。
您的 .env 文件现已完全配置。
1.7.2.5工作区.json
在上一步中,您从Adobe I/O项目下载了类似这样的文件。
重命名该文件并使用名称workspace.json。
将文件复制到目录脚本>上线>配置中。
1.7.2.6 Adobe I/O登录
返回您以前使用的终端窗口。 输入命令aio login。
随后,您应该会在通过浏览器登录后看到此信息。
1.7.2.7准备部署
复制以下提示并将其粘贴到光标中。 然后,单击 发送 按钮。
Please deploy this code to Adobe I/O
单击 运行 以允许操作,光标可能会要求您多次确认操作。
部署将在几分钟后完成。
复制以下提示并将其粘贴到光标中。 然后,单击 发送 按钮。
run the onboarding to commerce
几分钟后,您应该会看到此内容。
复制以下提示并将其粘贴到光标中。 然后,单击 发送 按钮。
subscribe to commerce events
几分钟后,您应该会看到此内容。
1.7.2.8在Adobe Commerce as a Cloud Service中验证配置
转到https://experience.adobe.com。 单击Commerce。
单击您的Adobe Commerce as a Cloud Service环境以将其打开,然后登录。
转到系统,然后转到事件订阅。
然后,您应该会看到此事件订阅列表。
转到商店,然后转到配置。
转到 Adobe服务 并选择Adobe I/O Events。 然后,您应该看到字段 Adobe I/O Workspace配置 的值包含几个星号,并且字段 贸易商ID 也应该具有类似于--aepUserLdap--_commerce_events的值。
完成此配置后,您现在可以测试配置。
1.7.2.9测试您的方案
打开您的网站。
转到 监视 并单击任何产品。
配置产品并单击添加到购物车。
单击 购物车 图标并选择结帐。
填写您的详细信息,然后单击下订单。
然后,您应该会看到订单确认。
切换到webhook应用程序。 您现在应该会看到刚刚确认的订单的传入事件。
1.7.2.10 Adobe I/O调试
返回您的Adobe I/O项目。 转到Workspace概述。 您应会看到类似以下的内容。 向下滚动一点。
单击以打开Commerce订单同步。
转到调试跟踪。 您可以在该处找到最新的传入事件及其有效负载。 这有助于了解已处理哪些事件以及是否成功处理了这些事件。