SVG security validation using safe-svg jar - svg
Svg files are validated based on the set of SVG_ELEMENTS,SVG_ATTRIBUTES defined by safe-svg validator jar. So when the svg is implemented by the tags which are not part of SVG_ELEMENTS,SVG_ATTRIBUTES then we are getting violations. So here, in which basis SVG_ELEMENTS,SVG_ATTRIBUTES are defined.
Ex of unsupported tags and attributes by safe-svg jar : missing-glyph,font-face-src,xmlns:xodm,horiz-adv-x
How the SVG_ELEMENTS and SVG_ATTRIBUTES are meant to be valid tag or invalid tags ?
Also do we have any other security validator to validate svg files other than safe-svg jar ?
Related
Liferay 7.3: How to preconfigure a portlet embedded in a page fragment?
We're using Liferay 7.3 (CE) and are trying to embrace the relatively new feature of "Content Pages" with "Page Fragments". We're able to develop page fragments that already include portlets (named "widgets" in the context of content pages), using the <lfr-widget-WIDGETALIAS> tag. So far, that works. Now we're trying to prepare page fragments that embed portlets with special portlet configuration applied. For example, we want to prepare a page fragment that just shows an asset publisher portlet configured to list WebContent articles from a pre-defined category. The user should be able to just put that fragment onto the page without having to care about the configuration of the asset publisher portlet. We did not find any direct way to achieve that -- our first guess that the configuration could be written as attributes or content of the <lfr-widget-...> tag was deterred by a hint in the liferay docs that there are no valid attributes or content to attach to that tag. Does anybody have an inkling of an idea on how to achieve embedding portlets in page fragments with pre-defined portlet configuration applied? (including out-of-the-box Liferay portlets?)
I figured it out myself.
That one thing that the Fragment Editor does not tell you is that the HTML part of a fragment actually is interpreted as a Freemarker template, with the caveat that only Freemarkers alternative syntax is allowed.
That, in turn, means that Liferays taglibs are available, which means we can use the tag <liferay-portlet:runtime> (ported to freemarker alternative syntax, of course), which does accept a defaultPreferences attribute. Now we can just configure the portlet once, find its portletPreferences XML data in the DB (see table PortletPreferences), remove values we do not want to preconfigure and then just use the resulting preferences XML as a value for the defaultPreferences attribute of the <liferay-portlet:runtime> tag.
Care has to be taken for any IDs (e.g. if you want to preconfigure an AssetCategory filter). Better fetch the corresponding object from the corresponding service and get the ID from that object.
This example provides the HTML part for a page fragment that places an AssetPublisher onto the page, preconfigured to show 12 items (instead of the default 20). (CSS, JS and Configuration of the fragment is the default as given by the Page Fragment editor.)
<div class="fragment-12345">
[#assign assetPublisherPortletPreferences="<portlet-preferences>
<preference>
<name>delta</name>
<value>12</value>
</preference>
</portlet-preferences>" /]
[#liferay_portlet["runtime"]
instanceId="${fragmentEntryLinkNamespace}assets"
portletName="com_liferay_asset_publisher_web_portlet_AssetPublisherPortlet"
defaultPreferences="${assetPublisherPortletPreferences}"
/]
</div>
Thank you for this, #orithena. You saved me a lot of trouble.
Another option, to achieve the same result but with simpler syntax, is to use the built-in freeMarkerPortletPreferences:
[#assign assetPublisherPortletPreferences=freeMarkerPortletPreferences.getPreferences({
"delta": "12",
} /]
For standalone SVG(.svg files), is it mandatory to include the the DOCTYPE and the XML declaration?
For standalone SVG(.svg files), is it mandatory to include the the DOCTYPE and the XML declaration ?
A doctype is not required some people recommend not using it In XML 1.1 the XML declaration is mandatory though. If it's omitted the document is supposed to be treated as XML 1.0 which may or may not be what you wanted. Note that browsers don't enforce this requirement so if that's your only use case you can omit the XML declaration.
TinyMCE and SVG
I'm using the latest/current TinyMCE editor (<script type="text/javascript" src='https://cdn.tinymce.com/4/tinymce.min.js'></script>) and it doesn't seem capable of displaying <svg>. I have some HTML saved in a database which contains some <svg>. When loaded in TinyMCE, it doesn't display. Is this a known issue (I've searched and haven't found much)? Any workarounds?
TinyMCE strips empty and invalid tags. You can solve it by
Adding ' ' to each empty element:
svg.find('*').each(function() {
if (!$(this).html()) {
$(this).text(' ');
}
});
here svg is your jQuery wrapped svg element.
Extending the valid elements according to the svg element reference*
extended_valid_elements: "svg[*],defs[*],pattern[*],desc[*],metadata[*],g[*],mask[*],path[*],line[*],marker[*],rect[*],circle[*],ellipse[*],polygon[*],polyline[*],linearGradient[*],radialGradient[*],stop[*],image[*],view[*],text[*],textPath[*],title[*],tspan[*],glyph[*],symbol[*],switch[*],use[*]"
*Note I added only the elements relevant for my case.
I tried Koen's first suggestion and it worked for existing SVG content (I added this in the setup callback). However it still filtered the SVG tags out when pasting HTML into the source code editor and then confirming the dialog. After digging a bit into TinyMCE's source code to see where those elements are actually removed (it's in the DomParser class) I found an undocumented editor setting for the Schema class that specifies tags that are allowed to be empty without being removed. The only annoying thing is that you can't use it to add to the existing list, you can only override it. So when setting it you have to list the tags it has in there by default as well. Use this in the settings that you provide to TinyMCE when initialising it: // First the list of tags that it normally knows about by default: non_empty_elements: "td,th,iframe,video,audio,object,script,pre,code,area,base,basefont,br,col,frame,hr,img,input,isindex,link,meta,param,embed,source,wbr,track" // Now we add tags related to SVGs that it doesn't normally know about: + "svg,defs,pattern,desc,metadata,g,mask,path,line,marker,rect,circle,ellipse,polygon,polyline,linearGradient,radialGradient,stop,image,view,text,textPath,title,tspan,glyph,symbol,switch,use", This way these SVG tags should never be filtered out because they are empty - as long as they are also valid in general, e.g. by setting the extended_valid_elements as Koen suggested above or by allowing all elements (not recommended as it leaves you vulnerable to XSS attacks): extended_valid_elements: "*[*]" Please note that this worked for my version 4.5.8 of TinyMCE. Since this setting is undocumented it might not work anymore in current or future versions. Also they might've adjusted the default list that I'm overriding here in later versions. Find nonEmptyElementsMap and shortEndedElementsMap in Schema.js in their source code to find the default list in your version (the two lists get combined) and note that in there the tags are separated by spaces but when you supply a list yourself the list is separated by commas (for whatever reason).
Seams to be TinyMCE that removes it because it is an empty tag: http://world.episerver.com/forum/developer-forum/-EPiServer-75-CMS/Thread-Container/2015/1/tinymce-and-svgs/ You might be able to use this inside the init: extended_valid_elements : "svg[*]", It works with other empty tags etc, but have never tried with SVG. From the forum post I linked to: ok,I did some debugging into TinyMCE and the problem seems to be that the svg element is detected as being empty and therefor removed. Unfortunatley there is no config way to change this behavior but there are some workarounds. Always have a name attibute for the svg element: <svg name="something" Always have a data-mce attribute for the svg element: <svg data-mce-something="something" Include some text content within the svg element: <svg> </svg> Using these techniques i could succesfully store inline svg in an xhtml property
I made it work by adding all valid SVG elements to the extended_valid_elements property of the settings object while initializing TinyMCE, no other action was needed For your convenience here's the full list of SVG elements I used a[*],altGlyph[*],altGlyphDef[*],altGlyphItem[*],animate[*],animateMotion[*],animateTransform[*],circle[*],clipPath[*],color-profile[*],cursor[*],defs[*],desc[*],ellipse[*],feBlend[*],feColorMatrix[*],feComponentTransfer[*],feComposite[*],feConvolveMatrix[*],feDiffuseLighting[*],feDisplacementMap[*],feDistantLight[*],feFlood[*],feFuncA[*],feFuncB[*],feFuncG[*],feFuncR[*],feGaussianBlur[*],feImage[*],feMerge[*],feMergeNode[*],feMorphology[*],feOffset[*],fePointLight[*],feSpecularLighting[*],feSpotLight[*],feTile[*],feTurbulence[*],filter[*],font[*],font-face[*],font-face-format[*],font-face-name[*],font-face-src[*],font-face-uri[*],foreignObject[*],g[*],glyph[*],glyphRef[*],hkern[*],image[*],line[*],linearGradient[*],marker[*],mask[*],metadata[*],missing-glyph[*],mpath[*],path[*],pattern[*],polygon[*],polyline[*],radialGradient[*],rect[*],script[*],set[*],stop[*],style[*],svg[*],switch[*],symbol[*],text[*],textPath[*],title[*],tref[*],tspan[*],use[*],view[*],vkern[*],a[*],animate[*],animateMotion[*],animateTransform[*],circle[*],clipPath[*],defs[*],desc[*],discard[*],ellipse[*],feBlend[*],feColorMatrix[*],feComponentTransfer[*],feComposite[*],feConvolveMatrix[*],feDiffuseLighting[*],feDisplacementMap[*],feDistantLight[*],feDropShadow[*],feFlood[*],feFuncA[*],feFuncB[*],feFuncG[*],feFuncR[*],feGaussianBlur[*],feImage[*],feMerge[*],feMergeNode[*],feMorphology[*],feOffset[*],fePointLight[*],feSpecularLighting[*],feSpotLight[*],feTile[*],feTurbulence[*],filter[*],foreignObject[*],g[*],hatch[*],hatchpath[*],image[*],line[*],linearGradient[*],marker[*],mask[*],metadata[*],mpath[*],path[*],pattern[*],polygon[*],polyline[*],radialGradient[*],rect[*],script[*],set[*],stop[*],style[*],svg[*],switch[*],symbol[*],text[*],textPath[*],title[*],tspan[*],use[*],view[*],g[*],animate[*],animateColor[*],animateMotion[*],animateTransform[*],discard[*],mpath[*],set[*],circle[*],ellipse[*],line[*],polygon[*],polyline[*],rect[*],a[*],defs[*],g[*],marker[*],mask[*],missing-glyph[*],pattern[*],svg[*],switch[*],symbol[*],desc[*],metadata[*],title[*],feBlend[*],feColorMatrix[*],feComponentTransfer[*],feComposite[*],feConvolveMatrix[*],feDiffuseLighting[*],feDisplacementMap[*],feDropShadow[*],feFlood[*],feFuncA[*],feFuncB[*],feFuncG[*],feFuncR[*],feGaussianBlur[*],feImage[*],feMerge[*],feMergeNode[*],feMorphology[*],feOffset[*],feSpecularLighting[*],feTile[*],feTurbulence[*],font[*],font-face[*],font-face-format[*],font-face-name[*],font-face-src[*],font-face-uri[*],hkern[*],vkern[*],linearGradient[*],radialGradient[*],stop[*],circle[*],ellipse[*],image[*],line[*],path[*],polygon[*],polyline[*],rect[*],text[*],use[*],use[*],feDistantLight[*],fePointLight[*],feSpotLight[*],clipPath[*],defs[*],hatch[*],linearGradient[*],marker[*],mask[*],metadata[*],pattern[*],radialGradient[*],script[*],style[*],symbol[*],title[*],hatch[*],linearGradient[*],pattern[*],radialGradient[*],solidcolor[*],a[*],circle[*],ellipse[*],foreignObject[*],g[*],image[*],line[*],path[*],polygon[*],polyline[*],rect[*],svg[*],switch[*],symbol[*],text[*],textPath[*],tspan[*],use[*],g[*],circle[*],ellipse[*],line[*],path[*],polygon[*],polyline[*],rect[*],defs[*],g[*],svg[*],symbol[*],use[*],altGlyph[*],altGlyphDef[*],altGlyphItem[*],glyph[*],glyphRef[*],textPath[*],text[*],tref[*],tspan[*],altGlyph[*],textPath[*],tref[*],tspan[*],clipPath[*],cursor[*],filter[*],foreignObject[*],hatchpath[*],script[*],style[*],view[*],altGlyph[*],altGlyphDef[*],altGlyphItem[*],animateColor[*],cursor[*],font[*],font-face[*],font-face-format[*],font-face-name[*],font-face-src[*],font-face-uri[*],glyph[*],glyphRef[*],hkern[*],missing-glyph[*],tref[*],vkern[*]
Unable to find or serve resource, dataList.xhtml, from library, org.apache.myfaces.custom
I am trying to implement pagination in JSF and Hibernate.
I have these statements on my html page.
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html"
xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:f="http://java.sun.com/jsf/core"
xmlns:t="http://myfaces.apache.org/tomahawk">
<t:dataList value="#{med.pages}" var="page">
I have included tomahawk20-1.1.14-bin - the jar files in /build/web/WEB-INF/lib and tomahawk-examples-1.1.14-bin - all the war files in /build/web/WEB-INF/src/META-INF
But, I get this error : Unable to find or serve resource, dataList.xhtml, from library, org.apache.myfaces.custom.
What should I do ?
I think it is caused by Mojarra (it gets confused reading the .taglib.xml, even if is valid syntax to use that file for composite and normal components, it was clarified in the new 2.2 spec) Use MyFaces JSF implementation instead to get it fixed.
I believe this is a tomahawk issue. The JSF 2.2 spec mentions this: As specified in facelet taglibrary schema, the runtime must also support the composite-library-name element. The runtime must interpret the contents of this element as the name of a resource library as described in Section 2.6.1.4 “Libraries of Localized and Versioned Resources”. If a facelet tag library descriptor file is encountered that contains this element, the runtime must examine the element in that same tag library descriptor and make it available for use in an XML namespace declaration in facelet pages. And there's also this in the spec: If you want to employ a cc with a namespace other than http://java.sun.com/jsf/composite/libraryName you need to have a taglib file that declares composite-library-name. Currently you must not declare any tag elements in such a taglib file. All the tags in such a library must come from the same resource library. In the case of tomahawk, composite-library-name does not point to a resource (a directory name under META-INF/resources), hence the errors. The simple solution here may be to remove the composite-library-name element from the tomahawk.taglib.xml file (if it's not needed for any other purpose of course). I haven't tested it however.
Do SVG docs support custom data- attributes?
In HTML5, elements can have arbitrary metadata stored in XML attributes whose names start with data- such as <p data-myid="123456">. Is this part of the SVG spec too? In practice this technique works fine for SVG docs in many places. But I'd like to know if it's part of the official SVG spec or not, because the format is young enough that there's still a lot of incompatibility between browsers, especially in mobile. So before committing to code I'd like know if I can expect future browsers to converge on supporting this. I found this message from the working group mailing list saying they "expect [they] will" support it. Did this become official?
While other answers are technically correct, they omit the fact that SVG provides an alternative mechanism for data-*. SVG allows any attribute and tag to be included, as long as it doesn't conflict with existing ones (in other words: you should use namespaces). To use this (equivalent) mechanism: use mydata:id instead of data-myid, like this: <p mydata:id="123456"> make sure you define the namespace in SVG opening tag, like this: <svg xmlns:mydata="http://www.myexample.com/whatever"> EDIT: SVG2, currently W3C Candidate Recommendation (04 October 2018), will support data- directly (without namespaces, the same as HTML). It will take some time before the support is widespread though. Thanks #cvrebert for pointing this out.
The data-* attribute is part of HTML5. It’s not a generic XML attribute. The current SVG W3C Recommendation is SVG 1.1 (from 2011-08). It doesn’t allow this attribute, as you can check in the attributes list. The same is the case for the SVG 2 Working Draft (from 2012-08). Update (2015): It seems that it’s intended to support data-* attributes in SVG 2 (currently still a Working Draft).
data-* attributes on SVG elements are officially supported in the current draft of SVG2. See: w3c/svgwg commit 1cb4ee9: Added SVGElement.dataset and allowed data-* attributes on all SVG elements. ACTION-3694: Add "data-*" attributes notes to spec. (Created on: January 15, 2015) RESOLUTION: We will reserve "data-*" attributes to be used in SVG content. The API for handling them is on Element. (from SVG WG Telecon on 15-Jan-2015) https://lists.w3.org/Archives/Public/www-svg/2014Dec/0022.html
there is a more general mechanism. svg supports desc elements which may contain arbitrary xml from other namespaces. link instances of this elements or child nodes from you own namespace by dependent ids or refid attributes. this is the relevant part of the spec (5.4).