Atribut <crossorigin>

Atribut <crossorigin> določa, kako naj brskalnik izvede CORS zahtevo za vir, ki se nalaga z DRUGEGA izvora (druga domena, pod-domena, protokol ali port). To je pomembno, ko z zunanjih strežnikov nalagamo skripte, sloge, slike, pisave ali video. CORS (Cross-Origin Resource Sharing) je mehanizem, ki določa pravila, ali in kako se lahko viri delijo med različnimi izvor(i). Atribut <crossorigin> ima dve glavni vrednosti:

"anonymous": zahteva ne pošilja poverilnic (piškotkov, Authorization). Strežnik mora vrniti glavo Access-Control-Allow-Origin (npr. https://tvoja-domena.si ali *).
"use-credentials": zahteva pošilja poverilnice. Strežnik mora vrniti Access-Control-Allow-Origin: https://tvoja-domena.si (ne *) in Access-Control-Allow-Credentials: true.

Če vir nalagaš z istega izvora (npr. src="/..."), atribut <crossorigin> nima učinka. Za praktičen primer pripravi zunanjo JavaScript datoteko na drugi domeni ali pod-domeni in jo vključi v svoj HTML dokument z ustreznim atributom <crossorigin>.

PRIMER

<!DOCTYPE html>
<html lang="sl">
<head>
  <meta charset="UTF-8">
  <title>Primer: crossorigin (anonymous in use-credentials)</title>
  <meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
  <h1>Primer uporabe atributa crossorigin</h1>

  <p>Spodaj sta vključeni dve skripti z drugega izvora (cross-origin), vsaka z drugačnim atributom
     <code>crossorigin</code>:</p>

  <ul>
    <li><strong>anonymous</strong> – zahteva NE pošilja poverilnic (piškotkov, Authorization …). Strežnik mora vrniti
        <code>Access-Control-Allow-Origin</code> (npr. <code>https://tvoja-domena.si</code> ali <code>*</code>).</li>
    <li><strong>use-credentials</strong> – zahteva pošilja poverilnice (piškotke, Authorization …). Strežnik mora vrniti
        <code>Access-Control-Allow-Origin: https://tvoja-domena.si</code> in <code>Access-Control-Allow-Credentials: true</code>
        (tu <code>*</code> NI dovoljen).</li>
  </ul>

  <!-- 1) Brez poverilnic (anonymous) -->
  <script
    src="https://cdn.example.com/examples/html/crossorigin_sl.js"
    crossorigin="anonymous">
  </script>

  <!-- 2) S poverilnicami (use-credentials) -->
  <script
    src="https://assets.tvoja-domena.si/examples/html/crossorigin_sl.js"
    crossorigin="use-credentials">
  </script>

  <hr>

  <p>Opombe:</p>
  <ul>
    <li>Če navajaš vir z istega izvora (npr. <code>src="/pot/do/app.js"</code>), 
      <code>crossorigin</code> nima učinka.</li>
    <li>Za demonstracijo “alert” naj zunanja datoteka (na drugi domeni) vsebuje npr. 
      <code>alert('Skript naložen!')</code>. Tako boš takoj videl, da se je res naložila.</li>
    <li>Če uporabljaš Subresource Integrity (<code>integrity="sha384-…"</code>), običajno uporabi
        <code>crossorigin="anonymous"</code>.</li>
  </ul>
</body>
</html>

REZULTAT