背景
跨域请求（Cross-Origin Resource Sharing，CORS）是 Web 应用程序中经常遇到的问题之一。在前端应用程序中使用 GraphQL API 时，CORS 可能会成为一个问题。GraphQL 本身支持 CORS，但是需要配置才能使用。本文将介绍如何在 GraphQL 中使用 CORS 跨域请求。
CORS 是什么？
CORS 是一种实现跨域请求的机制。跨域请求指的是在一个域名下的页面，通过 AJAX 访问另一个域名下的资源。跨域请求可以是异步请求，也可以是同步请求。如果没有跨域请求机制，浏览器会阻止这种请求。
CORS 的实现是通过 HTTP 的头部来通信的。CORS 在浏览器和服务器之间会添加一个额外的 HTTP 头部，用来说明请求是可以接受的。这个 HTTP 头部被称为“Access-Control-Allow-Origin”，它允许来自特定域的请求访问资源。
在 GraphQL 中使用 CORS
使用 GraphQL 进行跨域请求需要在 GraphQL 服务器上启用 CORS。在大多数情况下，GraphQL 服务器的 CORS 功能默认是禁用的，需要在配置文件或代码中启用。
启用 CORS 只需要在 GraphQL 服务器上添加一个 HTTP 头部。这个头部指示浏览器接受来自指定域的请求。下面是一个启用 CORS 功能的 GraphQL 服务器的示例：
-- -------------------- ---- ------- ----- ------- - ------------------- ----- - ----------- - - --------------------------- ----- ---- - ---------------- ----- --- - ---------- ----- ------ - ---- -- ---- ------- ------ ---------------- ------------------- ------------- ------- ---- ---------------- -- -- ---------------- ------ -- --------------------------
这个示例中，我们使用了 Express.js 作为我们的 GraphQL 服务器。我们通过调用 app.use(cors()) 启用了 CORS 功能。这样，浏览器就可以从任何域向我们的 GraphQL 服务器发起请求。如果你使用的是其他 GraphQL 服务器，你需要查看对应服务器文档以了解如何启用 CORS。
结论
本文介绍了在 GraphQL 中使用 CORS 跨域请求的方法。使用 CORS 可以让我们在前端应用程序中使用 GraphQL API 更加便捷。如果你正在构建一个使用 GraphQL API 的前端应用程序，请考虑启用 CORS 功能。
希望这篇文章对你有所帮助！如果你有任何问题或建议，请在评论区留言！
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/67512c918bd460d3ad872b1c