Verificando URLs de Mesma Origem com JavaScript

Beginner

This tutorial is from open-source community. Access the source code

Introdução

Neste laboratório, exploraremos como verificar se duas URLs estão na mesma origem usando JavaScript. Usaremos as propriedades URL.protocol e URL.host para comparar o protocolo e o host das URLs e determinar se elas pertencem ou não à mesma origem. Esta é uma habilidade útil para desenvolvedores web que precisam garantir a segurança de suas aplicações web e prevenir ataques de cross-site scripting.

Verificar se Duas URLs Estão na Mesma Origem

Para verificar se duas URLs estão na mesma origem:

  1. Abra o Terminal/SSH e digite node para começar a praticar a codificação.

  2. Use URL.protocol e URL.host para verificar se ambas as URLs têm o mesmo protocolo e host.

const isSameOrigin = (origin, destination) =>
  origin.protocol === destination.protocol && origin.host === destination.host;
  1. Crie dois objetos URL com as URLs que você deseja comparar.
const origin = new URL("https://www.30secondsofcode.org/about");
const destination = new URL("https://www.30secondsofcode.org/contact");
  1. Chame a função isSameOrigin com os dois objetos URL como argumentos para obter uma saída booleana.
isSameOrigin(origin, destination); // true
  1. Você também pode testar a função com outras URLs para ver se elas estão na mesma origem ou não.
const other = new URL("https://developer.mozilla.org");
isSameOrigin(origin, other); // false

Resumo

Parabéns! Você concluiu o laboratório de URLs de mesma origem. Você pode praticar mais laboratórios no LabEx para aprimorar suas habilidades.