CORS(Cross-Origin Resource Sharing)是一种安全策略,用于限制 Web 应用程序如何使用来自其他源的资源。如果你正在开发一个使用 Deno 的前端应用程序,并且需要访问来自其他域的资源,就会面临 CORS 问题。在本文中,我们将学习如何在 Deno 中控制 CORS。
Deno 中的 CORS
Deno 通过提供 --allow-net
权限来允许网络连接。但是,在默认情况下,Deno 不允许跨域请求。这意味着如果你正在尝试从另一个域请求资源,你将会遇到 CORS 问题。如果你尝试这样的请求,将会看到以下错误:
Access to fetch at 'http://localhost:3000/data' from origin 'http://localhost:8000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
这是由于浏览器安全机制所致。浏览器会检查响应头中是否包含 Access-Control-Allow-Origin
,这个头告诉浏览器是否允许跨域请求。如果没有这个头或者这个头的内容与当前域不匹配,浏览器就会阻止请求。
解决 CORS 问题
解决 CORS 问题的一种常用方式是为响应添加 Access-Control-Allow-Origin
头,并设置为允许跨域请求的源。你可以在服务器上配置这个头,或者在客户端中添加。
在 Deno 中,我们可以通过处理器函数来控制 CORS。处理器函数可以在请求到达之前或响应发送之前对请求和响应进行更改,这就为我们提供了控制 CORS 的机会。
让我们看一个控制 CORS 的处理器函数示例:
-- -------------------- ---- ------- ------ - ----- - ---- --------------------------------------- ----- ------ - ------- ----- ---- --- -------------------------------------- --- ----- ------ --- -- ------- - ----- ------- - --- ---------- ------------------------------------------ ----- ------------ ------------------------------- ----- ----- ---- ------- -------- -- ------------------------------------------- ---------------- -- ----------- --- ---------- - ------------- ------- ---- -------- --- - ---- - ------------- -------- ----- ------ ------- --- - -
在这个示例中,我们创建了一个处理器函数,它对接收到的每个请求响应时都添加了适当的 Access-Control-Allow-*
头。如果请求方法是 OPTIONS(即预检请求),则只返回包含允许的方法、头和源信息的头部响应。否则,我们以如上的函数和响应主体来响应请求。
我们可以通过在已启动这个服务器的命令行中添加 --allow-net
权限来运行此示例。
这段代码添加了允许任何源访问我们的服务器的头。在实际生产环境中,请考虑更细粒度地控制允许访问的源,以避免安全风险。例如,你可以在请求头中发送一个 token,允许特定的来源,或者使用 Deno 提供的安全 API 接口实现访问控制,以便只允许受信任的来源访问。
结论
CORS 是一个重要的 Web 应用程序安全特性,可在 Deno 中使用处理器函数轻松控制。我们可以为响应添加 Access-Control-Allow-*
头来允许来自其他源的资源访问,以从其他源请求资源,并确保请求和响应的头和主体正确处理,来控制跨域访问。
来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/6700e7b30bef792019add4d3