Script issue with RTE

[Syeda_Yasmeen_B]

In AEM 6.3 script tag is not getting saved when configured via RTE.

Below are the observations we noticed

1.If we tried giving <script></script> in source edit and come back to normal view within dialog before closing, script is removed,

this is fixed by doing changes in whitespaceprocessor.js by removing script

2. On click of dialog save, values are not getting retained in jcr:content node. script tag is getting removed.

And also src attribute for img tag is getting removed for few url's

below are the steps which helps us to solve few issues

1.We overlayed /apps/cq/xssprotection/config.xml which solves issue by adding required url.

2. This works only for few scenarios and fails if we are trying to use below img src tag

<img class='avia_image ' src='https://s3.amazonaws.com/cision-wp-files/us/wp-content/uploads/2018/03/12155415/marketing_content_2....' alt='' title='marketing_content_2' itemprop="contentURL"  />

Help is Appreciated !!

Thanks

[smacdonald2008]

I am not following what you are trying to do. Are you following Adobe documentation when modifying the RTE like this., Can you ponit the community to the doc so this can be reproduced.

[Syeda_Yasmeen_B]

We are using the standard OOTB component and just trying to add an HTML which contains a script tag , On saving the Dialog, the script tag and entire content within the script is getting stripped of , leaving only with HTML.

Does this answer to your query?

[smacdonald2008]

I am concerned when you say you have to modify whitespaceprocessor.js. As far as i know - there are no AEM instructions prompting you to modify this JS file.

If there are - can you point me there.

[Syeda_Yasmeen_B]

Hi Scott,

Thanks for you reply,

I had modified the whitespaceprocessor.js by referring to the solution given in below thread.

Is it possible to add javascript in rte? If yes, then how?

Even after trying the above solution the issue still exists.

Let us know what needs to be done further.

[smacdonald2008]

Our touch UI expert said this article is applicable to your use case: http://experience-aem.blogspot.com/2015/05/aem-6-sp2-handling-custom-protocol-in-link-href-in-rte.ht...

[kautuk_sahni]

Similar thread:-

[Pablo_Larrosa-R]

hi Syeda ,

You were able to solve this ??

I'm running into the same issue that the RTE is removing the src attribute from the <img> tag

[arunpatidar]

Hi,

You can check /libs/cq/xssprotection/config.xml for img tag valid rules.

Thanks
Arun

[Pablo_Larrosa-R]

Thanks Arun,

For the img tag inside the RTE wasn't a missing configuration inside the /libs/cq/xssprotection/config.xml

It was the /libs/clientlibs/granite/richtext/core/js/HtmlSerializer.js the one stripping out the src attribute from the img tag.

[arunpatidar]

Hi,

I tried to add img tag from source works for me.

I didn't do any config.

[Pablo_Larrosa-R]

Which AEM version did you test it ??

We are using AEM 6.3 and created a RTE plugin that consumes a third party application and with the html being returned pasted inside the RTE. When we start switching ( or directly accept the dialog changes) from the plugin view source  it remove the src attribute form the image tag

[arunpatidar]

Hi,

I tested in 6.3.

Are you able to create img tag manually from source editor as I did?

[Pablo_Larrosa-R]

Yes, from the source editor yes.

But not if you use a custom RTE plugin that add html snippets. And I think Syeda ( that created this thread ) had the same issue

[Syeda_Yasmeen_B]

Hi,

This works fine for few img tags without customization.

Script issue is still there with RTE,we are using text area instead of RTE if html has script.

[arunpatidar]

Hi,

I observed only one thing if you put src in single quotes then values are getting stripped.

Try to convert src attribute value in double quotes

e.g. <p><img src="https://forums.adobe.com/community/image/5429/2.png?a=843130" alt="img1"></p>

src getting stripped for  <p><img src='https://forums.adobe.com/community/image/5429/2.png?a=843130'  alt="img1"></p>

[Pablo_Larrosa-R]

If you look into http://localhost:4502/crx/de/index.jsp#/libs/clientlibs/granite/richtext/core/js/HtmlSerializer.js  in the line 272 it uses a attribMapping array. That mapping is defined

CUI.rte.HtmlSerializer.HELPER_ATTRIB_MAPPINGS = {

    "a": [ "href", CUI.rte.Common.HREF_ATTRIB ],

    "img": [ "src", CUI.rte.Common.SRC_ATTRIB ]

};

CUI.rte.Common.SRC_ATTRIB search for _rte_src, cause I'm only adding the src attribute it stripped out src tag.

That was what I found debugging, in order to avoid this behavior I had to overlay this file and did the modification that I needed.

[link edited on poster's request.]

[arunpatidar]

Yes,

I can see while It is added in dialog it add _rte_src attribute. If I removed that attribute and save again, src attribute striped again.

That could be the reason.

I tried to add below works for me it converts _rte_src to src

<img alt="img1" _rte_src="https://forums.adobe.com/community/image/5429/2.png?a=843130">

Not sure if anything above is useful or not for you.

[Pablo_Larrosa-R]

Thanks Arun,

It's not an option cause I'm using a third-party application that return the html snippet to put inside the RTE and I want to avoid parsing the html.

As a workaround I extended HtmlSerializer.js and changed that behavior, after that everything works

[arunpatidar]

Hi,

I am glad it works for you at the end. Sometimes we need to modify OOTB things to adapt for custom use.

[dasiascott99]

I found that adding _rte_src="your_url" in addition to src="your_url" keeps your src attribute from getting stripped and becoming null after saving your rte.