Friday, May 22, 2009

How to automatically redirect a browser to another web page from one of your own

This is the preferred method of redirecting to other web pages, and additional information can be found at http://www.w3.org/QA/Tips/reback.

As the P-A Department's main web server uses the Apache HTTP server program, here is how to do it on that system (for other systems' servers, see the references in the www.w3.org web page noted above).

Create a file in the directory in question called ".htaccess" and put into it the line

Redirect /path-of-file-to-be-redirected URL-of-page-to-go-to

For example, if you are a professor teaching the (fictitious - for the sake of the example only)PHY386 course during Spring Semester 2007, but you want to keep your web pages in a subdirectory of your own user area instead of in the courses area provided, you can go to the appropriate courses area on the server, /web/documents/courses/2007spring/PHY386 and put

Redirect /courses/2007spring/PHY386/index.html http://www.pa.msu.edu/people/username/subdir/index.htm

(all on one line, in case the above example is wrapped by your browser) into a file called .htaccesswhich has world-read permissions (that's the default).

The "path" argument is relative to the "web root", so in the above example, "/web/documents" is left off. The "page to go to" URL is a full URL, even if the web page is on the same server. More than oneRedirect command can be put into the .htaccess file, and you can redirect all files in a directory to their equivalents in a "to go to" directory by leaving the filenames off.

A case where more than one Redirect command may be necessary is when a web page may be accessed via more than one URL. In the above "PHY 386" example, in fact, the instructor will have to add a second line, the same as the first, except for lower-case "phy386" instead of "PHY386" in the "path" argument, because the web page may be accessed with the "phy386" URL, too. During Spring Semester 2007, the page could also be accessed with URLs with "current" in place of "2007spring" and with "2007spring" left out entirely, bringing the number of Redirect commands up to six for that one page. Fortunately, a URL which leaves off the "index.html" filename defaults to assuming it, or else three more Redirect commands would be needed to handle those cases. (The folks at w3.org still consider this as preferable to a single "refresh" meta command in the file itself, which would be read and acted upon regardless of how the file was accessed, as described below.)

If there is already a .htaccess file in the subdirectory in question, see the Apache HTTP server documentation to see where in it the Redirect command should be placed. If you are the person running the Apache web server program on a system, you can also put instances of the Redirectcommand into the server configuration file instead of, or in addition to, .htaccess files in specific subdirectories (again, see the Apache HTTP server documentation for the details).


"refresh" meta command

Note that this method is deprecated by the official HTML standards organization in favor of the server-based redirect method described above.

You can set up a web page to inform any browser which happens to load it that there is another web page it should go to instead, after an optional delay.

This is accomplished using a "refresh" meta command in the header section

     <head>
.
.
</head>


of your HTML file, along with the title and any "keywords" or other meta commands.

Syntax

The syntax for the "refresh" meta command is

<meta http-equiv="refresh" content="N; URL=other-web-address">



where N is the approximate number of seconds that you want the current web page to be displayed before the browser automatically goes to the other web address. If N = 0, then the browser should go immediately to the other web address.



Netiquette tip

In case someone's browser doesn't handle these automatic redirects (most browsers do handle them, but some allow them to be turned off, as a way of discouraging "web spam", which often uses this type of "refresh" redirect), you may want to provide a second route to the intended destination by way of a standard link (see the example, below).

Example


<html>
<head>
<title>A web page that points a browser to a different page after 2 seconds</title>
<meta http-equiv="refresh" content="2; URL=http://www.pa.msu.edu/services/computing/">
<meta name="keywords" content="automatic redirection">
</head>
<body>
If your browser doesn't automatically go there within a few seconds,
you may want to go to
<a href="http://www.pa.msu.edu/services/computing/">the destination</a>
manually.
</body>
</html>


Select Example above or here to see how the example works in practice.






Notes on scripting languages

There are also ways of doing this with JavaScript, VBscript, and other internal web page scripting languages, but explaining them in detail is beyond the scope of this web page. A few examples may illustrate the method, however, and encourage users to obtain actual JavaScript documentation (a book, or online) to guide them in developing their own variants suited to their own needs.

The following JavaScript example, which would go ahead of the first <html> flag on the web page, orbetween the <HEAD> and </HEAD> tags, opens the new site in the same browser window (effectivelyinstead of the rest of the contents of the page that the script is in):



 <script language="javascript" type="text/javascript">
<!--
window.location="http://www.pa.msu.edu/services/";
// -->
</script>


This JavaScript example opens the new site in the same browser window after displaying the current page in the window for 2 seconds (2000 ms):



 <script language="javascript" type="text/javascript">
<!--
window.setTimeout('window.location="http://www.pa.msu.edu/services/"; ',2000);
// -->
</script>

(Note that this does exactly what the HTML META tag above does, but as the META tag method does not depend on the browser's having JavaScript available and active, in most cases the META tag method would be preferable).

The next JavaScript example opens the new site in a new* browser window:



 <script language="javascript" type="text/javascript">
<!--
Newsite= window.open("http://www.pa.msu.edu/services/","newsite");
// -->
</script>

* sometimes, the "new" window is one of those already opened in the session; this seems to be somewhat random, and I don't know if it's a browser bug or a "JavaScript thing" with the window.open command. Just note that browser behavior may not always be consistent if you use this script (or the next one, which also useswindow.open). -- GJP.

This JavaScript example opens the new site in a new browser window after a 4.5 second (4500 ms) delay:



 <script language="javascript" type="text/javascript">
<!--
window.setTimeout('window.open("http://www.pa.msu.edu/services/","newsite")',4500);
// -->
</script>



WARNING: With these capabilities for automatic redirection to other web pages, it is possible to set up a redirection loop -- try to avoid making it a no-wait-time infinite loop! (An infinite loop with a reasonable delay, on the other hand, might have its uses as a sort of slide show, among other possibilities).

No comments:

Post a Comment