Как зашифровать якорь в URL на JS?

Question

[Frezer]

Мне необходимо шифровать якорь в URL на JS, а потом расшифровать используя специальный ключ.
Пример: example.com/#youtext
Примерно как должно быть: example.com/#eW91dGV4dA

Answer 1

[Дмитрий Дерепко]

alert(window.location.hash);

Comments

[Frezer]

ну и как его зашифровать?

[Andrey Suha]

Frezer, Вам библиотека нужна? Так это можно на гуглить, если проблема не в этом, то опишите подробнее, а то не совсем ясно в чем конкретно проблема

[Дмитрий Дерепко]

<a href="my-url#hashqwE@fqf">Click me</a>

const hash = window.location.hash;
const value = hashDecode(hash);

Какой алгоритм кодирования/декодирования хотите использовать, выбирать вам.
На скорую руку нашел статью https://itchief.ru/lessons/javascript/javascript-m...

[Ihor Bratukh]

Frezer, как угодно но разгадать эту тайну веков можно будет за 10 минут иследуя исходный код твоего фронта, так как все что есть на фронте остается на фронте

function endcodeBase64(value) {
    return btoa(unescape(encodeURIComponent(value)));
}

function decodeBase64(value) {
    return decodeURIComponent(escape(atob(value)));
}

[Frezer]

Дмитрий Дерепко, не надёжный

[Frezer]

Ihor Bratukh, это не такая уж и тайна

[Дмитрий Дерепко]

Frezer, напишите надёжный, я же вам показал пример.
https://gist.github.com/jo/8619441

[Frezer]

Дмитрий Дерепко, что то не пойму

Answer 2

[Сергей Соколов]

Можно примитивно XOR'ить «секретный» пароль и строку. Очень ненадёжно, как и вся затея с хранением ключа шифрования в клиентском скрипте. Тем не менее, вот пример. При смене хэша он заменяется на шифрованную строку. начинающуюся с восклицательного знака - отличительный признак. Если так же вставить хэш с воскл. знаком - он дешифруется и заменится исходной строкой:

((w) => {

  function superpooper(secret) {
    const pass = encodeURIComponent(secret);
    return function onHashChange(){
      var hash = w.location.hash.replace(/^#/,"");
      if (!hash.length) return;
      
      const xor = s => s.split('').map((c,i)=>String.fromCharCode(c.charCodeAt(0)^pass.charCodeAt(i%pass.length))).join('');
  
      if (hash[0]==='!') {
        hash = hash.substring(1);
        const decoded = decodeURIComponent(xor(atob(hash)));
        history.replaceState(null, null, document.location.pathname + '#' + decoded);
      } else {
        const encoded = btoa(xor(encodeURIComponent(hash)));
        history.replaceState(null, null, document.location.pathname + '#!' + encoded);
      }
    }
  }

  w.addEventListener("hashchange", superpooper("abrakadabra"), false);
  
})(window)

Если запустить через консоль и в текущей вкладке добавить, например, хэш
#Моё секретное сообщение оно тут же заменяется на

!RFBHJVtEVlRbMURTVzZRTlNRIydXU1QmQ0RZVF1QR0BUU1JXU14lVURQR1lQR0BUL1FBU1cwVERQRyVbRFZUIDNEU1c2UE5TUVlSV1NUJkJEWVQmVEdAVCVTV1NeWVZEUEclUUdAVCklQVNXNlFEUEcjLkRWVCZCRFNXMFROU1FTUldTVCZDRFlUXFBHQFQlUldTXiMhRFBHJVFHQFQpJEFTVzZRRFBHI1pEVlQmQ0RTV0pYTlNRJVJXU1QgR0RZVCBRR0BUIyZXU14lVERQRyNZR0BUL1FBU1cwVA==

И наоборот, если в странице добавить этот длинный хэш, он заменится на «Моё секретное вот это вот всё».
Ключ шифрования тут abrakadabra
Увеличение длины получается из-за того, что прогоняю через encodeURIComponent(), чтобы нормально работало с кириллицей, смайликами и emoji.

Исходный пример это простой binhex

у вас похоже на binhex: btoa('youtext') // "eW91dGV4dA==" – тут никаких ключей не требуется.

atob("eW91dGV4dA==") // "youtext"

Comments

[Frezer]

Это у вас похоже на binhex: btoa('youtext') // "eW91dGV4dA==" – тут никаких ключей не требуется.

А должны требоваться!