跨域请求是前端开发中常见的问题，尤其是在开发 Web 应用时，我们经常需要从不同的域名或端口请求数据。然而，由于浏览器的同源策略限制，跨域请求是不被允许的。为了解决这个问题，我们可以使用 CORS（Cross-Origin Resource Sharing）技术来实现跨域请求。
在 Hapi 框架中，我们可以通过安装 hapi-cors 插件来集成 CORS。本文将介绍如何在 Hapi 框架中集成 CORS 实现跨域请求。
安装 hapi-cors 插件
首先，我们需要在 Hapi 项目中安装 hapi-cors 插件。可以使用 npm 安装：
--- ------- --------- ------
配置 CORS
安装完成后，我们需要在 Hapi 项目中配置 CORS。可以在启动服务器之前，使用 server.register 方法注册插件并配置 CORS：
----- ---- - ----------------------
----- ----------- - -----------------------------
----- ---- - ----- -- -- -
----- ------ - -------------
----- -----
----- -----------
---
----- -----------------
------- ---------------------
-------- -
-------- ------
-------- ---------- ---------------- --------------- ---------------- -------------------
------- ------
------------ -----
------- -------------------- ------------------------
------------------ ------------------------------- ------------------------------- ------------------------------------
------------------------- -------------------- ------------------------
-------------- -
----- -----
---- -
- ------- ----------- -
-
-
-
---
----- ---------------
------------------- ------- -- ---- -----------------
--
-------在上面的代码中，我们使用 server.register 方法注册 hapi-cors 插件，并在 options 中配置了 CORS 的相关选项。其中，origins 表示允许的来源，可以是一个数组或字符串，这里我们设置为 '*'，表示允许任何来源。headers 表示允许的请求头，maxAge 表示预检请求的有效时间，credentials 表示是否允许发送凭证信息，expose 表示允许的响应头，additionalHeaders 和 additionalExposedHeaders 分别表示额外的请求头和响应头。最后，我们在 routeDefaults 中开启了 CORS，并使用了一个预处理函数 corsHeaders，该函数用于设置响应头。
示例代码
下面是一个简单的示例代码，演示了如何在 Hapi 项目中使用 CORS 实现跨域请求：
----- ---- - ----------------------
----- ---- - ----- -- -- -
----- ------ - -------------
----- -----
----- -----------
---
----- -----------------
------- ---------------------
-------- -
-------- ------
-------- ---------- ---------------- --------------- ---------------- -------------------
------- ------
------------ -----
------- -------------------- ------------------------
------------------ ------------------------------- ------------------------------- ------------------------------------
------------------------- -------------------- ------------------------
-------------- -
----- ----
-
-
---
--------------
------- ------
----- ------------
-------- --------- -- -- -
------ - ----- ------- ------- --
-
---
----- ---------------
------------------- ------- -- ---- -----------------
--
-------在上面的代码中，我们在 Hapi 项目中开启了一个 /api/data 的路由，用于返回数据。由于我们在配置中开启了 CORS，因此该路由可以被跨域请求。在客户端代码中，我们可以使用以下代码进行请求：
---------------------------------------
-------------- -- ----------------
---------- -- -------------------总结
本文介绍了如何在 Hapi 框架中集成 CORS 实现跨域请求。在开发 Web 应用时，跨域请求是一个常见的问题，使用 CORS 技术可以很好地解决这个问题。通过本文的介绍，读者可以了解到如何在 Hapi 项目中使用 hapi-cors 插件配置 CORS，并包含了示例代码进行演示。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/65f1957f2b3ccec22fa3aed2