I wanna make a little input box where a user can submit a code and it happen like i they put
<script>alert("this is an alert")</script>
then a alert would pop up on the page
I need this for education purposes
<form><input type="text" name="xss"><input type="submit"></form>
<p>Result: <?= $_GET['xss'] ?></p>
Thats what i have tried but it doesnt work and w3c does not cover how to MAKE an XSS vulnerable input
There are several ways to do this. As one person suggested you could indeed use eval(). Just like the following:
<input type='text' id='vulnBox' value="alert('hello');"/>
<button onclick="eval(document.getElementById('vulnBox').value)">test</button>
Here's the corresponding fiddle example JSFiddle
If your interaction is more client to server then you could use $_GET in php to read your malicious javascript from the url and output into the contents of the page.
So someone would visit the page with a URL like:
yoursite.com?xss=%3Cscript%3Ealert()%3C%2Fscript%3E
and your php file would contain:
<?php echo urldecode($_GET['xss']); ?>
Hope this helps!
Related
I was wondering if it would be possible to have a php file grab data from a html page with an input box, so that the user enters a word, and the php runs using that word in the script once the user hits enter. Any help would be appreciated.
Use a form with the method attribute set to ‘get’ or ‘post’ like this:
<form method=“post”>
<input type=“text” name=“test” value=“test” />
<button type=“submit”>submit</button>
</form>
Then on the same php page, use this to get the result, store it in a variable and output it:
<?php
$result = $_POST[‘test’];
echo $result;
?>
More information:
https://developer.mozilla.org/en-US/docs/Web/HTTP/Methods/POST
https://developer.mozilla.org/en-US/docs/Learn/HTML/Forms/Your_first_HTML_form
Hope the formatting in this answer is ok, typed it out on my mobile phone.
I am creating a website backed by a database. I have created my forms that collect the information but now i need to read in the input from the form when user clicks submit and process it for mySQL. I am having my form action be a new page but I can't figure out how to read in value from the previous page. My Form code looks like this:
<div data-wrapper-react="true">
<span class="form-sub-label-container" style="vertical-align:top;">
<input type="text" id="first_3" name="q3_fullName3[first]" class="form-textbox validate[required]" size="10" value="" data-component="first" />
<label class="form-sub-label" for="first_3" id="sublabel_first" style="min-height:13px;"> First Name </label>
</span>
When user hits submit the action for this page is connect.php. I am not sure how to read in the value there. I tried this following command:
document.getElementById("first_3").value;
This just displays the code on blank html page for connect.php and not read in the values. The data from the forms needs to be processed into different tables if someone can help with that as well that would be great. Thanks
Form handling, in the way you are describing, is something you do server-side. PHP is handled on the server first where PHP tags can be evaluated to HTML, then this is returned to the browser. You would not handle form input from javascript, until after your PHP has done something with it. Here is a refresher: https://www.w3schools.com/php/php_forms.asp
<?php echo $_POST["q3_fullName3[first]"]; ?> would output the value into the HTML page allowing you to do something like this:
console.log("<?php echo $_POST["q3_fullName3[first]"]; ?>");
If you view source of the HTML, you will notice the PHP tag is gone and replaced with the form field value.
It sounds like you might want to get a book about PHP + MySQL since interacting with a database is a more advanced topic. I can recommend this one:
https://www.amazon.com/Learning-PHP-MySQL-JavaScript-Javascript-ebook/dp/B00QUBHNFI/ref=mt_kindle?_encoding=UTF8&me=
I am trying to build a PHP webpage with the following behaviour:
1- A client access the webpage (that contains some buttons);
2- When the webpage is loaded, the PHP script opens a file stored on the server and, based on the information in this file, enables/disables some of the buttons, so that the client can see the webpage with the correct buttons enabled or disabled.
To enable/disable buttons, I know I can use javascript, while to read the file on the server I use PHP as stated above.
How do I put the two things together? Or should I use a PHP code equivalent to the following javascript line:
<script>document.getElementById("button1").disabled = true;</script>
At first I thought that inserting this line in the PHP code was the solution, but then I found out that this can't work for obvious reasons.
Thanks for the help!
Is it correct if I add the following javascript function in the head section of my webpage?
<script>
function enableButtons() {
<?php
if($state=="state1") {
echo 'document.getElementById("button1").disabled = true;';
}
else if($state=="state2") {
echo 'document.getElementById("button2").disabled = true;';
}
?>
}
</script>
I call the enableButtons() function when loading the page by using
<body onload="enableButtons()">
The php code above is just an example, the number of states and buttons is higher, that's why I would like to use this solution.
The common thing to do is to have php read the settings file, and echo the "disabled" attribute on the buttons before sending the output to the user browser. You can get more info about the attribute here here.
You do not need javascript.
Do something like this:
<button type="button" <?php if($state === 'state1') echo 'disabled'; ?>>Button text</button>
Usually you send to the client the buttons already disabled and use js to respond to any event that happens after sending the page, like selecting a combo box value..
You can omit the code, using an if sentence, or hide them using css. First approach is preferred.
Script
<script>
function isValid(f){
if(f.test.value==''){
alert('please enter name');
return false;
}else{
$(".bbutton").html("Processing please wait");
return true;
}
}
</script>
HTML
<form method="post" onsubmit="return isValid(this);">
<input type="hidden" name="te">
<input type="text" name="test">
<div class="bbutton">
<input type="submit" value="send">
</div>
</form>
When you submit the form then it will automatically hide the submit button to avoid pressing again and again, and you can redirect it to other page. May be this idea helpful.
I declare a variable at the beginning of my .js file:
var option="blabla";
On page 1.html I click on a link to page 2.html where I have
<script>document.write(option);</script>
No text is displayed on 2.html. When I refresh the browser while I am on 2.html I get undefined as an output.
What do I have to do to have the text displayed straight after I click the link?
Alternatively, how can I get the following code work to output strUrl on 2.html:
on 1.html I have a link:
<a href="2.html" onclick="function1("item")">
on 2.html I have a div:
<div id="display">document.write(strUrl);</div>
then I have in my .js file:
function1(searchitem)
{
strUrl = 'http://blabla.com/'
+ '?key=' + searchitem;
}
You try to create a Javascript variable on a page and then use it on another page. This is a more-or-less broad problem, since you want to maintain values across pages. First of all, you need to decide where is this value going to be defined and where is it going to be used. If this is more like a server-side variable, then you need to define it on server-side and then generate it into your Javascript code. If you are using PHP, then you can do it like this:
<script type="text/javascript>
var foo = '<?php echo $bar; ?>';
</script>
Naturally, you need to initialize $bar to be able to do that. If the variable should be a client-side variable, then you need to use localStorage, like this on 1.html:
localStorage.setItem("option", "blablabla");
and then load it on 2.html:
localStorage.getItem("option");
Or, if you need to use it both on server-side and client-side, then you can use a cookie for this purpose. Using cookies i slightly more complex, but my answer to another question should get you going.
Let's focus on the cause this did not work for you. A Javascript variable will cease to exist when the page is unloaded, so you will not be able to use its value after that. So, you need to persist it somehow, storing it either on the server or the computer where the browser is being run.
As a side-note, I should mention that you can use Javascript variables accross pages if you load some pages inside iframes of a page, but that is a different scenario.
This is what FORMS and AJAX were invented for. If your server has a PHP processor (virtually ALL of them do), then you can rename your .html files to .php and use a bit of PHP to accomplish your goal.
A web page ending with .PHP works exactly the same as one ending in .html, except that you can now add snippets of PHP code where desired. It is not necessary to have any PHP code, but if you have some it can do stuff.
Method One: FORMs
If you want to switch to page2.html and see a value sent from page1.html, you can use a FORM construct and post the data from page1 to page2:
page1.php
<form action="2.html" method="post">
<input name="option" type="text" />
<input type="submit" name="sub" value="Go" />
</form>
page2.php
<?php
$p1 = $_POST['option'];
?>
<div>On page1 of this website, you typed: <?php echo $p1; ?>. That's what you did.</div>
Note how a <form> uses the name= attribute for the name of the variable that is sent to the other side.
Example Two: The AJAX method
HTML:
<div id=nonForm">
<input id="option" type="text" />
<input type="button" id="myButt" value="Go" />
</div>
<div id="results"></div>
jQuery:
$('#myButt').click(function(){
var opt = $('#option').val();
$.ajax({
type: 'post',
url: 'page2.php',
data: 'option='+opt,
success: function(john){
if (d.length) alert(john); //display result from Page2 in a pop-up box
$('#results').html(john); //Or, display it right on the page
}
});
});
PAGE2.PHP -- The AJAX processor file
<?php
$opt = $_POST['option'];
//Now, you can do something with the data in $opt, and then send back a result
$rtn = 'Hey, you sent: ' .$opt;
echo $rtn;
The primary (and most important) difference between the two methods is that the FORM will change pages on you. The user will be sent from Page1 to Page2, and the screen will flash as this happens.
What's exciting about AJAX is it sends data to Page2, where Page2 can do something with it (for example, a database lookup), and then Page2 sends different data back to Page1. This new data can then be displayed on the page WITHOUT the page refreshing.
Here are a couple of very basic AJAX examples, to get you going:
AJAX request callback using jQuery
Re editing... this question has NOT been answered before!
I had understood that changing the contents of a current page with window.location replaced the cached version of the original page ( from the "last" history), so that you really couldn't go back with the browser BACK button. I had even seen this posted as a solution to preventing a malicious visitor from using the BACK button to to re-submit a mail form many times. But it is NOT workable because in the case of a mail form, the BACK button will just take the user back to the pre-POST version of the page.
So, I can use javascript to reset the form, disable the SUBMIT button, change to another page after success, or do whatever I want to the page. But its all for nothing if a simple click of the BACK button followed by SUBMIT causes the form to post again with just 2 clicks.
I know there are a lot of solutions to preventing malicious form resubmissions I can try, but I've had trouble getting them to work, and so I'd just like to know if removing the last history is a dead end. If there is a way, and it is pretty cross browser friendly, then I can just make it part of my scripted actions once my form is successfully processed, and my "thank you" page displays. Basically I'd want my "thank you" page's 'onload' event to either erase the last history, or in a browser compatible way disable the BACK button!
For what its worth, I've included code from simple test I've been working with. You can put some junk in the fields and hit submit. The vars are cleared in the PHP, the form fields are force cleared in javascript, and a new 'location' is invoked. Unfortunately, hitting BACK button will take you back to the "pre-posted" form, with all the strings you added still intact.
<!DOCTYPE HTML>
<html>
<head>
<title> Form Behavior Test</title>
</head>
<!--
<?php
$name = $email = $comments = "";
$formDone = false;
if ($_SERVER["REQUEST_METHOD"] == "POST" )
{
$formDone = true;
$name = $email = $comments = "";
}
?>
-->
<body >
<table border="1"><tr><td style ="text-align:right;" width=100%>
<form name="contactform" id="contactform" method="post" enctype="multipart/form-data" action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]);?>">
Name: <input type="text" name="name" id="name" value="<?php echo $name;?>"><br>
Email: <input type="text" name="email" id="email"value="<?php echo $email;?>"><br>
<br>
<div align="center"> ---- <span class="error">*</span> Message ---- <br>
<textarea name="comments" id="comments" wrap="physical" cols="40" rows="10" ><?php echo $comments;?></textarea>
</div>
<input name="submit" id="submit" type="submit" value="Submit" >
</form>
</td></tr></table>
<script language="JavaScript">
if (<? echo ($formDone == true) ? 'true' : 'false'; ?>)
{
document.getElementById("name").value = "";
document.getElementById("email").value = "";
document.getElementById("comments").value = "";
document.getElementById("submit").value="Disabled";
document.getElementById("submit").disabled=true;
// substitute with a thank you page
window.location = "http://google.com";
}
</script>
</body>
</html>
After searching pretty exhaustively, I don't believe there is any way to remove a page from history, except on the very latest browsers that support newer HTML-5 history methods. I'm still open to solutions but at this point I think the easiest thing will be for me to set a cookie anytime a successful email is processed by my PHP code. Then, I can also make the PHP or a javascript snippet look for the cookie and if found, I can take all kinds of actions... wipe out all filled in fields (as they would be if the BACK button is pressed), block the email, politely inform the user that he/she must wait (until my cookie expires) to send another email though the form, etc.
I didn't want to do this originally because the BACK button doesn't actually re-load the page, it just displays it. If there were a universal browser compatible way to make pages reached by back buttons actually re-load, this would never have been a problem to begin with. So even with a cookie, my defensive actions couldn't activate until the SUBMIT button is pushed. I guess I can live with that. Also, even today, some people are paranoid about cookies and turn them off. But if I want to be adamant about it, I can just detect when I can't set a cookie, and inform the user that cookies are required to use my email form. If that's too big a deal, oh well!
Thanks to those that contributed. The fact is, the LACK of answers is really a very useful answer sometimes. When I post on any stackoverflow forum and don't get any answers pretty quickly, its a good red-flag that things are going to get convoluted really fast if I don't consider an alternate approach! :-)