cadol_HTML
New member
Hello everybody.
Here is a simple HTML file test1.html and a separate javascript file JS_test2.js which I want to be used in test1.html.
There are three buttons (INPUT TYPE="button") in test1.html. On pressing the button 1 the js function test1() should be called which is defined in the head section of the HTML file.
On pressing the button 2 the function test2() should be called which is defined in JS_test2.js.
And on pressing the button 3 the inline function should be called defined within the INPUT.
test1.html:
JS_test2.js:
For security reason a meta tag is placed in the head of the test1.html to restrict the javascript
So far the present arrangement does not work. Not a single function can be evoked. In all three cases the console says:
So my question is how to arrange the js code to be able to run it with if "script-src 'self'"? In the real app I need to place all my js functions in a separate file. I also tried to place the line
inside the body tag. Is not working either...
Thank you in advance for your help
Here is a simple HTML file test1.html and a separate javascript file JS_test2.js which I want to be used in test1.html.
There are three buttons (INPUT TYPE="button") in test1.html. On pressing the button 1 the js function test1() should be called which is defined in the head section of the HTML file.
On pressing the button 2 the function test2() should be called which is defined in JS_test2.js.
And on pressing the button 3 the inline function should be called defined within the INPUT.
test1.html:
HTML:
<!DOCTYPE html>
<html>
<head>
<title>Test1</title>
<meta http-equiv="Content-Security-Policy" content="script-src 'self'">
<script language="JavaScript" src="JS_test2.js"> </script>
<script type="text/javascript">
<!-- Begin hiding contents from older browsers
function test1()
{
alert("Test1");
}
//End hiding the contents -->
</script>
</head>
<body>
<br>
<INPUT TYPE="button" name="sBtn1" id="sBtn1" value="Click me1" onClick="test1();">
<br>
<INPUT TYPE="button" name="sBtn2" id="sBtn2" value="Click me2" onClick="test2();">
<br>
<INPUT TYPE="button" name="sBtn3" id="sBtn3" value="Click me3" onClick="alert('test3 - inline, should be blocked');">
</body>
</html>
JS_test2.js:
JavaScript:
<!-- Begin hiding contents from older browsers
function test2()
{
alert("Test2 in separate file");
}
// End hiding the contents -->
For security reason a meta tag is placed in the head of the test1.html to restrict the javascript
<meta http-equiv="Content-Security-Policy" content="script-src 'self'">
So far the present arrangement does not work. Not a single function can be evoked. In all three cases the console says:
Content-Security-Policy: The page’s settings blocked an event handler (script-src-attr) from being executed because it violates the following directive: “script-src 'self'”
So my question is how to arrange the js code to be able to run it with if "script-src 'self'"? In the real app I need to place all my js functions in a separate file. I also tried to place the line
<script language="JavaScript" src="JS_test2.js"> </script>
inside the body tag. Is not working either...
Thank you in advance for your help