Why XSS doesn't work at a created HTML Page? - javascript

Hello I'm practice on XSS-Attack in an HTML Page that I created, but it doesn't work for me.
This is the HTML Page:
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title>Try to XSS this!</title>
<script language="javascript" type="text/javascript">
var send = function () {
var data = document.getElementById("msg").value;
document.getElementById("demo").innerHTML = data;
}
</script>
</head>
<body>
<p>Enter an XSS exploit here:</p>
<textarea id="msg" rows="10" cols="20"></textarea>
<br />
<input type="button" id="send" onclick="send();"/>
<br>
<p id="demo"></p>
</body>
</html>
This is the XSS-Exploit (I write it in the <textarea>):
hello</p>
<script>alert("XSS");</script>
<p>
And this is the result (I show the <p id="demo"></p> part):
<p id="demo">
"hello"
<p></p>
<script>alert("XSS");</script>
<p></p>
</p>
And the command alert("XSS"); doesn't work. What did I do wrong?

Script tags only run on page load; when you dynamically inject them into the page, script tags aren't run. The common bypass to this is to use onerror or onload like <img src=x onerror='alert(1)'> or <svg onload='alert(1)'></svg>

Related

Why won't this code work to get the text from a HTML textbox and display it in a paragraph?

Why won't the code display the text from the textbook in the paragraph tag? I tried to take the code from the text box by using the onclick command and the function getVal() but it won't work.
<!DOCTYPE html>
<html>
<head>
<title>Test</title>
<script src="test.js">
function getVal1(){
var text = document.getElementById('text').value;
var par = document.getElementById('par');
par.innerHTML=text
}
</script>
</head>
<body>
<form>
<input type="text" id="text">
<input type="submit" value="Submit" onclick="getVal1()">
</form>
<p id="par"></p>
</body>
</html>
It cant work because you submit (which includes a reload) of the page.
Take a input type="button"instead.
function getVal1() {
var text = document.getElementById('text').value;
var par = document.getElementById('par');
par.innerHTML = text
}
<!DOCTYPE html>
<html>
<head>
<title>Test</title>
</head>
<body>
<form>
<input type="text" id="text">
<input type="button" value="Submit" onclick="getVal1()">
</form>
<p id="par"></p>
</body>
</html>

ckeditor update textarea from javascript

I have used CKEditor a year now and everything has worked as it should.
Now I need to change the text in the textarea using javascript.
I have created an example that illustrates my problem.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CKEditor Sample</title>
<script type="text/javascript" src="/ckeditor/ckeditor.js"></script>
<script type="text/javascript">
function othertext() {
document.getElementById('button').value = 'xxx';
document.getElementById('noteditor').innerHTML = '<h1>Hello other world!</h1><p>I'm also an instance of CKEditor.</p>';
document.getElementById('editor').innerHTML = '<h1>Hello other world!</h1><p>I'm also an instance of CKEditor.</p>';
CKEDITOR.replace('editor');
}
</script>
</head>
<body id="main">
<input type="button" id="button" onclick="othertext();" value="NewText" />
<br>
<textarea id=noteditor>
<h1>
Hello world!
</h1>
<p>
I'm an instance of CKEditor.
</p>
</textarea>
<br>
<textarea name=text id=editor>
<h1>
Hello world!
</h1>
<p>
I'm an instance of CKEditor.
</p>
</textarea>
<script type="text/javascript">
CKEDITOR.replace('editor');
</script>
</body>
</html>
When I click the button, the value of the button changes, the same with the first textarea (id=noteditor).
But textarea (id=editor) is not affected.
Why?
In debugger, when the line "CKEDITOR.replace('editor1');" in function othertext is executed I get <exception>:TypeError.
What am I doing wrong?
I found a solution to my problem!
By chance I found the answer to my question here: http://sdk.ckeditor.com/samples/api.html under "Using CKEditor API".
I have rewritten my first code here below:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CKEditor Sample</title>
<script type="text/javascript" src="/ckeditor/ckeditor.js"></script>
<script type="text/javascript">
function SetContents() {
// Get the editor instance that you want to interact with.
var editor = CKEDITOR.instances.editor_Area1;
var value = document.getElementById('HTMLArea' ).value;
// Set editor content (replace current content).
// http://docs.ckeditor.com/#!/api/CKEDITOR.editor-method-setData
editor.setData( value );
}
</script>
</head>
<body id="main">
<input type="button" id="button" onclick="SetContents();" value="Set text" />
<br>
<textarea id=HTMLArea>
<h1>
Hello other world!
</h1>
<p>
I'm an other instance of CKEditor.
</p>
</textarea>
<br>
<textarea name=text id=editor_Area1>
<h1>
Hello world!
</h1>
<p>
I'm an instance of CKEditor.
</p>
</textarea>
<script type="text/javascript">
CKEDITOR.replace('editor_Area1');
</script>
</body>
</html>
When clicking on the button, the content of the editor-area is replaced by the html from the textarea "HTMLArea".

POP up triggered by a click

I am trying to open a popup by clicking on a button.
Please check my below code and tell me why it isn't working.
I am using getreponse popup
http://www.reussirlegmat.com/2499-2/
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
</head>
<body>
<button id="button" >Show it</button>
<script type="text/javascript" src="https://app.getresponse.com/view_webform_v2.js?u=BaAuE&webforms_id=7152504">{
"name": "myuniqueform2"
}
</script>
<script>
var myform = GRWF2.get('myuniqueform2'),
element = document.getElementById('button');
element.addEventListener("click", function(){
myform.show();
});
</script>
</body>
</html>
On your website, something has put <p>...</p> tags around every line of your script.
<p><script type="text/javascript" src="https://app.getresponse.com/view_webform_v2.js?u=BaAuE&webforms_id=7152504">{</p>
<p>"name": "myuniqueform2" </p>
<p>} </p>
<p></script> </p>
<p><script> </p>
<p>var myform = GRWF2.get('myuniqueform2'),</p>
<p>element = document.getElementById('button');</p>
<p>element.addEventListener("click", function(){ </p>
<p>myform.show(); </p>
<p>}); </p>
<p></script> </p>
<p></body></p>
<p></html></p>
Those are causing parse errors. Get rid of them.
I have no idea how you did this -- I suspect you edited the code with a word processor and then told it to export to HTML.

Cannot change html content of div tag

I must not understand how to change the content of my <div> tag.
Here is my html file:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script src="simple.js"></script>
<title>simple</title>
</head>
<body>
<div id="results" name="results"><!-- Results are displayed here -->
<form method="post" name="start">
<p>Enter url: <input type="text" name="myurl" size="100" /></p>
<button onclick="myFunction()">Click me</button>
</form>
</div>
</body>
</html>
Here is my .js file:
function myFunction() {
alert('hey');
document.getElementById("results").innerHTML = "Hello World";
}
When I click the button the alert pops up but the html does not change to "Hello World". It just stays the same :(
What am I doing wrong here.
Update: Thanks everyone! Here is what I have working now:
HTML:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>simple</title>
</head>
<body>
<div id="results"><!-- Results are displayed here -->
<form method="post" name="start" target="_blank">
<p>Enter url: <input type="text" id="myurl" size="100" /></p>
</form>
<button id='clickme'>Click me</button>
<button id='noclickme'>No Click me</button>
</div>
<script src="simple.js"></script>
</body>
</html>
My .js file:
function say_something(s) {
document.getElementById("results").innerHTML = s;
}
document.getElementById("clickme").addEventListener("click", function(){
var url = document.getElementById('myurl').value;
if (url==null || url=="") { alert("Please supply a url"); return false; }
say_something( "Hello World [" + url + "]");
});
document.getElementById("noclickme").addEventListener("click", function(){
var url = document.getElementById('myurl').value;
if (url==null || url=="") { alert("Please supply a url"); return false; }
say_something( "Goodbye [" + url + "]");
});
A button's default behaviour is to submit the form. In this case, the action being blank, it will try to submit to the current URL. You need to prevent that from happening. Also it's bad form to put Javascript inside your HTML like that - use addEventListener instead:
document.querySelector("#results button").addEventListener("click", function(e) {
e.preventDefault();
alert('hey');
document.getElementById("results").innerHTML = "Hello World";
});
Note you'll need to include your script before the </body> rather than in <head> when using this method, or use the DOMContentLoaded event listener.
Example jsFiddle
The reason is the form label.
when you click the button, the form will take an action,but you did not have a certified action, so the chrome will take the defautl action,ie reload the html.
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>simple</title>
<script src="simple.js"></script>
</head>
<body>
<div id="results" name="results"><!-- Results are displayed here -->
<form method="post" name="start" target="_blank">
<p>Enter url: <input type="text" name="myurl" size="100" /></p>
<button onclick="myFunction()">Click me</button>
</form>
</div>
</body>
</html>

javascript changing value of form element and socket.io

I have the following code that works:
<html>
<head>
<script>
function loaded(){
oFormElement = document.forms['test form'].elements["txtStatus"];
oFormElement.value = "just loaded";
}
</script>
</head>
<body onload="loaded()">
<p>my first socket.io test</p>
<form id = "test form">
<input type="text" id ="txtStatus" value="">
</form>
</body>
</html>
now, if I include the reference to socket.io, it stops working
<html>
<head>
<script src="socket.io/socket.io.js">
<script>
function loaded(){
is this because socket.io handles from elements in it's own way, or is because the browser cannot find socket.io ? Is there any way to debug this/fix this ?
You need to close the first <script> tag...
<html>
<head>
<script src="socket.io/socket.io.js"></script>
<script>
function loaded(){
// ...

Categories

Resources