在前端开发中，跨域请求是一个常见的问题。由于浏览器的同源策略，不同域名或端口的网站之间无法直接通信。在 Hapi 框架中，我们可以使用 CORS（Cross-Origin Resource Sharing）来处理跨域请求。本文将详细介绍 Hapi 框架中如何使用 CORS 处理跨域请求，并提供示例代码。
什么是 CORS？
CORS（Cross-Origin Resource Sharing）是一种机制，它允许网页向不同的源发出 XMLHttpRequest 请求。它是通过添加一些 HTTP 头来告诉浏览器，哪些源可以访问哪些资源。CORS 是由 W3C 标准化的，目前被所有现代浏览器支持。
Hapi 框架中如何使用 CORS？
在 Hapi 框架中，我们可以使用 hapi-cors 插件来实现 CORS 功能。hapi-cors 插件是一个 Hapi 插件，它提供了一些配置选项，可以轻松地配置 CORS 功能。
安装 hapi-cors 插件
要使用 hapi-cors 插件，我们需要先安装它。可以使用 npm 命令进行安装：
npm install hapi-cors --save
注册 hapi-cors 插件
安装好 hapi-cors 插件后，我们需要在 Hapi 服务器中注册它。可以使用 server.register() 方法进行注册：
-- -------------------- ---- -------
----- ---- - ----------------
----- ------ - --- --------------
----- ------- - -
--------------------
--
------------------------ ----- -- -
-- ----- -
--------------------- -- ---- --------- -----
-
---配置 hapi-cors 插件
注册好 hapi-cors 插件后，我们需要配置它。hapi-cors 插件提供了一些配置选项，可以通过配置选项来控制 CORS 功能的行为。
下面是一些常用的配置选项：
- origins：指定允许的源。可以是字符串、数组或函数。如果是字符串或数组，则表示允许的源；如果是函数，则表示根据请求动态判断允许的源。默认为
'*'，表示允许所有源。 - methods：指定允许的 HTTP 方法。可以是字符串、数组或函数。如果是字符串或数组，则表示允许的 HTTP 方法；如果是函数，则表示根据请求动态判断允许的 HTTP 方法。默认为
['GET', 'POST', 'PUT', 'DELETE']。 - headers：指定允许的 HTTP 头。可以是字符串、数组或函数。如果是字符串或数组，则表示允许的 HTTP 头；如果是函数，则表示根据请求动态判断允许的 HTTP 头。默认为
['Authorization', 'Content-Type']。 - exposedHeaders：指定允许客户端访问的响应头。可以是字符串、数组或函数。如果是字符串或数组，则表示允许客户端访问的响应头；如果是函数，则表示根据请求动态判断允许客户端访问的响应头。默认为
false，表示不允许客户端访问任何响应头。 - maxAge：指定预检请求的有效期（单位为秒）。默认为
86400，表示预检请求的有效期为一天。 - credentials：指定是否允许发送凭据（例如 cookie）到服务器。默认为
false，表示不允许发送凭据。
下面是一个简单的配置示例：
-- -------------------- ---- -------
-----------------
------- ---------------------
-------- -
-------- --------------------------
-------- ------- ------- ------ ----------
-------- ----------------- ----------------
--------------- ------------------ ---------
------- ---
------------ ----
-
---使用 hapi-cors 插件
注册并配置好 hapi-cors 插件后，我们就可以使用它了。hapi-cors 插件会自动处理所有跨域请求，并添加必要的 HTTP 头。我们不需要编写额外的代码来处理跨域请求。
下面是一个简单的路由示例：
server.route({
method: 'GET',
path: '/hello',
handler: (request, h) => {
return 'Hello, world!';
}
});如果我们在前端页面中使用 XMLHttpRequest 发送跨域请求，hapi-cors 插件会自动添加必要的 HTTP 头，从而使跨域请求成功。
const xhr = new XMLHttpRequest();
xhr.open('GET', 'http://localhost:8000/hello');
xhr.withCredentials = true;
xhr.send();总结
本文介绍了 Hapi 框架中如何使用 hapi-cors 插件处理跨域请求。我们学习了 hapi-cors 插件的安装、注册和配置，并提供了示例代码。通过本文的学习，我们可以轻松地使用 hapi-cors 插件来处理跨域请求，从而提高前端开发的效率。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6630c301d3423812e4ea189f