Problems activating your account? Send notification email to: [email protected]
Host4Fun Budget VPS Hosting
Thread Rating:
  • 0 Vote(s) - 0 Average
  • 1
  • 2
  • 3
  • 4
  • 5
Hide iframe src from view source?
#1
Hello everyone, I have a question that is there anyway to hide a src iframe from view source? I have searched many sources online but have yet to find the best answer, I have this code but it is not completely hidden, although <iframe id = "embed1" src = "" frameborder = "0" allowfullscreen> </iframe> but it is still visible in javascript

Here is my code:
<?php $servers[$i] = $numerado; $src[$i] = $dato; ?>
 <iframe id="embed<?php echo $servers[$i]; ?>" src="" frameborder="0" allowfullscreen></iframe>
<script>
function myFunction() {setTimeout(function myFunction() {<?php $i = 0; { while( $i <= (count($servers) - 1) ): ?>document.getElementById("embed<?php echo $servers[$i]; ?>").setAttribute("src", "<?php echo $src[$i]; ?>");<?php $i++; endwhile; } ?>}, 1);}myFunction();
</script>

And this is view source:
[Image: e665KF4.png]
Please help me, thanks so much
Reply
#2
(09-07-2020, 08:02 PM)hopphim95 Wrote:  Hello everyone, I have a question that is there anyway to hide a src iframe from view source? I have searched many sources online but have yet to find the best answer, I have this code but it is not completely hidden, although <iframe id = "embed1" src = "" frameborder = "0" allowfullscreen> </iframe> but it is still visible in javascript

Here is my code:
<?php $servers[$i] = $numerado; $src[$i] = $dato; ?>
 <iframe id="embed<?php echo $servers[$i]; ?>" src="" frameborder="0" allowfullscreen></iframe>
<script>
function myFunction() {setTimeout(function myFunction() {<?php $i = 0; { while( $i <= (count($servers) - 1) ): ?>document.getElementById("embed<?php echo $servers[$i]; ?>").setAttribute("src", "<?php echo $src[$i]; ?>");<?php $i++; endwhile; } ?>}, 1);}myFunction();
</script>

And this is view source:
[Image: e665KF4.png]
Please help me, thanks so much

As a developer, you should never expect/assume/count on things to be hidden On the Web. Of course, you can apply different obfuscation techniques to somehow make it difficult for things to be leaked, especially to the casual users and as long as you acknowledge that Savvy ones with Web development expertise can't be duped!..

Now that this is out of the way, I have a couple of tips on how to address your issue (ie hide a src iframe from view source.) The first way is to avoid using inline JavaScript code; always load JavaScript code as independent files (from the HTML markup.)

The second way is to remove the iframe markup from the HTML file and construct it dynamically with JavaScript, pretty standard and straightforward way for any average front-end Web developer.

Good luck!
Reply
#3
(09-08-2020, 03:43 AM)fChk Wrote:  As a developer, you should never expect/assume/count on things to be hidden On the Web. Of course, you can apply different obfuscation techniques to somehow make it difficult for things to be leaked, especially to the casual users and as long as you acknowledge that Savvy ones with Web development expertise can't be duped!..

Now that this is out of the way, I have a couple of tips on how to address your issue (ie hide a src iframe from view source.) The first way is to avoid using inline JavaScript code; always load JavaScript code as independent files (from the HTML markup.)

The second way is to remove the iframe markup from the HTML file and construct it dynamically with JavaScript, pretty standard and straightforward way for any average front-end Web developer.

Good luck!

Can you give me some specific references on the 2nd way you say it?
Reply
#4
Hiding Javascript and Html Element Is Difficult , because Browser must Read the javascript and HTML information to show The Website. Maybe You can use :
  • Javascript-Obfuscatorto make the javascript difficult to read by normal people ,
  • or the other alternative is hiding your Javascript in the other .js file .
  • Or Make It Server Site, maybe with AJAX, so when document ready, the page will make request to AJAX, and return set src for the Iframe.
See other Reference : https://www.quora.com/How-do-you-hide-an...ource-code
Sorry for My Bad English
I am Web Developer || Python, NodeJs, C# Programer
My Fiverr Profile
Reply
#5
Easy way to do it would be BASE64. It's simple encoding/obfuscation that will not fool experts or advanced user but any other normal user will not have a clue of what they see.

- http://tech.rickumali.com/blog/2011/05/2...and-base64
Reply
#6
@Hidden Refuge , about hiding iframe link with BASE64. After opening the reference link, When i try to Using it , it look like not work on me , or i doing it wrong? , This is my code :


<iframe src="data:text/html;charset=utf-8;base64,aHR0cHM6Ly93d3cuYmFzZTY0ZW5jb2RlLm9yZy8=" height="200" width="300" title="Iframe Example"></iframe>

Note : Original Link is https://www.base64encode.org/ , i encode it and the result is aHR0cHM6Ly93d3cuYmFzZTY0ZW5jb2RlLm9yZy8=
Sorry for My Bad English
I am Web Developer || Python, NodeJs, C# Programer
My Fiverr Profile
Reply
#7
You may want to look for reference material where what you wish to do has already been done.

- https://base64.guru/developers/html/iframe
- https://base64.guru/converter/encode/html

You have to embed BASE64 data instead of simply encoding some text to BASE64. BASE64 data is different than just a encoded plaintext to BASE64. You can turn pictures, documents and other stuff into BASE64 data.

I saw it being used a lot of times but never did it myself. Windows active directory stores pictures of user accounts in BASE64 data.
Reply
#8
(09-08-2020, 07:01 AM)hopphim95 Wrote:  Can you give me some specific references on the 2nd way you say it?

Apologies for the late response; I'm not that active around here for the time-being :-)

Anyway, I did assume that you'll look it up and I hope you did find the response by now.

In case you're still in need for a how to do it -and for anybody else interested- we'll need to use JavaScript to create an iFrame object on-the-fly after the DOM object is constructed (when the page is fully loaded.)

In its simplest form, it goes like this:

> We'll need 2 files an index.html file and a lib.js file, as per my previous first tip. The lib.js will contain a JavaScript function that will take care of creating the iFrame on-the-fly and a window event handler that will trigger the iFrame insertion when the DOM is constructed.

Thus:

index.html source:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Framed!...</title>
<style>
html,body { width:100%;height:100%; z-index:0;overflow:hidden;}
.rdy {
position:relative;
    background:#9c9c9c;
    border-radius:8px;
    -webkit-border-radius:8px;
 box-shadow: rgba(255, 255, 255, 0.15) 0 1px 0 inset, black 0 2px 18px;
 margin:0 auto;
}
</style>
</head>
<body>
<h1>You're being____________Framed! :-)</h1>
<script src="/test/lib.js"></script>
</body>
</html>

And the lib.js source
var framer = function(url) {
  var iframe_win, iframe_doc, iframe_body,iframe;
 
  if( "sandbox" in document.createElement("iframe") ) {
     iframe = document.createElement( "iframe" );
     iframe.setAttribute( "id", "theFrame" );
     iframe.setAttribute( "class", "rdy" );
     iframe.setAttribute( "scrolling", "no" );
     iframe.setAttribute( "width", "680" ); //640 +40
     iframe.setAttribute( "height", "500" ); //320 +180
     iframe.setAttribute( "sandbox", "allow-scripts allow-same-origin" );
     iframe.setAttribute( "src", url);
     document.body.appendChild(iframe);
         iframe_win = iframe.contentWindow;
         iframe_doc = iframe_win.document || iframe.contentDocument;
         iframe_body = iframe_doc.documentElement.lastChild;
         iframe_body.className = '';
  }
},
target=window.atob("aHR0cHM6Ly9lbi53aWtpcGVkaWEub3JnLw==");

//NOTE THAT :
//  window.btoa(https://en.wikipedia.org/)   ===   "aHR0cHM6Ly9lbi53aWtpcGVkaWEub3JnLw=="

window.onload = function(){ framer(target); };

To test this example, put the 2 files inside a test folder in your website root folder then load your website_domain+[/test/index.html] into your browser.

The iFrame will be appended as a last element of the DOM, you should adjust the insertion location as you would like it to be. The iFrame will load the wikipedia website inside it.

As you see the src was base64-encoded and decoded on the fly with the native window.atob function. To base64-encode a link you'll just have to run the reverse native function window.btoa(https://en.wikipedia.org/.)

All this being said, I'll still have to emphasize that it's true that in this situation you did achieve your stated goal of preventing casual users from knowing the src of the iframe from viewing the source of both the html and JS files, but a simple viewing of the web console OR -more importantly- of the DOM Inspector (in Firefox and similar in Chrome etc..) will reveal everything in plain text to the inquisitive minds: they have the full DOM structure right before their eyes and in real time...

Hope this helps, good luck!
Reply
 


Forum Jump:


Users browsing this thread: 1 Guest(s)

Sponsors: VirMach - Host4Fun - CubeData - Evolution-Host - HostDare - Hyper Expert - Shadow Hosting - Bladenode - Hostlease - RackNerd - ReadyDedis


About Post4VPS

Post4VPS is a forum/destiny where you can Delploy Your Free VPSs just by the Power of Posts.

We Provide VPSs of many locations like Germany,US,Canada,France,London,etc.

We also Provide VPSs of Both Linux and Windows OS.