I would like to use Content Security Policy and make my Django web application safe without any unsafe inline code. But while it is easy to move most of the JavaScript code to external files, I also have a segment of inline code which I do not know fix. I am using Django and I have some variables in Django template context which I want to pqww to JavaScript. So currently I simply output that as inline JavaScript. But this does not work because of CSP.
<script type="text/javascript">
/* <![CDATA[ */
var documentURL = '{% filter escapejs %}{{ document.get_document_url }}{% endfilter %}';
/* ]]> */
</script>
To put the comments in answer form and add a little...
The easiest way to do this is generate a tag with an attribute set. I don't know django so I'll just leave it in plain html:
<input type="hidden" id="mything" value="<MY VALUE>">
When I have multiple, related values I might throw them into the same element:
<span class="hidden" data-attribute1="<VALUE1>" data-attribute2="<VALUE2>">
<!-- rename 'attributeN' to something meaningful obviously -->
In either case, just read the values with JS (using jquery for brevity)
$('#mything').data("attribute1")
Or if you need a complex object, throw it in a span as html entity escaped data:
<span class="hidden" id="data-container">
<your html-escaped JSON>
</span>
And read it in the external file with:
var myObject = JSON.parse($('#data-container').html());
This is also describe at https://www.owasp.org/index.php/XSS_(Cross_Site_Scripting)_Prevention_Cheat_Sheet#RULE_.233.1_-_HTML_escape_JSON_values_in_an_HTML_context_and_read_the_data_with_JSON.parse
Related
I can pass a string value to javascript function onblur when using plain html tag as shown below:
<input type="password" name="l_password" onblur="passwordValidation(this,'id_lpassword_error')" />
but when i try to do the same thing for render_field tags it doesnt work. i get error TemplateSyntaxError: Could not parse the remainder
{%render_field form.password onblur="passwordValidation(this,'id_lpassword_error')" %}
how can i pass the string 'id_lpassword_error' to a javascript function from the render_field tag in Django?
render_field is doing its own custom parsing of that tag, and it looks like it treats double quotes and single quotes the same. So it is probably looking for the tag to finish after your first single quote.
It looks like using the filter attr should work, since it is using Django's built-in template tag parsing system, which almost definitely can deal with different types of quotes properly.
So, if I'm understanding this right, something like:
{{form.password|attr:"onblur:passwordValidation(this,'id_lpassword_error')" }}
Let us know if that works.
I'm using like below code
$('#convert').click(function(){
var message = $('#textarea').val();
var converter = new Markdown.Converter();
var output = converter.makeHtml(message);
console.log(output);
$('#show').html(output);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pagedown/1.0/Markdown.Converter.js"></script>
<textarea rows="10" cols="20" id="textarea"></textarea><br>
<input type="button" name="" value="submit" id="convert">
<div id="show"></div>
But ~~satya~~ was not working
How to make strike through work.
Markdown does not include support for strike-through in its syntax. Some implementations have added support as a non-standard addon, but the syntax varies across those (few) implementations. Without checking their docs, I do not know if pagedown offers such support, but I would assume not. In fact that would be my assumption for any Markdown implementation.
That said, the rules state:
Markdown is not a replacement for HTML, or even close to it. Its syntax is very small, corresponding only to a very small subset of HTML tags. The idea is not to create a syntax that makes it easier to insert HTML tags. In my opinion, HTML tags are already easy to insert. ...
For any markup that is not covered by Markdown’s syntax, you simply use HTML itself. There’s no need to preface it or delimit it to indicate that you’re switching from Markdown to HTML; you just use the tags.
Therefore, the following Markdown:
<del>satya</del>
will result in the following rendered document:
satya
I want to create a web widget that can be embedded multiple times on the same page but with different data attribute values so I can display different data according to the data attribute value.
For example, I want to embed mywidget.js file multiple times as follows:
<body>
<div>
<script src="script/mywidget.js" data-sport="soccer" id="widget-soccer">
</script>
</div>
<div>
<script src="script/mywidget.js" data-sport="tennis" id="widget-tennis">
</script>
</div>
</body>
My question is, inside the code in mywidget.js, how do I determine the correct script tag reference and read it's data attribute so I can use that value to fetch the corresponding data from a web service. I am using only jquery and javascript.
I want the widget to be embeddable on other users sites as well so all they do is embed using only the script tag and passing in the desired data attribute value without adding anything extra anywhere they need on their website.
This is not really a very good approach, as it is very inflexible. But given that <script> tags, when not deferred, halt parsing of the document while they execute, the current script tag will be the last in the DOM; so you can get the current sport inside your script by using this:
var sport = $('script').last().data('sport');
However, it would be much better to define a function in your external JavaScript file, and then invoke it when you need to instantiate your widget (EDIT: like in Lee Taylor's answer).
Why don't you do something like:
<head>
<script src="script/mywidget.js"></script>
</head>
<body>
<div><script>createMyWidget({sport : "soccer"} );</div>
<div><script>createMyWidget({sport : "tennis"} );</div>
</body>
I don't think you can. I know it's not that nice, but I would try:
<div><script>sport = "soccer";</script><script src="script/mywidget.js" id="widget-soccer"></script></div>
<div><script>sport = "tennis";</script><script src="script/mywidget.js" id="widget-tennis"></script></div>
and use sport in mywidget.js
Another approach could be that myscript.js is actually a dynamic "page", let's say with php, then you could use src="script/mywidget.js?sport=swimming", and in the php you would print:
sport = "<?php echo addcslashes($_GET['sport'], '"'); ?>";
But even better would be:
<script src="script/mywidget.js"></script>
<div><script>showWidget("soccer");</script></div>
<div><script>showWidget("basketball");</script></div>
I think you can use jQuery to find all script tags with src="script/mywidget.js" or something
$('script[src="script/mywidget.js"]')
And then you'll have an array of scripts tags that you can loop through and access the data property using jQuery's .data() method.
I need to include a js file in my views.
But in this js file i need to interpret somes PHP variable.
Actually i do this :
#section('javascript')
<script>
alert("{{{test}}}");
</script>
#stop
But i REALLY need to do this :
#section('javascript')
{!! Html::script('js/test.js') !!}
#stop
test.js :
alert("{{{test}}}");
I need to declare a lot o variable. So my JS file will be very huge. And i don't want to show this directly in the source code.
How can i do ?
Thank you !
You can only pass the variable to the javascript like so:
#section('javascript')
<script>
var test = {{{$test}}};
</script>
#stop
then in your javascript file included at the bottom you can use it:
alert(test);
Let me just mention that this is not a great way of handling the passing variables from php to javascript.
When I need to do something like this, I usually create a meta tag on the page which would contain the alert information.
<meta name="someAlertValue" content="{{{ $test }}}" />
Then you can very easily grab that via jQuery.
var alert_text = $('meta[name=someAlertValue]').attr('content');
I find this approach to be much cleaner and maintainable than trying to drop php variables directly into your javascript.
I had the same problem, and wanted to have a stand alone js which will have bunch of variables taken from config() or even from database, multi-language, and will be configurable, or even will work with query parameters.
Maybe it's a hard way, but i've created a route:
Route::get('/js-modules/test.js',function(){ return view('js-modules.test');})->name('my_js);
So in the view resources/views/js-modules/test.blade.php you can put your js code together with your PHP stuff.
Or you can route it to a controller and have even more background work. it looks a bit slow (in the browser) on the first run , but second request it'll be cashed and retrieved as the regular js file
And now you can link it to any of your pages with
<script src="{{route('my_js')}}"></script>
How can I get Vim to correctly syntax-highlight in a situation such as this (used, e.g. with Knockout templates):
<script type="text/html" id="my-template">
<!-- This should be rendered as HTML -->
<div>Some template</div>
</script>
<script>
//This should be rendered as Javascript
var x = function() { return 3; }
</script>
The solution given here involves editing Vim's internal syntax file, which seems wrong, and it specifically looks for "text/javascript" which is no longer needed in <script> tags.
I assume the solution is some sort of syntax plugin I can keep in my .vim directory but am not familiar enough with Vim's syntax internals to figure it out.
(Note that this question and answer don't apply as I'm not using Ruby on Rails.)
Maybe this will help you: https://coderwall.com/p/vgk5-q/make-vim-play-nice-with-html-templates-inside-script-tags.
In case the link above is broken one day - put the following code into ~/.vim/after/syntax/html.vim:
unlet b:current_syntax
syn include #HTML $VIMRUNTIME/syntax/html.vim
syn region htmlTemplate start=+<script [^>]*type *=[^>]*text/template[^>]*>+
\ end=+</script>+me=s-1 keepend
\ contains=#HTML,htmlScriptTag,#htmlPreproc
Somebody should write a plugin for that! ;)
First copy the vim's internal html syntax file to $HOME/.vim/syntax/html.vim so that you only change the behaviour for yourself not globally.
Then find the line starting syn region javaScript and replace it with two lines
syn region script_notype start=+<script>+ keepend end=+</script>+me=s-1 contains=#htmlJavaScript,htmlCssStyleComment,htmlScriptTag,#htmlPreproc
syn region script_jstype start=+<script[^>]*type="text/javascript"[^>]*>+ keepend end=+</script>+me=s-1 contains=#htmlJavaScript,htmlCssStyleComment,htmlScriptTag,#htmlPreproc
The first line is for plain <script> tab, the second for <script type="text/javascript">.
However, this won't cover a situation with <script> tag without type attribute having other attributes. This case should get javascript syntax but won't. I guess this is a minor problem.