CORS（跨域资源共享）是一种用于跨域访问 Web 资源的技术。在前端开发中，我们经常需要使用 CORS 来处理跨域请求。在 Hapi 中，设置 CORS 可以帮助我们更好地管理跨域资源访问。
本文将介绍 Hapi 中的 CORS 设置技巧，包括如何设置 CORS，如何处理预检请求，以及如何使用 Hapi-cors 插件等。通过本文的学习，你将能够更好地掌握 Hapi 中的 CORS 技术，并在实际开发中灵活应用。
什么是 CORS？
在 Web 开发中，由于浏览器的同源策略限制，不同域名下的网页无法访问彼此的资源。CORS 技术可以通过在服务端设置响应头信息，允许跨域资源访问。
CORS 的实现过程包括两个步骤：
- 浏览器发出跨域请求；
- 服务端返回响应，并设置 CORS 相关的响应头信息。
在 Hapi 中，我们可以通过设置路由的 CORS 选项来设置响应头信息，从而实现跨域资源访问。
如何设置 CORS？
在 Hapi 中，我们可以通过在路由选项中设置 cors 选项来设置 CORS。cors 选项可以是一个布尔值，也可以是一个对象。当 cors 为 true 时，表示允许所有跨域请求；当 cors 为一个对象时，我们可以设置更加详细的跨域策略。
下面是一个简单的示例，演示了如何在 Hapi 中设置 CORS：
----- ---- - ----------------------
----- ---- - ----- -- -- -
----- ------ - -------------
----- -----
----- -----------
---
--------------
------- ------
----- ----
-------- --------- -- -- -
------ ------ --------
--
-------- -
----- ----
-
---
----- ---------------
------------------- ------- -- ---- -----------------
--
-------在上面的示例中，我们设置了一个路由，当访问根路径时，返回一个字符串。在路由选项中，我们设置了 cors 为 true，表示允许所有跨域请求。这样，我们就可以通过跨域访问该路由了。
如何处理预检请求？
在进行跨域资源访问时，浏览器会先发出一个预检请求（Preflight Request），以确定服务器是否允许跨域访问。预检请求是一种 OPTIONS 请求，其中包含了请求头和请求方法等信息。
在 Hapi 中，默认情况下，预检请求会被自动处理，并返回一个带有 CORS 相关响应头信息的响应。不过，我们也可以通过设置路由选项来自定义预检请求的处理方式。
下面是一个示例，演示了如何在 Hapi 中自定义预检请求的处理方式：
----- ---- - ----------------------
----- ---- - ----- -- -- -
----- ------ - -------------
----- -----
----- -----------
---
--------------
------- -------
----- ----
-------- --------- -- -- -
------ ------ --------
--
-------- -
----- -
------- ------
-------- ------------------
------------------ ------------------
------- ---
------------------ ------
--------------------- ---
-
-
---
----- ---------------
------------------- ------- -- ---- -----------------
--
-------在上面的示例中，我们设置了一个路由，当访问根路径时，返回一个字符串。在路由选项中，我们设置了 cors 为一个对象，其中包含了多个跨域策略的配置项。其中，preflightContinue 为 false，表示当预检请求失败时，不会继续处理请求。
如何使用 Hapi-cors 插件？
Hapi-cors 是一个 Hapi 插件，可以帮助我们更加方便地处理跨域资源访问。通过使用 Hapi-cors 插件，我们可以简化跨域策略的设置，并自动处理预检请求等。
下面是一个示例，演示了如何在 Hapi 中使用 Hapi-cors 插件：
----- ---- - ----------------------
----- -------- - ---------------------
----- ---- - ----- -- -- -
----- ------ - -------------
----- -----
----- -----------
---
----- -----------------
------- ---------
-------- -
-------- -----
-
---
--------------
------- ------
----- ----
-------- --------- -- -- -
------ ------ --------
-
---
----- ---------------
------------------- ------- -- ---- -----------------
--
-------在上面的示例中，我们首先引入了 Hapi-cors 插件，并在注册插件时，设置了 origins 为 ['*']，表示允许所有跨域请求。在路由中，我们不需要再设置 cors 选项了，因为 Hapi-cors 插件已经自动处理了跨域策略。
总结
本文介绍了 Hapi 中的 CORS 设置技巧，包括如何设置 CORS、如何处理预检请求，以及如何使用 Hapi-cors 插件等。通过本文的学习，你已经掌握了 Hapi 中的 CORS 技术，并可以在实际开发中灵活应用。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/658041e8d2f5e1655db6fd84