When I request my file like in the given code example (ES6 import) either using chromium or firefox I get the corresponding request on the server-side but as opposed to the "normal" script load (by script tag with src) cookies are not provided in the header, is that normal? And if so: How am I supposed to relate this request to a session if I have cookie based authentication?

Does not work - Because Browser does not send established cookie with the request:

<script type="module">
  import '/index.js';
</script>

Works - Browser sends cookie with the request:

<script src="/index.js">
</script>

When I request my file like in the given code example (ES6 import) either using chromium or firefox I get the corresponding request on the server-side but as opposed to the "normal" script load (by script tag with src) cookies are not provided in the header, is that normal? And if so: How am I supposed to relate this request to a session if I have cookie based authentication?

Does not work - Because Browser does not send established cookie with the request:

<script type="module">
  import '/index.js';
</script>

Works - Browser sends cookie with the request:

<script src="/index.js">
</script>

• javascript
• cookies
• session-cookies
• chromium
• es6-modules

2 Answers 2

I figured it out myself:

You have to add the "crossorigin" attribute to the script tag:

<script type="module" crossorigin>
  import '/index.js';
</script>

This is because es6 module import somehow goes under CORS even if the request for the module script goes to same-origin. And CORS does not send credentials for module script requests. ...Unless you put the crossorigin attribute.

This article of Jack Archibald helped me a lot (The browser issues mentioned naturally aren't quite up to date anymore):

https://jakearchibald./2017/es-modules-in-browsers/

You can put the cookies on the window to make it visible, otherwise the browser only sends headers with requests. Something like...

const window.cookie = document.cookie;