Implementing a shopping cart using Javascript? - javascript

I've been playing with the paypal html code and have been working on a shopping cart, I don't want to use a premade cart system.
So far my approach has been to store the items added to a cart in an array. I want to store it in a cookie really but don't know how to update the cookie each time a new item is added.
Any general advice about how to go about it would be great.

Typically, you'll need something on the server side (PHP?) to store such information. In PHP you would do session_start() and it would give a session number cookie to the browser, which would identify it to the server from that point forward (until it expires). Then you can use $_SESSION[] to store information regarding the cart, your customer, etc.
If you're not going to use server-side persistence, then you'll have to create lots of messy cookies or pass stuff back and forth in the URL.
Regardless of whether you do pure client-side persistence or server-side, you'll want to check and validate all data once submitted to the server because it can be manipulated by the user before submission. So prices, discounts can be changed and sent by the user. Check 'em before accepting them at the server.

Related

How can I 'lock' a page behind a log-in screen in jQuery/Bootstrap/JS?

I've been building a web app using Google's Firebase as a backend (for those who don't know, it's a Realtime database; any changes in data are reflected instantly and updated), there's other people working on the Android app with it so there's no other option (plus it's kinda cool). I was surprised that I have yet to write a single line of php or any server-side code. Anyway, jQuery is working perfectly fine for login and stuff.
Now I'm going to be making an admin page (with a separate login from the main users login). It'll be accessed in a completely separate way (by opening something like /admin.html). So the login can't be put on a separate page so people don't 'accidentally' access the admin panel by writing /admin.html in the address bar.
So I want to stop the admin page from completely loading until I've received confirmation from Firebase that the credentials are correct. So how can I achieve this knowing that both the login and the whole admin page needs to be in the same file. I'm positive this can be achieved with simple jQuery + Bootstrap but I'm not really sure how. Can anyone please point me in the right direction. Thanks in advance!
I have googled it of course but maybe my wording is off? :P
If I'm understanding your question correctly, your problem is that you need to create two separate views in a single file, and redirect to one or to another depending on your user "session", however, as all your code is in client, you don't have a "session" system operative.
Ok, there are several options you can take. I like the idea of using LocalStorage to store the user session.
When /admin.html is requested, your code checks for a valid session object (keep in mind that you'll need to define that session object) in the LocalStorage. If there is a valid object, you render the admin area, if there isn't any, you render the login area.
When someone sends username/pass to the database and you receive a valid response, you create a session object, store it in the LocalStorage and reload the page.
Keep in mind that you'll need to create a mechanism to make sessions die and a log off view.
For the dying sessions, as an idea, you can store the creation time and a expiration time in the session object. Each time a "session protected" page is served, when you check that the session object exist, you update it's expiration date a fixed amount (20 minutes plus current time, for example).
So, when you check if exists a valid session, you also check that it's expiration date has not due, and if it's, you delete the object.

Store if user has pressed button at any point before

I am making an image gallery, and I wish to have a vote up button people can press to increment the number of votes an image has received. Obviously I don't want people spamming the vote up button, so I want to limit each user to 1 vote up.
I do not have access to any kind of database (except writing to files), and a login system would not be good for my target audience.
What is the best way to store whether a user has visited the page before? Would it be better to use PHP or JavaScript or something else for this?
Without an authentication system, you can limit the action of a user temporarily, but the user can trick your system to vote multiple times.
Here are solutions not using a login/auth system (and their drawbacks) :
You can store the upvote action client-side with cookies, localstorage or any other mean, but the user can clear all off that to regain the right to vote again. For most people it can be ok (depends on your audience), but any techy guy wanting to cheat the system will be able to do it.
You can store the update action server-side with a reference such as the user-agent or the IP adress. But these "authentication" system are not reliable : user can share the same user-agent and change them easily. Several user can share the same IP adress and use proxy to change their IP adress.
The third solution is to use an external system : a facebook +1 voting system (facebook uses its own auth system) or google+ or other external services. User won't be able to trick the system, but you don't own the upvote count on you side and someone without a facebook or google+ account will not be able to vote.
Personally I would go and find myself a database... but if you don’t want to use one, you can still write to a file. For example: Create an array and store the IP address of the user in it. Than write this array as JSON code to a file (json_encode) and store it. When a user clicks the like button, read the file, decode the json (json_decode) and check if the IP address exists in the file. If not: add to array and store to the file. The amount of likes, is equal to the amount of IP addresses in the JSON object.
The best way to implement this, is to make an ajax call when the like button is pressed. Than the visitor won’t see a page load.
Note: Technically you can set a cookie, to "remember" that the user already clicked the button. That would save you some reading of the file in which the likes are stored.

Website progress storage?

I'm pretty new to web development and have for most of you trivial question.Where and how to store website progress user did? I mean...for example.We have javascript variable
var a=0;
and
<div id="clickhere" onClick="a=a+1;document.getElementById('clickhere').innerHTML=a">
.Imagine someone clicked on that division once and leaves website.I want him to see displayed number one in that div after returning to website.
You either need a server side to store this data, identify the client by some uid or login and retrive the data on repeated visit. or a simpler solution, use a client side cookie.
If you only want visit data viewable to each individual user, you can use a local storage mechanism. For clients whose browsers support HTML 5 you can use localstorage to store a retrieve the variable between user visits. You could get he JavaScript to set a cookie and then check if a cookie exists per user visit, if it does, increment the visit count.
A more robust solution would be to persist the visit count server side. You can issue a cookie to a user, on each future visit, you can either send the visit data to the server via Ajax, or by form submit. This would then need to be persisted to a database using a server side language such as php, ruby or .net.

Login using facebook, how to keep userid across all pages?

I want to use Facebook's log in, and then I need to display some data related to the user, which is in my databases.
The problem is that I have several pages, and I don't want all pages to load the data using Ajax, rather I want them to be created by JSP based on the user id from the first time the user logged in. The problem is how to set the user id parameter in the server side, and keep it safe?
JavaScript can't set the session, and it is very annoying and have poor performance to load the page and then wait for the id from the Facebook session just to send it to server and process it --> send data back. This is good behavior for the first time user logged in only.
I am using Jaxcent as the framework for Ajax which is based on servlets. For some reason, I can't get to work with the session object there which only works with forms inputs. And when I tried to put a hidden filed in, it is not getting into the session, only if I type the value myself.
How do I solve this issue?
I thought about a table in the database which I could quote the session id, and userid from, but then again I have the session id in JSP but the userid in JavaScript, I can't find a way to combine them.
You could create a page that you would pass the user id (when you get it from facebook) and that page would store a cookie on the client, with the necessary redirecting of course.
You might be able to do that with AJAX to get rid of the redirection.
Just set a cookie from your JavaScript code, and read that on the server. Note that you should include the full signed request if you need definitive values, as opposed to the user being able to modify them.

Can I create registration page in JavaScript?

I just want to know can I create registration page with using javascript in html page and store all details to the client-side cookie session or I should have a database to store all information there?
Any help would be appreciated
This has to be server side, in a database. Why would you want to store this on users computers? What would happen if they moved to a different computer or deleted their temporary internet files? You'd cause problems.
Hi there, I just want to know can I create registration page with using javascript in html page and store all details to the client-side cookie session
You could, but then the user would be registering with their browser rather then with your website, which doesn't appear to make sense.
should have a database to store all information there?
Having a server side system which stores information in a database is the standard approach.
If you want to persist your user information and if you want your user be able to login to your application from anywhere, then you should use a server side database and store your registration information.
Yes, you could do that, but it would not provide any kind of security. It would also mean that you lose out on the ability to keep track of your users, unless the cookie is read by the server. Finally, your user's registration would only be valid on their computer, again unless there is a way for them to retrieve their information from the server (which means the server will need to have it).
If it's a HTML5 app you could use the localStorage and sessionStorage Objects to store your info however if the items you are collecting are security sensitive I'd send the info to a database or a protected file on the server. Leaving sensitive info in a cookie isn't wise.
If you're working with passwords, get that stuff into a database and encrypted/salted!

Categories

Resources