| Overview |
| |
In this chapter you will learn :
- Detecting browser using navigator object.
- About the properties of navigator object
- About Cookies.
- Creating cookies.
- Retrieving cookies.
- Deleting cookies.
|
Most of the web pages are completely accessible on all JavaScript enabled browser, however, certain information can't deal with certain browsers or with older versions. Using JavaScript, you can easily detect the browser used by visitors on your web page. The browser detection script can check for browser types, browser versions, available plug-ins, languages, and platforms. Navigator object reveals this information, regarding the browser your visitors are using. Using Navigator object, you can redirect visitors to browser specific pages or display browser specific contents such as style sheets.
Browser Detection
As you know that certain information can't deal with certain browsers or with older versions; So, browser detection helps you to find out what browser type and version your viewer is using, and then perform a script based on it. You can also redirect your visitors to some other web pages which would be compatible with visitor's browser . JavaScript includes an object called the Navigator object, which can be used to detect the browser.
Navigator Object
The Navigator object can reveal the information about the web browser the user is using. JavaScript is useful for capturing browser's details. Application name (browser's name), its version, code name, platform etc are available through the Navigator object and its properties. It is named after the Netscape Navigator and it is the top-level object. The Navigator object has following properties :
| Properties |
Description |
| appName |
It gives the name of the user's browser, for example, as Microsoft Internet Explorer, Netscape Navigator etc. |
| appVersion |
It gives the information regarding the browser version. It includes the version number and other version information for the browser which may contain the name of operating system. |
| appCodeName |
It gives the code name of the browser. Both Netscape and Internet Explorer displays the code name "Mozilla". |
| platform |
It gives the description of the operating system platform on which the browser is running. For example : Macintosh, Windows etc. This property was added in JavaScript 1.2 |
| cookieEnabled |
It reveals that whether cookie has been enabled or not. A Boolean value 'true' indicates that cookie support is enabled and 'false' indicates that cookie support is disabled. |
| language |
This property returns the default two letter language code settings to indicate language version of the browser. For example 'en' for English. |
| userAgent |
Many browsers do not identify themselves through appName property and hence it is an unreliable field, so userAgent property is used. It is a string passed by browser as user-agent HTTP header. This property typically contains all the information in both appName and appVersion. |
| Example |
<html>
<head>
<script language = "JavaScript">
<!--
function infoBrowser( )
{
self.document.write( navigator.appName+ " ")
self.document.write( navigator.appCodeName+ " ")
self.document.write( navigator.appVersion+ " ")
}
//-->
</script>
</head>
<body>
<script language= "JavaScript">
<!--
infoBrowser( )
//-->
</script>
</body>
</html> |
Cookies
The World Wide Web was designed in such a way that all the URL requests are processed in a similar manner by the web servers, i.e., browsers were used to send URL requests to servers. So, one of the major short-comings of writing applications for the World Wide Web has been incapability of the web to maintain state, i.e., if once the server has sent a page, on browser's request, then in future, it doesn't contain any information about the browser's previous actions on the page. For example, if the user clicks on an image or on a link, the server doesn't have history information about what page the user is coming from.
Maintaining state can be important to uphold in the otherwise stateless HTTP protocol environment for developing complex interactive applications. Hence, browsers approach this problem with cookies.
- A cookie is a method for storing information locally in the browser.
- A cookie is just a variable name that your web page can store and retrieve from the client's machine.
- Whenever the applicable pages are requested by the user, a cookie is sent to the server
- Cookies, too, have expiry date. After the elapsing date, the cookie will no longer be stored by the client or sent to the server.
- Cookies are stored at the client's machine, resultantly, does not require any extra server space.
- The HTTP request sent by the user to the server includes a header that defines several pieces of information, including the page being requested.
- The HTTP response sent by the server also includes a header that holds information about the document being returned.
- Various domains of the HTTP header allows the sharing of cookie information between the client browser and a server.
- Whenever the user requests a page for the first time, it includes a set-cookie header as a part of an HTTP response, so that a cookie can be created.
- If a cookie is already present when a user arrives at the page, then it is stored in the document.cookie object. All the cookies can be, then, accessed and manipulated using property document.cookie.