解码base64 URL并嵌入HTML

Question

I want make like this http://www.jredtna.com/read/?hash=cGxheWVyIDEgPT4gaHR0cHM6Ly93d3cueW91dHViZS5jb20vZW1iZWQvZmgwUUQtV1dyY2MKcGxheWVyIDIgPT4gaHR0cHM6Ly93d3cueW91dHViZS5jb20vZW1iZWQvMk1wVWotQXVhNDg=

(You can't see iframe because website using cookies to check if you coming from another website).

So please join here http://halqat.online/video/watch.php?vid=6f673f4c5 and click red play button to see what I mean.

When decode hash= by base64:

cGxheWVyIDEgPT4gaHR0cHM6Ly93d3cueW91dHViZS5jb20vZW1iZWQvZmgwUUQtV1dyY2MKcGxheWVyIDIgPT4gaHR0cHM6Ly93d3cueW91dHViZS5jb20vZW1iZWQvMk1wVWotQXVhNDg=

will give us like this:

player 1 => https://www.youtube.com/embed/fh0QD-WWrcc

player 2 => https://www.youtube.com/embed/2MpUj-Aua48

My question is how I can do like that:

Get hash=Base64URL

Decode it and split "player 1" and "youtube url" by =>

Put data inside html like this

<div class="embeding">
  <ul>
      <li><a data-src="https://www.youtube.com/embed/fh0QD-WWrcc">player 1</a></li>
      <li><a data-src="https://www.youtube.com/embed/2MpUj-Aua48">player 2</a></li>
  </ul>
</div>

and auto add li a if find another players

Answer 1

I use splice method to make an array and then from this array I get the youtube url's strings via split method.

function decodeBase_64(arg){ 
  var decodedData=window.atob(arg);
  var a;
  var c=[];  
  for(var i=0;i<decodedData.split('=>').length;i++){
    if(decodedData.split('=>')[i].length>10){      
      a=decodedData.split('=>')[i];
      a=a.substr(0, 42);
      c.push(a);
    }
  }
   return c; 
}
document.getElementById('player_1').setAttribute('data-src',decodeBase_64('cGxheWVyIDEgPT4gaHR0cHM6Ly93d3cueW91dHViZS5jb20vZW1iZWQvZmgwUUQtV1dyY2MKcGxheWVyIDIgPT4gaHR0cHM6Ly93d3cueW91dHViZS5jb20vZW1iZWQvMk1wVWotQXVhNDg=')[0] );
document.getElementById('player_2').setAttribute('data-src',decodeBase_64('cGxheWVyIDEgPT4gaHR0cHM6Ly93d3cueW91dHViZS5jb20vZW1iZWQvZmgwUUQtV1dyY2MKcGxheWVyIDIgPT4gaHR0cHM6Ly93d3cueW91dHViZS5jb20vZW1iZWQvMk1wVWotQXVhNDg=')[1] );

console.log(decodeBase_64('cGxheWVyIDEgPT4gaHR0cHM6Ly93d3cueW91dHViZS5jb20vZW1iZWQvZmgwUUQtV1dyY2MKcGxheWVyIDIgPT4gaHR0cHM6Ly93d3cueW91dHViZS5jb20vZW1iZWQvMk1wVWotQXVhNDg='));
console.log(decodeBase_64('cGxheWVyIDEgPT4gaHR0cHM6Ly93d3cueW91dHViZS5jb20vZW1iZWQvZmgwUUQtV1dyY2MKcGxheWVyIDIgPT4gaHR0cHM6Ly93d3cueW91dHViZS5jb20vZW1iZWQvMk1wVWotQXVhNDg=')[0]);
console.log(decodeBase_64('cGxheWVyIDEgPT4gaHR0cHM6Ly93d3cueW91dHViZS5jb20vZW1iZWQvZmgwUUQtV1dyY2MKcGxheWVyIDIgPT4gaHR0cHM6Ly93d3cueW91dHViZS5jb20vZW1iZWQvMk1wVWotQXVhNDg=')[1]);

<div class="embeding">
  <ul>
      <li><a data-src="" id="player_1">player 1</a></li>
      <li><a data-src="" id="player_2">player 2</a></li>
  </ul>
</div>

Check the console to see the c array

For the second issue..Get the her via window.location.href and then

var str='http://www.jredtna.com/read/?hash=cGxheWVyIDEgPT4gaHR0cHM6Ly93d3cueW91dHViZS5jb20vZW1iZWQvZmgwUUQtV1dyY2MKcGxheWVyIDIgPT4gaHR0cHM6Ly93d3cueW91dHViZS5jb20vZW1iZWQvMk1wVWotQXVhNDg=';
str=str.substring(str.indexOf("hash="));
str=str.replace('hash=','');
console.log(str);

</div>