24/7 Support: 800.608.6482

Get Started

Videos | Output Encoding



Video Transcript

In Miva Merchant, there are three encoding options when you want to output a variable to the page. There’s no encoding, there’s entity encoding and there’s attribute encoding. We’re going to look at each of them to show the difference and when to use which one. Anytime you want to output a variable to the page you’re always going to use the syntax &mvt and then : and then the variable name. In a previous video I told you it will always be this syntax. However, that’s not 100% true. There are two other options that we can use. &mvte: and &mvta. In html there are special reserve characters called entities such as the greater than or less than sign. These are reserve characters in html because they are used as part of the html syntax. If you’ve ever looked at html and seen &nvsp; which stands for non breaking space, this is an html entity. Or you’ve seen & which stands for &, this is another html entity. It’s another way in html to tell the browser to display the & character without actually putting the & character. So in Miva, when you prefix the variable with &mvte, it will find any entity characters and it will encode them with the html equivalent. Now why is this useful? Well, that main reason has to do with security and crosssight scripting. Anytime you’re accepting user input, say from a form, and writing that value back to the page, say on a confirmation screen, you want to make sure that your entity encoding that output. This will prevent a malicious attacker from say inserting some javascript and allowing it to execute on a resulting page. It will take the greater and the less than sign and it will output them as <: >: which stands for less than and greater than. Now attribute encoding is very similar, however, it’s mostly used for urls.

Say for example there was a variable you wanted to include in the url, however there was a chance that it could include a space. Well, spaces are not valid characters for urls. So, what attribute encoding does, it looks for special characters like the space that are not usable within the url and will convert them to their attribute equivalent. In this case with a space, if you’ve ever seen a %20 in the url that is the attribute equivalent for the space that the browser can read. It’s up to you the developer to determine which outputting coding you need. Most of the time you will probably see most common use &mvte just out of precaution. However, if you have a variable that you know doesn’t contain any reserve characters, outputting it with no encoding works just fine. Let’s take a look at some real life examples of when you’d use each of these. So over here in my text editor, I’ve created two examples to illustrate the difference of attributing coding and entity coding. So let’s take a look at this first one. So here I’m creating a variable called g.myvariable and I’m putting in some javascript tags. I’m trying to alert the words “oh no.” Here, my output, because I’m not encoding it, it should take exactly what I have in here and should output it straight to the screen. Now you can see how this can be a security issue when an attacker would input some javascript tags into a form submit that gets output to the next page. Let’s see how this works. So here, back at my Miva Merchant Admin I’m going to go to the storefront page and I’m just going to put it down here in the content section. Hit update. Now if I click over to the front of the website, here’s my storefront page and I hit refresh, so you’ll see the javascript executed. So if I go and look at the source to this you’ll see here’s my script tag. It got output to the page without any encoding which is bad. So now let’s jump back and make a change. Let’s make this entity encoded by adding an “e.” What that “e” does is it will find any greater than or less than sign and it will actually convert it to its html entity equivalent. Let’s take a look. Now if I go back to the front end and refresh this you’ll see it printed our code to the page and didn’t actually execute the javascript. If we view the source here you’ll see here’s my output and the left bracket got converted to < which is the html equivalent of the less than sign and same thing here for the greater than sign. So, because it got converted to its html entity, the browser will not execute it, which is good. This is what you want. Any time you have an input that is being output directly to the page, you want to make sure it gets entity encoded. Let’s jump back here to the other example for attribute encoding. So here I have a new variable called attribute encoded and I’m giving it a value of a string, “This is attribute, encoded’ - so the space in there and the comma should be encoded. So here I’m going to output &mvta for attribute encoding, and I’m outputting my variables. Let’s grab this and paste it in here, I’ll update the page and go back to the front end and refresh. So you’ll see that instead of outputting the spaces and the comma, it converted the spaces to plus signs and it converted the comma to %2C which is the attribute equivalent for the comma. This actually would be valid if used within the url. So hopefully those two examples illustrate the difference between attribute encoding and entity encoding and when to use each.



Example Code

Reference Documentation




comments powered by Disqus

Looking for Developer Docs?

We have a whole section for that, including: Developer Training Series, Template Language docs, Module Development tutorials and much, much more.

Head to the Developer Section

Miva believes that all online businesses should have access to a scalable ecommerce platform that can meet their unique business requirements. Miva offers PCI compliant ecommerce, hosting, and custom website design and development solutions. Miva customers have processed over $100 billion in online sales since 1997.

Copyright © 2016 Miva, Inc - All Rights Reserved   Privacy Policy | Store Policy

Links
Contact Us
Receive Tips & Updates

Copyright © 2017 Miva, Inc - All Rights Reserved

Back To The Top