How to set up free and paid versions of website? - javascript

I am currently redesigning a website and looking for a solution on how to add a paid version of the site.
For example, say I have a <select> drop-down box with 20 elements inside. However, I want 15 of these 20 elements to be disabled unless the user has a paid account. At this time, that is the extent of what I need to differentiate between free/paid versions.
I'm planning on adding the ability to register an account and log in, as well as some type of payment processor (recommendations are appreciated for this! - currently looking at using Django/Python). I just don't know how to best go about managing two different levels of the website, and allowing those additional options to paid members.
I'm working with calculators that are pure Javascript. Using Bootstrap for the page design. As far as anything else goes, I'm open.

To do that, you'd have to add a field with a default value of NULL to your database, let's call it "subscription", into your users table. Then, everytime a user login to your website, fetch the subcription value and write it into a session variable. The last thing you have to do to ensure free members aren't allowed to perform any actions the subscribed members can is checking the content of the session variable while :
building your html, or you could check it on the client side with javascript right after the premium element has loaded (this is for user experience only since a client can remove any html attribute whnever they want)
and
while recieving the data of the premium element on the server side, accept it if the user is premium, reject it if they're free (again, just checking the session variable should do the job).
So as you can see, it's much more about preventing free users to gain access at the paid members options than allowing paid members to browse a completly new version of the website designed specifically for them.

I will try to give you a blunt idea maybe this might help you.
So lets say a user has paid for your service you can flag a token in yours app's backend if a particular user is paid or not. So whenever the user logs in your app next time you can get the status of the logged user.
Once you get the status of the logged user you can enable or disable ui elements.
I hope this made some sense.

Related

Which is better? Doing basic HTML or loading HTML elements through the use of Javascript?

I've been developing a web-based information system that has a User-management functionality on it.
For instance, I'd like the 'Administrator User' be able to access all the functionalities I've created (adding a student information, editing student info, etc..). And I'd like the "Client User' only access retrieval functionalities (retrieve student info, etc...).
Now I think of 2 solutions on how to implement this. It's either doing 2 HTML file for a different user or doing a 1 HTML file that dynamically loads HTML elements in terms of what type of user with the help of javascript.
So here's the scenario, the user will first go through the Log-in page. Then, with the use of php, the system will determine whether the user was Admin or Client. After that, the user now will proceed to the page wherein it is dynamically loaded based on his User Type.
Now, I'm stuck on what to choose between these 2 solutions. Any who could enlighten me on which to choose? Thanks in advance! :D
NOTE: This system is used in Intranet only. It will not be deployed on the internet. The reason I did a web-based system is that of its cross-platform compatibility.
User-management and User`s role management is recommend on server side.User Management at client side having security bleach.
I think its better to keep 1 HTML and do the role based access control (RBAC) for the Sections of HTML page.
RBAC is a model in which roles are created for various job functions, and permissions to perform certain operations are then tied to roles. A user can be assigned one or multiple roles which restricts their system access to the permissions for which they have been authorized.
Some reference:
https://github.com/joeflintham/rbac
https://github.com/Repox/SimpleUsers
https://www.sitepoint.com/role-based-access-control-in-php/
https://github.com/xiidea/ezRbac

How to validate a button click on client side

Let's say, i have a website and it has one button: click me, and also a counter which counts how many times people clicked on the button.
The thing is, how to validate if the clicker is a real person, that he clicked only once e.t.c. ?
Ip's can be changed. Also, it's not a good choise to make a whole account system for a single button.
1.- You can save the count in the cache to make it accessible on the backend side.
2.- In the Frontend you cannot access to the IP, so you won't be able to check at that level.
3.- Maybe what you're looking for is a button with a Post in a login website, then everytime the button is clicked you can send the post with the user information and saved.
4.- To validate if'ยก it is a human you can use Google Captcha.
Hope this helps you!
You can use Google Invisible ReCAPTCHA. It's not 100% reliable when it comes to detect bots (it has been proven mutliple times by the past) but still very efficient.
However, to detect if a single person have clicked only once, there is no viable solution I think. You can maybe add a cookie and check if the cookie exists but it can be easily bypassed by simply deleting the said cookie.
To authenticate a unique device, you can store MAC, IP address, and User Agent. Of course, all those can both be spoofed to allow multiple clicks. That solution would also limit to one person per device, which may not be your intent. Storing User Agent with the MAC address is more difficult to get around than a cookie (that can be deleted).
You can eliminate the most common bots by their user agent, or you can use a CAPTCHA.
You authenticate persons by email account or OpenID, but I assume you want to make clicking the button as easy as possible.

Tracking clicks of guest users, with some decent kind of uniqueness

Please be advised, this is not a code-problem question.
I have a resource in my app that is available only for authenticated users. In case a guest user tries to access the resource by clicking on it - registration modal shows up.
Now, I'm building logic using jQuery and PHP in order to store those clicks of guests. However, I also would like to implement something, that will let me retrieve rough information on unique users among the ones who clicked.
The idea I have is this:
When a specific page is loaded, set a JS cookie of "unique" value,
like this: [random string of fixed size][timestamp]. The cookie
would expire in a year from now. If the cookie already exists, don't
do anything.
When the guest clicks on the resource, make an Ajax
call to store the click AND the cookie value.
Later, to get "unique" clicks, make a SELECT that will GROUP BY
the cookie value.
Unless the cookies are cleared or the custom cookie expiration date is exceeded, this should give me a way to determine unique clicks (users) among guests.
I'm interested, if anyone can provide me with a better way to achieve what I need.
I wouldn't reinvent the wheel and use Google Analytics for this kind of task, since it's almost doing al the job and giving you nice graphics and statistics for free.

A simple voting system: how to prevent duplicate votes [duplicate]

This question already has answers here:
Unique IPs in a voting system
(7 answers)
Closed 9 years ago.
I'm building a simple web app with an up-vote option. I plan on offering cash rewards for the most up-voted so I want a relatively secure system. I have a couple questions about conception. I know that my post is similar to a few others but none seem to be specific enough to the platform to put my mind at ease.
My web app is utilizing javascript and firebase for loading all of the objects that are being voted on. I'm going to force a user to be logged in and store IP addresses, user IDs etc.
Questions:
Is this fundamentally flawed from the start for using javascript? I see a large potential for writing a script that just changes values and re-votes. (maybe I can verify the front end data is correct and that the user exists with an ajax call?)
With the off-beat chance my app becomes successful Is this going to be too much front end computing?
Edit:
I'm sorry, but I left out the key fact that I do have a larger back end system(WordPress) that handles authentication. The app I'm working on is largely independent from wordpress. I'm simply pulling some user information for filtering purposes. I chose Firebase as a storage solution for its real-time features.
I'm hoping to combat voter fraud with a few methods:
low rewards $100/month given away.
being logged in isn't a compromise, I actually want users to be registered and verified with human eyes to be eligible to vote. Others can witness the contest but cannot vote.
server-side checks. If my app gains popularity I can write scripts to monitor voting patterns for irregularities? if someone is abusing the system, I disable their ability to win.
It is certainly possible to do this securely client-side. However, as noted by others, it does require users to login. If you're already using Firebase, this is actually pretty easy to implement using the FirebaseAuthClient.
You can then couple this with Firebase security rules to enforce that any logged in user can only upvote once. Check out the screencast on the security page for an example!
Your security rules might look like:
{
"rules": {
"users:" {
"$userid": {
"voted_on": {
"$articleid": {
".write": "!data.exists()"
}
}
}
}
}
}
This ensures that you can write any given value to /users/anant/voted_on/article1 exactly once. You can add a .validate rule to ensure that the value is a boolean (or something else).
This is what you should probably do:
1) As soon as user votes, you should make an ajax call to the server and update the flag in the database and disable the voting using javascript.
2) If the user refreshes the page and tries to vote up again, the server would be knowing that the vote has already been made(as it is saved in database) so the voting system will appear disabled on the page.
3) If the user tries to enable the voting using chrome tools or firebug by modifying the source of page, you can create a check at database end by setting the composite key on userID and "vote" flag which would prevent the duplicate votes.
Hope it helps..
There is no way to prevent duplicate votes but forcing users to sign up (maybe with email confirmation) and authenticate (thus, storing votes somewhere in your DB and checking). Other techniques are flawed:
cookies/session storage can be disabled or cleared whenever the user wants.
IP address tracking prevents usage behind NATs, proxies and gateways, since all clients will share the same public address (or a small number of).
Still, a user could register multiple accounts and there is no way to prevent this.
A thing you can do is detecting rapid sequences of vote actions, which could be generated by scripts.
Taking advantage of OAuth authentication, it's highly unlikely that users cannott find a way to login via either FB/Twitter/Google/OpenID.
It is still cheap and fast to vote, and in case the user does not want to login via third party services, you can provide an email fallback.
As everybody pointed out already, you have to rely on you own server.

Popup based on user account status

I want to create a popup which is easy, but here's thing, I want to hide it if you become a paid member, and I want it to appear again if you don't subscribe the next month, I am using the paypal button html code and not the ipn, the paypal button is in the account section of the site, well if you want I can put it in the pop-up and i can use the ipn if i have to, instead of the html code just want someone to guide me on how it's done
You're going to need some sort of user authentication to see if someone has purchased your product or not. This should be handled with a server-side language (PHP, Ruby, etc.) and you can change the layout of your page based on whether the user has authenticated or not.
If you don't have any server-side code, you could use cookies that are saved when you receive a successful callback from PayPal, but that isn't going to be very reliable because they won't be found if the user changes browsers or computers.
If you dont want to use a back-end then use cookies. If they have correct values stored in the cookie, use javascript to hide or change the elemts on the page

Categories