46c536554c
- Added new webapplication called WebWolf to make attacks more realistic - Added WebWolf lesson to explain the concepts behind this new application
255 lines
15 KiB
HTML
255 lines
15 KiB
HTML
<!DOCTYPE html>
|
|
<html xmlns:th="http://www.thymeleaf.org">
|
|
|
|
|
|
<div class="lesson-page-wrapper">
|
|
<div class="adoc-content" th:replace="doc:Challenge_8.adoc"></div>
|
|
<link rel="stylesheet" type="text/css" th:href="@{/lesson_css/challenge8.css}"/>
|
|
<script th:src="@{/lesson_js/challenge8.js}" language="JavaScript"></script>
|
|
|
|
<div class="attack-container">
|
|
<div class="assignment-success"><i class="fa fa-2 fa-check hidden" aria-hidden="true"></i></div>
|
|
|
|
<div class="container">
|
|
|
|
<div class="row">
|
|
<div class="col-sm-3">
|
|
<div class="rating-block">
|
|
<h4>Average user rating</h4>
|
|
<h2 class="bold padding-bottom-7">4.3
|
|
<small>/ 5</small>
|
|
</h2>
|
|
<button id="star1" onClick="doVote(1)" type="button" class="btn btn-warning btn-sm" aria-label="Left Align">
|
|
<span class="glyphicon glyphicon-star" aria-hidden="true"></span>
|
|
</button>
|
|
<button id="star2" onClick="doVote(2)" type="button" class="btn btn-warning btn-sm" aria-label="Left Align">
|
|
<span class="glyphicon glyphicon-star" aria-hidden="true"></span>
|
|
</button>
|
|
<button id="star3" onClick="doVote(3)" type="button" class="btn btn-warning btn-sm" aria-label="Left Align">
|
|
<span class="glyphicon glyphicon-star" aria-hidden="true"></span>
|
|
</button>
|
|
<button id="star4" onClick="doVote(4)" type="button" class="btn btn-default btn-grey btn-sm" aria-label="Left Align">
|
|
<span class="glyphicon glyphicon-star" aria-hidden="true"></span>
|
|
</button>
|
|
<button id="star5" onClick="doVote(5)" type="button" class="btn btn-default btn-grey btn-sm" aria-label="Left Align">
|
|
<span class="glyphicon glyphicon-star" aria-hidden="true"></span>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
<div class="col-sm-3">
|
|
<h4>Rating breakdown</h4>
|
|
<div class="pull-left">
|
|
<div class="pull-left" style="width:35px; line-height:1;">
|
|
<div style="height:9px; margin:5px 0;">5 <span class="glyphicon glyphicon-star"></span>
|
|
</div>
|
|
</div>
|
|
<div class="pull-left" style="width:180px;">
|
|
<div class="progress" style="height:9px; margin:8px 0;">
|
|
<div id="progressBar5" class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="5"
|
|
aria-valuemin="0" aria-valuemax="5">
|
|
<span class="sr-only">5</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div id="nrOfVotes5" class="pull-right" style="margin-left:10px;">0</div>
|
|
</div>
|
|
<div class="pull-left">
|
|
<div class="pull-left" style="width:35px; line-height:1;">
|
|
<div style="height:9px; margin:5px 0;">4 <span class="glyphicon glyphicon-star"></span>
|
|
</div>
|
|
</div>
|
|
<div class="pull-left" style="width:180px;">
|
|
<div class="progress" style="height:9px; margin:8px 0;">
|
|
<div id="progressBar4" class="progress-bar progress-bar-primary" role="progressbar" aria-valuenow="5"
|
|
aria-valuemin="0" aria-valuemax="5">
|
|
<span class="sr-only">4</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div id="nrOfVotes4" class="pull-right" style="margin-left:10px;">0</div>
|
|
</div>
|
|
<div class="pull-left">
|
|
<div class="pull-left" style="width:35px; line-height:1;">
|
|
<div style="height:9px; margin:5px 0;">3 <span class="glyphicon glyphicon-star"></span>
|
|
</div>
|
|
</div>
|
|
<div class="pull-left" style="width:180px;">
|
|
<div class="progress" style="height:9px; margin:8px 0;">
|
|
<div id="progressBar3" class="progress-bar progress-bar-info" role="progressbar" aria-valuenow="5"
|
|
aria-valuemin="0" aria-valuemax="5">
|
|
<span class="sr-only">4</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div id="nrOfVotes3" class="pull-right" style="margin-left:10px;">0</div>
|
|
</div>
|
|
<div class="pull-left">
|
|
<div class="pull-left" style="width:35px; line-height:1;">
|
|
<div style="height:9px; margin:5px 0;">2 <span class="glyphicon glyphicon-star"></span>
|
|
</div>
|
|
</div>
|
|
<div class="pull-left" style="width:180px;">
|
|
<div class="progress" style="height:9px; margin:8px 0;">
|
|
<div id="progressBar2" class="progress-bar progress-bar-warning" role="progressbar" aria-valuenow="5"
|
|
aria-valuemin="0" aria-valuemax="5">
|
|
<span class="sr-only">2</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div id="nrOfVotes2" class="pull-right" style="margin-left:10px;">0</div>
|
|
</div>
|
|
<div class="pull-left">
|
|
<div class="pull-left" style="width:35px; line-height:1;">
|
|
<div style="height:9px; margin:5px 0;">1 <span class="glyphicon glyphicon-star"></span>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="pull-left" style="width:180px;">
|
|
<div class="progress" style="height:9px; margin:8px 0;">
|
|
<div id="progressBar1" class="progress-bar progress-bar-danger" role="progressbar" aria-valuenow="5"
|
|
aria-valuemin="0" aria-valuemax="5">
|
|
<span class="sr-only">4</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div id="nrOfVotes1" class="pull-right" style="margin-left:10px;">0</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row">
|
|
<div class="col-sm-7">
|
|
<hr/>
|
|
<div id = "voteResultMsg" class="alert alert-dismissable" style="display: none;">
|
|
</div>
|
|
<div class="alert alert-info">
|
|
Please login or register in order to vote (comments are disabled)
|
|
</div>
|
|
<div class="review-block">
|
|
<div class="row">
|
|
<div class="col-sm-3">
|
|
<img src="images/user1.png" class="img-rounded"/>
|
|
<div class="review-block-name"><a href="#">nktailor</a></div>
|
|
<div class="review-block-date">August 22, 2017<br/>1 day ago</div>
|
|
</div>
|
|
<div class="col-sm-9">
|
|
<div class="review-block-rate">
|
|
<button type="button" class="btn btn-warning btn-xs" aria-label="Left Align">
|
|
<span class="glyphicon glyphicon-star" aria-hidden="true"></span>
|
|
</button>
|
|
<button type="button" class="btn btn-warning btn-xs" aria-label="Left Align">
|
|
<span class="glyphicon glyphicon-star" aria-hidden="true"></span>
|
|
</button>
|
|
<button type="button" class="btn btn-warning btn-xs" aria-label="Left Align">
|
|
<span class="glyphicon glyphicon-star" aria-hidden="true"></span>
|
|
</button>
|
|
<button type="button" class="btn btn-warning btn-xs"
|
|
aria-label="Left Align">
|
|
<span class="glyphicon glyphicon-star" aria-hidden="true"></span>
|
|
</button>
|
|
<button type="button" class="btn btn-warning btn-xs"
|
|
aria-label="Left Align">
|
|
<span class="glyphicon glyphicon-star" aria-hidden="true"></span>
|
|
</button>
|
|
</div>
|
|
<div class="review-block-title">WebGoat rocks!</div>
|
|
<div class="review-block-description">This is a great tool to learn about security
|
|
and have some fun with a couple challenges.
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<hr/>
|
|
<div class="row">
|
|
<div class="col-sm-3">
|
|
<img src="images/user3.png" class="img-rounded"/>
|
|
<div class="review-block-name"><a href="#">Sarah</a></div>
|
|
<div class="review-block-date">July 29, 2017<br/>12 day ago</div>
|
|
</div>
|
|
<div class="col-sm-9">
|
|
<div class="review-block-rate">
|
|
<button type="button" class="btn btn-warning btn-xs" aria-label="Left Align">
|
|
<span class="glyphicon glyphicon-star" aria-hidden="true"></span>
|
|
</button>
|
|
<button type="button" class="btn btn-warning btn-xs" aria-label="Left Align">
|
|
<span class="glyphicon glyphicon-star" aria-hidden="true"></span>
|
|
</button>
|
|
<button type="button" class="btn btn-warning btn-xs" aria-label="Left Align">
|
|
<span class="glyphicon glyphicon-star" aria-hidden="true"></span>
|
|
</button>
|
|
<button type="button" class="btn btn-warning btn-xs"
|
|
aria-label="Left Align">
|
|
<span class="glyphicon glyphicon-star" aria-hidden="true"></span>
|
|
</button>
|
|
<button type="button" class="btn btn-default btn-grey btn-xs"
|
|
aria-label="Left Align">
|
|
<span class="glyphicon glyphicon-star" aria-hidden="true"></span>
|
|
</button>
|
|
</div>
|
|
<div class="review-block-title">Nice</div>
|
|
<div class="review-block-description">I liked it and learned a couple of things.
|
|
Still some bugs sometimes though.
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<hr/>
|
|
<div class="row">
|
|
<div class="col-sm-3">
|
|
<img src="images/user2.png" class="img-rounded"/>
|
|
<div class="review-block-name"><a href="#">Tom</a></div>
|
|
<div class="review-block-date">January 27, 2017<br/>100 days ago</div>
|
|
</div>
|
|
<div class="col-sm-9">
|
|
<div class="review-block-rate">
|
|
<button type="button" class="btn btn-warning btn-xs" aria-label="Left Align">
|
|
<span class="glyphicon glyphicon-star" aria-hidden="true"></span>
|
|
</button>
|
|
<button type="button" class="btn btn-warning btn-xs" aria-label="Left Align">
|
|
<span class="glyphicon glyphicon-star" aria-hidden="true"></span>
|
|
</button>
|
|
<button type="button" class="btn btn-warning btn-xs" aria-label="Left Align">
|
|
<span class="glyphicon glyphicon-star" aria-hidden="true"></span>
|
|
</button>
|
|
<button type="button" class="btn btn-default btn-grey btn-xs"
|
|
aria-label="Left Align">
|
|
<span class="glyphicon glyphicon-star" aria-hidden="true"></span>
|
|
</button>
|
|
<button type="button" class="btn btn-default btn-grey btn-xs"
|
|
aria-label="Left Align">
|
|
<span class="glyphicon glyphicon-star" aria-hidden="true"></span>
|
|
</button>
|
|
</div>
|
|
<div class="review-block-title">WebGoat is great</div>
|
|
<div class="review-block-description">WebGoat teaches you web security with some great
|
|
lessons
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<br/>
|
|
<form class="attack-form" method="POST" name="form" action="/WebGoat/challenge/flag">
|
|
<div class="form-group">
|
|
<div class="input-group">
|
|
<div class="input-group-addon"><i class="fa fa-flag-checkered" aria-hidden="true"
|
|
style="font-size:20px"></i></div>
|
|
<input type="text" class="form-control" id="flag" name="flag"
|
|
placeholder="a7179f89-906b-4fec-9d99-f15b796e7208"/>
|
|
</div>
|
|
<div class="input-group" style="margin-top: 10px">
|
|
<button type="submit" class="btn btn-primary">Submit flag</button>
|
|
</div>
|
|
</div>
|
|
|
|
</form>
|
|
|
|
<br/>
|
|
<div class="attack-feedback"></div>
|
|
<div class="attack-output"></div>
|
|
</div>
|
|
</div>
|
|
|
|
</html> |