在 React 中理解 CORS
CORS 长期以来一直让开发者（尤其是入门者）感到困惑——甚至沮丧。这个概念并不直观，特别是当你使用 React、Angular 或 Vue 等框架构建单页应用（SPA）并尝试与第三方 API 交互时。
在本指南中，我会从零开始帮助你理解 CORS。我们将搭建一个简单的 React 应用和一个 Express 服务器，来演示究竟是什么触发了 CORS 错误以及它们为何发生。更重要的是，我会带你逐步了解多种解决方法——既包含通用思路，也包含在 React 环境中的具体做法。
什么是 CORS？
CORS（跨域资源共享，Cross-Origin Resource Sharing）是一种协议，用于规范 Web 应用如何从不同来源（origin）的服务器请求资源。就像 HTTPS 规定了安全通信的规则一样，CORS 规定了跨域请求的规则。
在不断发展的网页开发领域中，Drupal 11 脱颖而出，成为构建动态网站和应用程序最强大、最灵活的平台之一。它的模块化架构使开发人员能够定制和扩展核心功能，以满足各种项目需求。
其中一个扩展就是 Webform REST 模块，它是一个强大的工具，通过 RESTful API 实现 Drupal 与外部应用之间的无缝集成。本指南提供了一个在 Drupal 11 中使用 Webform REST 模块的实用入门，带领你完成其安装与配置，并演示如何高效地与其交互。
你将学到什么
本文涵盖以下主题：
-
Webform REST 模块概述
-
所需模块和依赖项
-
安装 Webform REST 和 REST UI
-
配置 Webform REST 模块
-
处理 CORS
-
发送 API 请求
-
理解请求和响应载荷
什么是模块化内容？
由于你的网站内容存储在数据库中，因此让内容实现模块化是很有必要的。模块化意味着网站上的某些页面并不是作为完整页面手动编辑的，而是由其他内容项自动生成。例如，在农贸市场网站的场景中，你可以为食谱创建单独的内容项。如果食谱内容项包含一个字段来跟踪配料，那么你的网站就可以生成一个组合页面，用于列出食谱，并允许访问者搜索包含他们在市场上购买的某种特定配料的食谱。
页面的较小部分也可以作为组合内容生成。例如，食谱内容项可以有一个字段，用来跟踪是哪位供应商提交了食谱（参见 第 6.4 节，“概念：引用字段”），而供应商的详细信息则在单独的供应商内容项中编辑。这将使你的网站能够实现以下功能：