Question

在典型的模块脚本中

<script type="module" crossorigin="use-credentials">
    import {App} from './js/app.js';
    const app = new App();
    app.init();
</script>

Chrome，Safari和Edge在加载时没有任何问题，Cookie会随请求js/app.js发送。 FireFox 58（dom.moduleScripts.enabled设置为true）不附加cookie。即使是那些没有标记为HttpOnly的人。如果未指定use-credentials，则Chrome无法发送。

由于许多网络应用以302重定向到登录页面进行响应，因此控制台中的典型反应为Loading failed for the <script> with source “http://localhost/js/app.js”.或类似。

当然，有很多方法可以在服务器端解决它：允许JS模块不需要安全检查，或者将auth令牌放入URL查询中。但它看起来并不正确。

我想要了解的是，它背后的逻辑有明确的指导吗？它曾经是同一个来源的请求，无论资源类型如何，都带有所有的cookie。为什么模块会有所不同？是否有一个魔术属性使其在cookie方面的行为与通常的<script type="text/javascript" src=...></script>相同？

Answer 1

问题在FireFox 60.x.x中得到修复 - 它使用crossorigin="use-credentials"属性集正确附加了cookie，与其他浏览器一致，因此，它一定是个bug。此外，默认情况下dom.moduleScripts.enabled为真，因此，即使您在服务器上检查会话Cookie，也可以安全地使用以下模块：Chrome / Chromium，Firefox，Safari和Edge（16+）。

背后的逻辑包括crossorigin =＆＃34; use-credentials＆＃34;类似于Fetch API使用的那个，在这里有些解释MDN CORS Settings。

我想在标签上使用type="module"会使浏览器根本不使用CORS，结果这些请求始终是匿名的，并且没有安全cookie。唯一的选择是遵循CORS指南。

浏览器中的ES6模块加载程序忽略cookie

1 个答案: