"like button", restrict to one like per visitor?

Hi,

I have a counter which counts likes, something like this:

But atm anyone can just spam this, is it easy to restrict it to one click per visitor? How would you archieve this? With some cache solution?

It doesn’t necessary have to be done in angular.js

The way it’s normally done is for each person to have their own individual account (think Facebook or Reddit) and to record the like against their account number,

Otherwise, you can use cookies to record that they already liked it, and only accept the like if they haven’t already liked it. You could even keep the like numbers going up on their page without updating on the back end, just to mess with them that little extra bit.

1 Like

Okey I see.

It’s just an “appreciate button”, with no connection to accounts, So I guess using cookies is the way to do it then? I’m quite a novice when it comes to cookies and that stuff, do you have any tips on good resources that can help me achieve this?

[quote=“ReGGaeBOSS, post:3, topic:205740, full:true”]do you have any tips on good resources that can help me achieve this?
[/quote]

Sure thing. These cookie handling functions I’ve found to be very useful:

function createCookie(name, value, days) {
    var expires = '',
        date = new Date();
    if (days) {
        date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
        expires = '; expires=' + date.toGMTString();
    }
    document.cookie = name + '=' + value + expires + '; path=/';
}
 
function readCookie(name) {
    var nameEQ = name + '=',
        allCookies = document.cookie.split(';'),
        i,
        cookie;
    for (i = 0; i < allCookies.length; i += 1) {
        cookie = allCookies[i];
        while (cookie.charAt(0) === ' ') {
            cookie = cookie.substring(1, cookie.length);
        }
        if (cookie.indexOf(nameEQ) === 0) {
            return cookie.substring(nameEQ.length, cookie.length);
        }
    }
    return null;
}
 
function eraseCookie(name) {
    createCookie(name, '', -1);
}

When the like occurs, before you record that it happened first check if a cookie has been set for the vote. If the cookie is already there, you know not to record the vote.

If reading the vote cookie results in nothing, carry on with recording the vote.

1 Like

Thx man, I will try it out and then i’l get back here to tell if it was a success or failure=)

Hi again,

So, I don’t really know how to incorporate the cookie functions you gave me with my current code.

What I have “accomplished” so far is to add a class, count clicks and disable the button after one click:

What I need to do now is, with the help of cookies, make the click remembered when the visitor visits the site again. I also need to increase the click count for every time a new user clicks it, for example if 5 people have clicked the button, I want the counter to show 5 for the sixth person, before he clicks.

I don’t really know where to start or how to do this but if you or anyone else would like to help me i would be really grateful, and maybe learn something about cookies in the process.

Here is a something I have done with jQuery: https://jsfiddle.net/ot8dmwh4/6/

When you process the like click, also add a cookie.

// do voting stuff
// ...
createCookie('hasVoted', '1');

Then, wrap the like part and the createCookie in an if condition, that checks if they have not already voted:

if (readCookie('hasVoted') === null) {
    // do voting stuff
    // ...
    createCookie(...);
}

That way, you are guarding the voting stuff so that it only occurs when the hasVoted cookie isn’t there.

This method isn’t full proof as anyone can just toss their cookies and push the button again.

1 Like

[quote=“oddz, post:8, topic:205740, full:true”]This method isn’t full proof as anyone can just toss their cookies and push the button again.
[/quote]

The same argument can be said for virtually all cookie-based solutions.

Other types of solutions exist, where you record details about the user to a central database. But @oddz, what form of alternative solution do you have in mind?

Well, full proof isn’t really super important for this use case scenario since the voting/like -button is more of a “fun thing”, that neither break or make the site. It’s going to be on my personal portfolio, at the bottom of each case study I want to have this “Appreciation”-button.

Hi @paul_wilkins, the cookie approach is cool and offers a bit of track keeping on whether the user has click on the button before or not. But relying solely on that comes with it own flaws.

You can improve on that by also keeping track of the user agent (i.e firefox, chrome etc) and if the user’s IP address is static, adding a check for the user’s IP address too.

These few checks together with cookie implementation would work great.

Let me know how well it goes.

Cheers!

@ReGGaeBOSS - how do you feel about the prospect of recording all of that information to your own server-side database, on every visitor to your site?

That would have been great, that is, if the user is being kept on session. But with a user who is not logged in, the problem is about keeping track of the identity of the use to avoid multiple clicks on the button by the same user.

I don’t think I much like the thought of keeping the information in a database it perpetuity, but for an arbitrary amount of time to help prevent “like flooding” it might not be such a bad idea.

I don’t particularly have any that I would like to share. I just think it was important for the op to understand the implications of using that method.

You can use sessions without them needing to login.

That is true, you can keep session without the user being logged in. But relating whatever stored data with the user is the deal.

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.