How to decode base64 html inside HTML?

Question

Sorry but I've been searching everywhere for a solution and I haven't found anything, so I have no idea on how to solve this.

I have an encoded base64 which I need to place inside a html file and then decode it when the page loads. I've seen before that it is possible, but I can't remember how to do that.

This is my encoded code:

PGRpdiBpZD0idGhlZGl2Ij4NCjxpbWcgc3JjPSJodHRwczovL21lZGlhLmdpcGh5LmNvbS9tZWRpYS9oTTg3RE1ubHM1b1p5L2dpcGh5LmdpZiIvPg0KPGEgcmVsPSJodHRwOi8vZ29vZ2xlLmNvbSI+R29vZ2xlIElOQzwvYT48YnIgLz4NCjwhLS08aW1nIHNyYz0iaHR0cHM6Ly9tZWRpYS5naXBoeS5jb20vbWVkaWEvaE04N0RNbmxzNW9aeS9naXBoeS5naWYiLz4tLT4NCjwvZGl2Pg==

because I need to encode the HTML too. Also, that code is just a sample. — user9459537, Apr 20 '18 at 00:20
Possible duplicate of [Base64 encoding and decoding in client-side Javascript](https://stackoverflow.com/questions/2820249/base64-encoding-and-decoding-in-client-side-javascript) — Joshua R., Apr 20 '18 at 00:21
You know you can just set the `src` to the base64 string right? — Darkrum, Apr 20 '18 at 00:30

Seanvm · Answer 1 · 2018-04-20T00:26:32.480

5

You can use javascript: atob()

var decodedHTML = window.atob('PGRpdiBpZD0idGhlZGl2Ij4NCjxpbWcgc3JjPSJodHRwczovL21lZGlhLmdpcGh5LmNvbS9tZWRpYS9oTTg3RE1ubHM1b1p5L2dpcGh5LmdpZiIvPg0KPGEgcmVsPSJodHRwOi8vZ29vZ2xlLmNvbSI+R29vZ2xlIElOQzwvYT48YnIgLz4NCjwhLS08aW1nIHNyYz0iaHR0cHM6Ly9tZWRpYS5naXBoeS5jb20vbWVkaWEvaE04N0RNbmxzNW9aeS9naXBoeS5naWYiLz4tLT4NCjwvZGl2Pg==');

If you console.log out decodedHTML you will see your html, which you can then place into an element using javascript.

Ex: document.querySelector('#someDiv').innerHTML = decodedHTML;

edited Apr 20 '18 at 00:26

answered Apr 20 '18 at 00:19

Seanvm

394
1
9

There is one problem, I checked the source code and the code is showing decoded. I need the code to show encoded inside the source code. I saw somewhere that It is possible... – user9459537 Apr 20 '18 at 00:30
@user9459537 - my guess is that by 'source code' you mean that you opened the code inspector in your browser (dev tools -> inspector). Well, you can't have a *working* html code which is in the same time "encoded". You can obfuscate it, but it will always be easy to unobfuscate. Waste of time. But if you really need it - google "html obfuscate" or something... – konrados Apr 20 '18 at 00:46
That's what I was looking for. It's not a definitive solution, but at least it makes things a bit harder since the download link has to be unlocked first after the user share the content. – user9459537 Apr 20 '18 at 00:56

How to decode base64 html inside HTML?

1 Answers1