We Keep Coding

JavaScript: how to pass additional information to source page?

I have a website and when a user follows an internal link I would like to pass some extra information to a new page, so JavaScript on the destination page could do some useful highlighting.
There is an option to pass that information via the link parameters (GET), but it will generate lots of virtually duplicate pages and break pretty URLs concept. Another way is to make a webapp using AJAX, but it will also bound content to a single URL.
How can I transparently pass some information to the new page during navigation w/o messing with site's URL structure?

You could store the data in local storage or session storage, and retrieve it again on the destination page.

So you have a few options.
Form Submission
First option post a form with the data. Add a hidden form, on the anchor click capture the click event, set the hidden fields with the values you want to send to the next page, and submit the form. On the next page, read the post parameters in the backend and update the page.
Local Storage
On click of the anchor, set localStorage to the values you want to appear on the next page. When the next page loads, read the localStorage values and update the page. Note: The server will not have access to the values
Ajax with pushState
Use Ajax to submit the form. When the Ajax call returns, use window.history.pushState to update the url with whatever url you want to be displayed to the user.

One of the options not mentioned is to create a dirty URL:
/destination/param1/value1/...
then strip additional parameters at server-side and redirect:
/destination
keeping additional values stored at server-side (e.g. via sessions). I still prefer using sessionStorage in a real application, but it worth mentioning anyway.

What do you mean it will "bind content to a single url"? AJAX request is the first thing that comes to my mind as the solution to this problem. You dont have to use the url of the page to make the ajax request, you can build the url inside your javascript based on whatever conditions exist in your application.
Besides AJAX and passing parameters in the URL, the only other thing I can think of is to use Cookies. That of course runs into problems if the user has cookies disabled. I think an Ajax call to your server is the most robust way of handling the problem.

Get or Pass Sensitive Data via AJAX in PHP

I want to update a row of data in a database using Ajax and PHP; however, I'm struggling with the following issue: the field in the database to update (henceforth the id) is dependent on the page the ajax request is sent from.
I need to get this id to my PHP script that Ajax calls, however:
I don't want to set the id in a data attribute or hidden input on the page because these can both be manipulated by a malicious user.
Similarly, identifying the id using the referring URL is also prone to spoofing as $_SERVER isn't secure.
I can't set the id in a SESSION variable (or COOKIES) because the user could have multiple pages open and the SESSION would only hold the last page id that was opened.
The only solution I can think is to create a map of random tokens to id's in a table in the db and pass that in a SESSION variable (as per #3 above), then check the table for the token and grab the respective id that way. Seems somewhat convoluted though.
Are there any other options or thoughts? Thanks.

This is a problem related to OWASP Top10 A7 (Missing Function Level Access Control).
There might be no issue with putting your ID on the page so the page can send it back - you just need to validate that the actual save request is permitted for the user.
Just think, regardless of whether you put the ID on the page or not, the page does know the base url for performing the action, so they could go ahead and guess IDs anyway.

Simplify your logic. Pass some sort of indicator of what type of id is in use from the client to the server.
If you create overly complex application logic to address a security concern you will probably have more problems with your code than improvements in security.
Use SSL/HTTPS and a WAF (web application firewall - like mod_security).

How to use cookie set by JS in PHP

I am setting cookie using JS script on my page, but I need to use this value while generating HTML on server side PHP.
Let me expalain.
User requests page - > Of course PHP starts generating HTML -> User get response from server -> JS sets cookie.
Am I correct ? I understand this in this way.
But I need to use cookie set by JS while PHP generating response.
Of course it will work if reload the page,because new request is sent with cookies. But I need to use this cookies at a time I set it in JS.
Of course I can set in JS to reload page, but I don't think that is good solution.
What are possible solutions. I don't need to adhere to cookies. Maybe there are other possible ways to get data from JS to PHP.

If I understand your question right, there are at least 2 different ways:
load an initial page which purpose is to redirect (via JavaScript or Refresh header) to the main page;
load the entire main page in the first request, containing a placeholder block. Then set the cookie. Then fill the placeholder using AJAX technique (send another request using JS and replace HTML content of placeholer with a newly generated one).
For the 2nd approach you don't even need cookie, as JS can pass the value with a query string (GET request parameter).

How can I create extra protection for passing variables through URL? [JavaScript]

I'm using variable passing through a URL (ie ".derp.html?name=derp?lname=herp") to a popup (which uses these parameters to prefill information on the page). Although these pages are internal, I want to create more security. I do not want someone to type in their own link and submit a form with fake values.
I was thinking of having a function run once the link is opened instead, which opens the popup, and sends the parameters through variables to the new window, instead of through the URL. However, I would still need to send values to the java script function...
Anything else I can do to be more secure?
EDIT: Let me rephrase then... This is not public, this is internal. I'm not expecting users to try and hack into the system to create fake forms.
I can't do server-side validation because I'm working with very old methods like tabular data control in IE. There is no real data base to verify anything.

You can POST the values, instead of appending them to the URL. This is what HTML forms are for. For example:
<form action="derp.html" method="POST" target="myNewWindow">
<input type="hidden" value="derp" name="name"/>
<input type="hidden" value="derp" name="lname"/>
Click to open in a new window
</form>

You have two options
1) Instead of using GET method (sending parameter in URL), use POST method and the parameters will not be in HTML URL anymore and you can do it by Javascript. However, a person who want to send fake values to you server, still is able to do so, but it's just a bit harder.
2) Create a hash function(Javascript code) which encode all the parameters before submit the URL and decode it upon received on server side. http://en.wikipedia.org/wiki/Hash_function
Either way, will not provide you 100% security, and still you should perform parameter validation on-server side.

you can change it to a post request...but that's about all you can do if the logic is front-side...other than obfuscating the variable names.

How do I preserve radio button and check box value without using cookies after the browser refresh?

I have three radio buttons and 4 check boxes.
I want to preserve the radio button and check box values after the browser refresh.
I do not want to use cookies (due to some other reason).
Could anyone please help me?

I don't think this is possible because HTTP is stateless, cookies or server side scripting provide 'state'.

You could use sessions instead.
EDIT: My bad, I read PHP and not Javascript. However I did find this link after a quick Google search. Session variables without cookies in JS

You might be able to use the hash url.
something like this (don't remember if you need to specify the name of the page as well, but I don't think so):
document.location.href = '#radio1=1&radio2=0'
The hash means it just directs things on the current page and not going to another page (and the browser updates it in the address field, so if the user reloads the page, it will still be there). Then you can read it from javascript as well and set it.
Not as good as using server side sessions, but it is an option :)

If you're using a form to trigger a new page loading you can make the onsubmit event call a javascript function to change the window location and append URL parameters that store the values of the radio buttons. When the page loads you would then read the parameter values from the URL. Something like this:
<script type="text/javascript">
function changeURL(){
var str = window.location+"?radio1=1";
window.open(str);
return false;
}
</script>
...
<FORM onsubmit="changeURL();">
<INPUT TYPE="submit" value="click me" >
</FORM>

A new facility is being developed to allow web sites to store persistent data on the client machine. Available in some browsers already this allows you to save the the radio and checkbox states and recover and restore them next time the user visits your site. For more info see here https://developer.mozilla.org/en/DOM/Storage and here http://dev.w3.org/html5/webstorage

Have some JS on the page submit all radiobutton/checkbox events to the server, and store their state in your database. When the page (re)loads, send this state as part of the HTML.