解耦菜单概述
解耦菜单为 JavaScript 前端提供了使用 Drupal 中管理的可配置菜单的最佳方式。这使前端开发人员可以轻松使用该菜单数据来呈现导航，而不是对其进行硬编码。这也意味着非开发人员无需编写代码即可管理应用程序菜单！
此功能内置于 Drupal 核心中，因此您可以获得世界上最好的 CMS 所具有的所有其他优势。这还包括安全性、缓存和翻译。您实际上可以轻松地将多语言菜单数据提供给任意数量的解耦应用程序。
虽然此功能可以以多种方式使用，但目前解耦菜单主要服务于一种用例：全局且静态的菜单。这种菜单在各个页面或屏幕之间保持不变，旨在为解耦应用程序提供通用导航选项。这些菜单对所有用户来说都是相同的。
将来，分离菜单功能可以扩展到涵盖上下文感知的菜单。这将是一个可能根据页面上下文或特定用户而变化的菜单。例如，可能会有特定的菜单项根据用户及其在应用程序中的角色或访问权限而可用。有关此概念的更多讨论可通过查阅以下问题找到。
除了模块提供的后端功能之外，还有一些工具可供使用，以便更轻松地使用前端的 API 数据，包括库和 Web 组件。
后端
获得工作设置的最快方法：drush、sqlite + 内置 php 服务器。
设置 Drupal 后端
使用 drush 和 sqlite DB 来设置网站。
composer create-project drupal/recommended-project:^10.1.x-dev decoupled
cd decoupled
composer require drush/drush
./vendor/bin/drush si demo_umami --db-url=sqlite://.ht.sqlite
启用链接集端点
可以在配置页面的 Webservices 下的站点设置中启用链接集端点。此设置的 URL 为/admin/config/services/linkset。
在配置页面上查找设置
启用链接集端点
这会在system/menu/[菜单系统名称]/linkset处启用一个新端点。此端点将菜单作为链接集。
服务 Drupal
使用内置 PHP 服务器（使用另一个终端）
cd web
php -S localhost:8888 .ht.router.php
获取菜单数据
菜单数据可在 处获取 ，其中“[菜单名称]”是菜单的机器名称。例如，要检索主菜单：/system/menu/[menu name]/linkset
curl http://localhost:8888/system/menu/main/linkset
如果您的前端与后端位于不同的域上，您可以启用 CORS 标头以允许 javascript 请求从前端工作。
要以其他语言访问菜单数据，请将语言前缀或语言域添加到请求中。要获取西班牙语菜单，请将前缀添加es到 URL。
curl http://localhost:8888/es/system/menu/main/linkset
端点尊重用户权限，因此您只有在使用适当的用户帐户登录时才能访问管理菜单数据。
curl http://localhost:8888/system/menu/admin/linkset
示例响应格式
响应的格式遵循链接集 IETF 草案，以允许对响应的结构具有一定的可预测性。
菜单数据以平面数组的形式返回，其中的信息 使得呈现结构化菜单成为可能。
drupal-menu-hierarchy{
"linkset": [
{
"anchor": "\/system\/menu\/admin\/linkset",
"item": [
{
"href": "\/en\/admin",
"title": "Administration",
"drupal-menu-hierarchy": [
".000"
],
"drupal-menu-machine-name": [
"admin"
]
},
{
"href": "\/en\/admin\/structure",
"title": "Structure",
"drupal-menu-hierarchy": [
".000.001"
],
"drupal-menu-machine-name": [
"admin"
]
},
{
"href": "\/en\/admin\/structure\/block",
"title": "Block layout",
"drupal-menu-hierarchy": [
".000.001.000"
],
"drupal-menu-machine-name": [
"admin"
]
},
{
"href": "\/en\/admin\/structure\/contact",
"title": "Contact forms",
"drupal-menu-hierarchy": [
".000.001.001"
],
"drupal-menu-machine-name": [
"admin"
]
},
{
"href": "\/en\/admin\/structure\/display-modes",
"title": "Display modes",
"drupal-menu-hierarchy": [
".000.001.003"
],
"drupal-menu-machine-name": [
"admin"
]
},
{
"href": "\/en\/admin\/structure\/display-modes\/form",
"title": "Form modes",
"drupal-menu-hierarchy": [
".000.001.003.000"
],
"drupal-menu-machine-name": [
"admin"
]
},
{
"href": "\/en\/admin\/structure\/display-modes\/view",
"title": "View modes",
"drupal-menu-hierarchy": [
".000.001.003.001"
],
"drupal-menu-machine-name": [
"admin"
]
}
]
}
]
}
评论