Renamed to htmltampering

This commit is contained in:
Àngel Ollé Blázquez
2022-07-30 19:25:59 +02:00
parent 1c86f465dc
commit 25948306bd
8 changed files with 5 additions and 5 deletions

View File

@ -0,0 +1,8 @@
== Concept
Browsers generally offer many options of editing the displayed content. Developers
therefore must be aware that the values sent by the user may have been tampered with.
== Goals
* The user should have a basic understanding of HTML
* The user will be able to exploit editing front end of website

View File

@ -0,0 +1,14 @@
=== Mitigation
In this simple example you noticed that the price is calculated client-side and sent to the server. The server
accepted the input as a given and did not calculate the price again. One of the mitigations in this case is to look up
the price of the television in your database and calculate the total price again.
In a real application you should never rely on client side validation. It is important to verify all the input
sent by the client. Always remember: **NEVER TRUST INPUT SENT BY A CLIENT.**
''''
==== References
https://cheatsheetseries.owasp.org/cheatsheets/Input_Validation_Cheat_Sheet.html

View File

@ -0,0 +1,2 @@
=== Try it yourself
In an online store you ordered a new TV, try to buy one or more TVs for a lower price.

View File

@ -0,0 +1,148 @@
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<div class="lesson-page-wrapper">
<div class="adoc-content" th:replace="doc:lessons/htmltampering/documentation/HtmlTampering_Intro.adoc"></div>
</div>
<div class="lesson-page-wrapper">
<!-- stripped down without extra comments -->
<div class="adoc-content" th:replace="doc:lessons/htmltampering/documentation/HtmlTampering_Task.adoc"></div>
<div class="attack-container">
<div class="assignment-success"><i class="fa fa-2 fa-check hidden" aria-hidden="true"></i></div>
<form class="attack-form" accept-charset="UNKNOWN" id="task" name="task"
method="POST"
action="/WebGoat/HtmlTampering/task">
<script>
var regex = /^2999.99$/;
var price = 2999.99;
document.getElementById("total").innerHTML = '$' + price.toString();
var total = price * document.task.QTY.value;
document.getElementById("total").innerHTML = '$' + total;
document.getElementById("subtotal").innerHTML = '$' + total;
document.getElementById("totalAmount").innerHTML = '$' + total;
$('#remove').click(function () {
document.getElementById("QTY").value = 1;
update();
});
$("#QTY").on('change keydown paste input blur', function () {
update();
});
function update() {
price = $('#price').text();
if (!regex.test(price.toString())) {
alert('Data tampering is disallowed');
document.getElementById("price").innerHTML = 2999.99;
update();
}
var total = price * document.task.QTY.value;
$('#total').text('$' + total.toFixed(2));
$('#subtotal').text('$' + total.toFixed(2));
$('#totalAmount').text('$' + total.toFixed(2));
$('#Total').val(total.toFixed(2));
}
</script>
<div class="container-fluid">
<div class="row">
<div class="col-sm-12 col-md-10 col-md-offset-1">
<table class="table table-hover">
<thead>
<tr>
<th>Product</th>
<th>Quantity</th>
<th class="text-center">Price</th>
<th class="text-center">Total</th>
<th> </th>
</tr>
</thead>
<tbody>
<tr>
<td class="col-sm-8 col-md-6">
<div class="media">
<a class="thumbnail pull-left" href="#"> <img class="media-object"
th:src="@{/images/samsung.jpg}"
style="width: 72px; height: 72px;"></img>
</a>
<div class="media-body">
<h4 class="media-heading"><a href="#">55'' M5510 White Full HD Smart TV</a>
</h4>
<h5 class="media-heading"> by <a href="#">Samsung</a></h5>
<span>Status: </span><span
class="text-success"><strong>In Stock</strong></span>
</div>
</div>
</td>
<td>
<input size="2" value="1" name="QTY" type="TEXT" id="QTY"/>
</td>
<td class="col-sm-1 col-md-1 text-center"><strong><span
id="price">2999.99</span></strong></td>
<td class="col-sm-1 col-md-1 text-center"><strong><span
id="total">$2999.99</span></strong></td>
<td class="col-sm-1 col-md-1">
<button type="submit" id="remove" class="btn btn-danger">
<span class="glyphicon glyphicon-remove" onclick="clear()"></span> Remove
</button>
</td>
</tr>
<tr>
<td>  </td>
<td>  </td>
<td>  </td>
<td><h5>Subtotal</h5></td>
<td class="text-right"><h5><strong><span id="subtotal">$2999.99</span></strong></h5>
</td>
</tr>
<tr>
<td>  </td>
<td>  </td>
<td>  </td>
<td><h5>Shipping costs</h5></td>
<td class="text-right"><h5><strong>$0.00</strong></h5>
</td>
</tr>
<tr>
<td>  </td>
<td>  </td>
<td>  </td>
<td><h3>Total</h3></td>
<td class="text-right"><h3><strong><span id="totalAmount">$2999.99</span></strong></h3>
</td>
</tr>
<tr>
<td>  </td>
<td>  </td>
<td>  </td>
<td>
<button type="button" class="btn btn-default">
<span class="glyphicon glyphicon-shopping-cart"></span> Continue Shopping
</button>
</td>
<td>
<div id="checkout">
<button type="submit" class="btn btn-success">
Checkout <span class="glyphicon glyphicon-play"></span>
</button>
</div>
</td>
<input id="Total" name="Total" type="HIDDEN" value="2999.99"/>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</form>
<br/><br/>
<div class="attack-feedback"></div>
<div class="attack-output"></div>
</div>
</div>
<div class="lesson-page-wrapper">
<div class="adoc-content" th:replace="doc:lessons/htmltampering/documentation/HtmlTampering_Mitigation.adoc"></div>
</div>
</html>

View File

@ -0,0 +1,9 @@
html-tampering.title=HTML tampering
html-tampering.tamper.success=Well done, you just bought a TV at a discount
html-tampering.tamper.failure=This is too expensive... You need to buy at a cheaper cost!
hint1=Try to change the number of items and see what is happening
hint2=Is the price part of the HTML request?
hint3=Intercept the request and manipulate the price before submitting it.

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.5 KiB