Kort fortalt: Same-origin policy (SOP) er en fundamental sikkerhedsregel i browsere: et script på én origin må som udgangspunkt ikke læse data fra en anden origin. Formålet er at forhindre ondsindede sider i at stjæle sessioner, læse mails eller hive private API-svar ud af brugerens browser. Reglen påvirker ikke kun sikkerhed - den styrer også hvordan du må hente skrifttyper, kalde API’er og dele ressourcer mellem www, cdn og tredjepart, hvilket igen påvirker performance og kompleksitet.
Hvad består en “origin” af?
Tre dele skal matche:
- Skema - typisk
httpsvshttp(bland dem ikke; brug HSTS og konsistent redirect). - Værtsnavn -
example.dkvswww.example.dkvscdn.example.dker forskellige origins. - Port - sjældent synlig for almindelige sites, men relevant i udvikling.
Derfor er split på mange subdomæner ikke “gratis”: hver ny origin kan kræve egne TLS-handshakes og CORS-regler.
Hvorfor det rammer performance og udvikling
- Webfonts og cross-origin CSS: Browsere har særlige regler for hvordan fonter må bruges på tværs af origins; fejl giver synlige fejl i konsollen og fallback-fonte - med risiko for CLS.
- API-kald: Dit frontend på
wwwkalder måske API påapi.- så skal serveren svare med korrekte CORS-headers; ellers får du fejl der ligner “langsom side”, men er blokering. - Tredjepart: Third-party scripts lever ofte på andre origins; de påvirker INP og netværk, mens SOP/CORS styrer hvad de må læse tilbage.
CORS og “preflight”
Når browseren laver visse cross-origin requests med fetch eller XMLHttpRequest, kan den sende en OPTIONS-forespørgsel først (preflight) for at spørge serveren om metode og headers er tilladt. Det er ekstra roundtrips - sjældent dominerende alene, men i kombination med mange mikro-API-kald kan det ses på langsomme net.
Relation til SEO og indeksering
Søgemaskiner crawler ikke som en almindelig browser med alle dine cookies - men du skal stadig sikre:
- Konsistente canonical URL på tværs af
www/ ikke-wwwog parametre. - Korrekt hreflang når sprog ligger på forskellige hosts eller stier.
- At vigtigt indhold ikke kun findes bag kryds-origin API-kald uden server-side rendering, hvis Google skal se det.
SOP forklarer ikke ranking i sig selv, men fejl i kryds-origin setup kan give duplikatindhold, ødelagte feeds eller usynlig tekst.
Performance-tips i samme åndedrag
- Brug preconnect målrettet til de få kryds-origin hosts du ved bliver kritiske.
- Reducér antal unødvendige subdomæner hvis de ikke giver reel isolationsgevinst.
- Hold API og frontend kontrakter simple - færre preflights, færre overraskelser.
Relaterede begreber
- CDN - ofte et separat origin; kræver tænkt cache og CORS
- Third-party scripts
- HSTS, canonical URL
FAQ
Hvad er en origin præcist?
Samme protokol (https), samme værtsnavn og samme port. https://www.eksempel.dk og https://cdn.eksempel.dk er forskellige origins - selvom de deler ‘domæne’ i daglig tale.
Løser CORS same-origin policy?
CORS er en mekanisme hvor serveren eksplicit tillader *kryds-origin* læsning under kontrol. Uden CORS-headers bliver mange cross-origin fetch begrænset af browseren.
Næste skridt fra begreb til handling
Guides og blogindlæg der matcher begrebets emne - ud fra fælles tags og sidens fokus.
Fjern eller udsæt tunge tredjeparts scripts uden at ødelægge funktionalitet
Følg en praktisk guide til at finde, vurdere og udsætte tredjeparts scripts, så de ikke ødelægger LCP, INP og den samlede brugeroplevelse.
Sådan finder du lange tasks i DevTools og forbedrer INP
Lær hvordan du bruger DevTools til at finde lange tasks, tunge event handlers og JavaScript der gør siden træg at bruge.
Optimer cookie banner uden CLS og INP problemer
Lær hvordan du bygger eller justerer cookie bannere, så de ikke skubber indhold, blokerer interaktion eller gør siden tungere end nødvendigt.
Vary-header og caching: undgå forkert indhold og lav cache-hit-rate
Vary bestemmer hvornår caches skal gemme flere varianter af samme URL (fx gzip vs brotli eller dansk vs engelsk). Lær de typiske fejl, og hvordan du tester med headers og curl.
Sådan prioriterer du hastighedsoptimering uden at spilde tid
Lær hvordan du prioriterer hastighedsoptimering rigtigt, så du starter med de ændringer der giver mest effekt på LCP, INP, CLS og TTFB.
Hvordan tredjeparts scripts gør din hjemmeside langsom
Få overblik over hvordan chat widgets, tracking, consent, video embeds og andre tredjeparts scripts påvirker LCP, INP, CLS og TTFB.
