One method of password protecting your webpages is to use a cookie, but cookies are unreliable. If you can't trust a cookie to store the information that the user is logged in, where can you store it? In this example I'll show you how to use frames for JavaScript password security.
Welcome to Bucaro TecHelp!

Welcome to Bucaro TecHelp!
Maintain Your Computer and Use it More Effectively
to Design a Web Site and Make Money on the Web

About Bucaro TecHelp About BTH User Agreement User Agreement Privacy Policy Privacy Site Map Site Map Contact Bucaro TecHelp Contact Advertise on Bucaro TecHelp Advertise Here RSS News Feeds News Feeds

HTML5 Solutions: Essential Techniques for HTML5 Developers

Essential Techniques for HTML5 Developers

HTML5 brings the biggest changes to HTML in years. Web designers now have new techniques, from displaying video and audio natively in HTML, to creating realtime graphics on a web page without a plugin.

This book provides a collection of solutions to all of the most common HTML5 problems. Every solution contains sample code that is production-ready and can be applied to any project.

Click Here

Password Protection Using the Frames Method

If you want to restrict access to your website to only members or subscribers, how can you implement password protection? If you own the server, or if your web host provider allows, you can use the servers built-in security features. If your Web host provider allows you to run custom scripts, you can use a php or asp script to implement password protection. But what if you're using a free host or a pay host that does not allow custom scripts?

One method of password protecting your webpages is to use a cookie, but cookies are unreliable. If you can't trust a cookie to store the information that the user is logged in, where can you store it? You can store it in a frame. In this example I'll show you how to use frames for JavaScript password security.

Using the frames method of JavaScript password protection, all of your webpages will be displayed in a frameset. The entire code for the frameset page is shown below.

<html>
<head>
</head>

<frameset rows="1,*">
<frame name="control" frameborder=0 framespacing=0
 src="control.htm" scrolling=no noresize>
<frame name="main" frameborder=0 framespacing=0
 src="home.htm">
</frameset>

</html>

This would be the code for your default webpage. The default webpage is the page that is displayed when a user enters your website's domain name, without a page name, in the address bar of their browser. On a Linux Web server, the default webpage is usually named index.html. On a Windows Web server, the default webpage is usually named default.htm or default.asp. For this example, I'm naming the default webpage index.htm. This means that to view the website you load index.htm (or click on index.htm on your computer).

Note that the frameset defines two frames. One frame is named main. This is the frame that all of your webpages would appear in, including your home page. For this example, I'm naming the home page home.htm. The other frame is named control. Only one webpage gets loaded into this frame. I'm naming that webpage control.htm because it, rather than a cookie, will be used to store our access variable. The entire code for control.htm is shown below.

<html>
<head>
<script language="JavaScript" src="control.js"></script>
</head>
<body>
</body>
</html>

Note that in the frameset, the control frame is only one pixel high and it can't be resized. In other words, the control frame is not visible to the user. The user sees only the webpage that is loaded into the main frame. Also note that the webpage that gets loaded into the control frame uses a JavaScript include statement that includes a file named control.js. The entire code for the file control.js is shown below.

var access = false;

All the include file control.js does is define a boolean variable to store whether the user has access or not. The variable is initialized to false so the user does not have access.

RSS Feed RSS Feed



Web Design Sections

Eloquent JavaScript: A Modern Introduction to Programming

Eloquent JavaScript

Eloquent JavaScript Eloquent JavaScript goes beyond the cut-and-paste scripts of the recipe books and teaches you to write code that's elegant and effective. You'll start with the basics of programming, and learn to use variables, control structures, functions, and data structures. Then you'll dive into the real JavaScript artistry: higher-order functions, closures, and object-oriented programming.

Reader Anthony says, "This book is not your typical Javascript book. Others have a utilitarian approach. In stark contrast, Eloquent JavaScript does not merely provide you a checklist of things to learn but rather paints a panorama of the possibilities that programming provides. Javascript is merely the tool used to introduce these to the reader.

Click here for more information.


[Site User Agreement] [Advertise on This site] [Search This Site] [Contact Form]
Copyright©2001-2011 Bucaro TecHelp 13771 N Fountain Hills Blvd Suite 114-248 Fountain Hills, AZ 85268