why laravel-blade adds unwanted curly braces? - html

I have stored form HTML in the relational database.
If I retrieve HTML content using the below syntax.
{{$content["form_content"]}}
I get
this view.
Instead, if I use
{{!! $content["form_content"] !!}}
I get this view with unwanted curly braces.

Use
{!! $content["form_content"] !!}

If you use {{ }} meaning that you are escaping HTML entities. It prevents Cross-Site Scripting attacks because your input being displayed from your server/database.
If you use
{{!! "<b>some codes</b>" !!}}
then it spits
some codes which is not great idea to be shown for security sake.

I got rid of mine using
<?php echo $string->item; ?>
the ; at the end made all the difference.

Related

Is there a non-javascript/PHP way to write sample code that won't get evaluated? [duplicate]

I use the <pre> tag in my blog to post code. I know I have to change < to < and > to >. Are any other characters I need to escape for correct html?
What happens if you use the <pre> tag to display HTML markup on your blog:
<pre>Use a <span style="background: yellow;">span tag with style attribute</span> to hightlight words</pre>
This will pass HTML validation, but does it produce the expected result? No. The correct way is:
<pre>Use a <span style="background: yellow;">span tag with style attribute</span> to hightlight words</pre>
Another example: if you use the pre tag to display some other language code, the HTML encoding is still required:
<pre>if (i && j) return;</pre>
This might produce the expected result but does it pass HTML validation? No. The correct way is:
<pre>if (i && j) return;</pre>
Long story short, HTML-encode the content of a pre tag just the way you do with other tags.
TL;DR
PHP: htmlspecialchars($html);
JavaScript(JS): Element.innerText = "<html>...";
Note that <pre> is just for styles, so you have to escape ALL HTML.
Only For You HTML "fossil"s: using <xmp> tag
This is not well known, but it really does exist and even chrome still supports it, however using a pair of <xmp> tag is NOT recommended to be relied on - it's just for you HTML fossils, but it's a very simple way to handle your personal content, e.g. DOCS. Even the w3.org Wiki says in its example: "No, really. don't use it."
You can put ANY HTML (excluding </xmp> end tag) inside <xmp></xmp>
<xmp>
<html> <br> just any other html tags...
</xmp>
The proper version
Proper version could be considered to be HTML stored as a STRING and displayed with the help of some escaping function/mechanism.
Just remember one thing - the strings in C-like languages are usually written between single quotes or double quotes - if you wrap your string in double => you should escape doubles (probably with \), if you wrap your string in single => escape singles (probably with \)...
The most frequent - Server-side language escaping (ex. in PHP)
Server-side scripting languages often have some built-in function to escape HTML.
<?php
$html = "<html> <br> or just any other HTML"; //store html
echo htmlspecialchars($html); //display escaped html
?>
Note that in PHP 8.1 there was a change so you no longer have to specify ENT_QUOTES flag:
flags changed from ENT_COMPAT to ENT_QUOTES | ENT_SUBSTITUTE | ENT_HTML401.
The client-side way (example in JavaScript / JS&jQuery)
Similar approach as on server-side is achievable in client-side scripts.
Pure JavaScript
There is no function, but there is the default behavior, if you set element's innerText or node's textContent:
document.querySelector('.myTest').innerText = "<html><head>...";
document.querySelector('.myTest').textContent = "<html><head>...";
HTMLElement.innerText and Node.textContent are not the same thing! You can find out more about the difference in the MDN doc links above
jQuery (a JS library)
jQuery has $jqueryEl.text() for this purpose:
$('.mySomething .test').text("<html><head></head><body class=\"test\">...");
Just remember the same thing as for server-side - in C-like languages, escape the quotes you've wrapped your string in.
For posting code within your markup, I suggest using the <code> tag. It works the same way as pre but would be considered semantically correct.
Otherwise, <code> and <pre> only need the angle brackets encoded.
Use this and don't worry about any of them.
<pre>
${fn:escapeXml('
<!-- all your code -->
')};
</pre>
You'll need to have jQuery enabled for it to work.

How to save and show data submitted from texterea editor (tinymce)?

I am developing a website which contain a post submission. When I save the data from texterea, I noticed that the data is in html format rather than plain text. So, what is the best way to show the data in an article format? I am using tinymce editor.
I'm using laravel, thus I just simply use
auth()->user()->posts()->create([
'article' => $data['article'],
]);
To call, I use {{$data->article}}. Please noted that, I only specifically show how I save only textera input.
This is my output
Output
This is database
Database image
This is expected ouput, without html tag.
Expected output
Try this:
{ !! $data->article !! }
Blade statements {{ }} are sent to htmlspecialcharacters() to prevent XSS attacks. If you do not want your html to be escaped you have to use this syntax -> {!! !!}
https://laravel.com/docs/8.x/blade#displaying-unescaped-data
You can display html content by many ways in laravel. Here are some examples
Method 1:
#php
echo $data->article;
#endphp
Method 2:
{{ !! $data->article !! }}
Method 3:
{{ !! htmlspecialchars_decode($data->article) !! }}
OR
{{ !! html_entity_decode($data->article) !! }}
Update: Simply use <?php echo $post_data->article;?> will do the job. Can anyone explain the reason?
Output

Is it possible to encase an invalid HTML snippet in a HTML document such that the snippet does not affect the page?

I am trying to display chunks of HTML from a DB, and sometimes it is a portion of the entire HTML page, so may be invalid, since I may be returning the first 500 chars. I may get:
<h1>test</h1><div id="
At present this corrupts the containing page.
Can this be wrapped up in someway, by some tags, such that it does not corrupt the containing HTML.
My initial idea was something like:
<div>
<h1>test</h1><div id="
</div>
However this does not work.
Also it would be ideal if any valid HTML did work as expected, so the above would look like:
Test
It may not be possible, but I thought I would ask.
I am not aware of what Server Side/Client Side language you are using, but I assume you are using PHP, you need to use strip_tags() to strip all the HTML text first, and than try echoing it..
<p class="static_wrapper">
<?php echo substr(strip_tags($fetched_row['column_name']),0,100).'...'; ?>
</p>

Extra whitespace in HTML values rendered with Jade

Every time I write my HTML in Jade, I am getting extra whitespace added after each element's value.
For example, I will have a line like this in my Jade Template:
label(for="keyword") Keyword
And when it's rendered, the source will look like this:
<label for="keyword_1">Keyword
</label>
Ran into some problems with that extra whitespace messing w/ my CSS. Plus, it just doesn't look as tidy :)
Anyone know how I can prevent it from being inserted?
Check the update at the bottom
I assume you're using express - check your app settings.
app.set('view options', { pretty: false })
If you have jade rendering in pretty mode (pretty: true) then it will arrange your generated source (tags) with nested indention. Turning pretty printing off should resolve your problem (though make sure you don't have trailing space, as pointed out by #alessioalex).
If you have a reason requiring you to output pretty formatting (client spec, in my case) then you can try some other things. I had a similar issue with occurring with the textarea tag; frustrating because the whitespace is actually injected into the content of the form. The way I got around this was to embed a the literal html with the closing tag:
<textarea name="someField"></textarea>
The docs can give you some more details (search for html in this case). There is open issue #341 on github which suggests an approach like this one for scalate, but it doesn't currently work in jade (as of version 0.19.0) .
HTH
Update
Ok - subtle and cool... there is a better way to keep the sexy output from pretty: true and avoid spacing inside of a tag (my textarea example)... I just tried appending a . to the end of the tag (see code) and it Just Worked™ :-)
form(name='frmname', method='POST')
textarea(name='someField').
Renders:
<form name="frmname" method="POST">
<textarea name="someField"></textarea>
</form>
Beauty!
Why does this work? Because jade treats the . suffix on the tag as an indicator that the tag will contain a text block (only), and then no text block is provided, so it defaults to '', an empty string.

Emit raw html in ASP page?

This is extremely aggravating. I just want to simply insert raw html. I can't use the literal control because there's no ignoring the quote character. I don't want to use a script element because I'm adding it in a ascx file. I just want raw html output. Is there no operater for this?
I've properbly misunderstood you completely but:
In Classic ASP it is:
<%=("<div style=""color:red;"">html</div>")%>
output:
<div style="color:red;">html</div>