I would like to check if a user who opens my website is new (type in url OR redirect through google) and then display a message.

But when the user browse through the site (subpages like about and so on) this message is not displayed.

But when the user closes the browser and visits (maybe a few mintues later) the website again, the message should be displayed again.

How can I implement something like this in JavaScript?

I would like to check if a user who opens my website is new (type in url OR redirect through google) and then display a message.

But when the user browse through the site (subpages like about and so on) this message is not displayed.

But when the user closes the browser and visits (maybe a few mintues later) the website again, the message should be displayed again.

How can I implement something like this in JavaScript?

• javascript
• html
• web

• 2 you should take a look at cookies – luk2302 Commented May 17, 2015 at 19:33
• firstImpression is a JavaScript micro-library that answers the question, "Has this visitor been here before?" - firstImpression.js – Nadav S. Commented May 17, 2015 at 19:35
• You need some server-side features. So you can not do it with only javascript... – vekah Commented May 17, 2015 at 19:35
• @luk2302: Unless you're targeting Europe... – Brad Christie Commented May 17, 2015 at 19:39
• You can sessionStorage to remember a user for that session, and localStorage to remember a user until the user deletes the localStorage – adeneo Commented May 17, 2015 at 19:41

5 Answers 5

You could use cookies, localStorage, sessionStorage or the referrer info. Note that all of them have their own pros and cons and there is no 100% reliable way of detecting new visitors.

Using the firstImpression.js library that Nadav S mentioned is probably the easiest way.

To get the message to show up for users closing and reopening the site:

• unset your cookie / localStorage data on unload or

• use a referrer info or sessionStorage based solution

See these MDN resources for more:

• cookie
• localStorage
• sessionStorage
• referrer

Slightly relevant as well: http://www.cookielaw/faq/

From the MDN:

Returns the URI of the page that linked to this page.

 string = document.referrer;

The value is an empty string if the user navigated to the page directly (not through a link, but, for example, via a bookmark). Since this property returns only a string, it does not give you DOM access to the referring page.

This means:

if (!document.referrer) {
    //Direct access
} else {
    var referer = document.referrer;
    //Request es from referer
}

If you want to save this state, you need to take a look at cookies.

Quite easily, you want session storage

var hasVisited = sessionStorage.getItem('washere');

if ( ! hasVisited ) {

    // do stuff
    alert('Wele, stranger !');
    sessionStorage.setItem('washere', true);
}

You can implement this by using cookies.

When the visitor first e to your page, you check if your cookie exist, if not show the message to them and then create the cookie for future pages.

Using cookies is probably your best bet. They are super simple to use too. Just write

if(document.cookie = "HasVisited=true"){
   //whatever you want it to do if they have visited
}
else {
   document.cookie = "HasVisited=true"
   //that just saves to their browser that they have for future     reference
}