Embed video tag in rich text editor is not working in AEM as a cloud service | Community
Skip to main content
V
Venkata-Nelluri
Level 2
July 16, 2024
Solved

Embed video tag in rich text editor is not working in AEM as a cloud service

  • July 16, 2024
  • 2 replies
  • 1423 views

Hi,

I was trying to embed a video in rich text editor through source edit as below .On saving the dialog the video tag is getting saved in the property but when I open the dialog again the video tag is not appearing and at the same time the video is not being displayed on the page too .

<video width="100%"><source src="videoUrl" type="video/mp4"></source></video>

I have tried adding the video tag in the XSSProtection config file, unfortunately that didn't work .

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
Best answer by kapil_rajoria

Hi @venkata-nelluri for some reason doing the entry of source tag seems to be not working in config file. @arunpatidar can you help with the same? The code is above.

@venkata-nelluriif you can use this html instead:
<video src="/asset_path/video.mp4" data-type="mp.4"></video> the below code works fine:

<tag name="video" action="validate"> <attribute name="src"> <regexp-list> <regexp name="anything" value=".*" /> </regexp-list> </attribute> <attribute name="data-type"> <regexp-list> <regexp name="anything" value=".*" /> </regexp-list> </attribute> <attribute name="loop"> <regexp-list> <regexp name="anything" value=".*" /> </regexp-list> </attribute> <attribute name="autoplay"> <regexp-list> <regexp name="anything" value=".*" /> </regexp-list> </attribute> <attribute name="muted"> <regexp-list> <regexp name="anything" value=".*" /> </regexp-list> </attribute> <attribute name="controls"> <regexp-list> <regexp name="anything" value=".*" /> </regexp-list> </attribute> <attribute name="width"> <regexp-list> <regexp name="percentage" value="\d+%|100%" /> </regexp-list> </attribute> </tag>

When I am putting the source tag validation, the above code also fails but works well in without it.

2 replies

kapil_rajoria
Community Advisor
kapil_rajoriaCommunity Advisor
Community Advisor
July 16, 2024

Hi @venkata-nelluri can you share the code which you have added in xssprotection config file?

Please try this:

 

<tag name="video" action="validate"> <attribute name="width"> <regexp-list> <regexp name="percentage" value="\d+%" /> </regexp-list> </attribute> </tag> <tag name="source" action="validate"> <attribute name="src"> <regexp-list> <regexp name="anything" value=".*" /> </regexp-list> </attribute> <attribute name="type"> <regexp-list> <regexp name="video-mp4" value="video/mp4" /> </regexp-list> </attribute> </tag>

 

Also, please check your RTE is correctly made in .content.xml or use the OOTB text component for testing.

    V
    Venkata-NelluriAuthor
    Level 2
    July 16, 2024

    Hi @kapil_rajoria ,Thanks for the response

    I have tried with the given configuration ,still it's not working .Please find the dialog structure I have created for the reference.

     

      MukeshYadav_
      Community Advisor
      MukeshYadav_Community Advisor
      Community Advisor
      July 16, 2024

      Hi @venkata-nelluri ,

      Please try below rules in config which is working for me.

       

      <tag name="video" action="validate">
      <attribute name="width">
      <regexp-list>
      <regexp name="positivePercentage" />
      </regexp-list>
      </attribute>
      </tag>

      <tag name="source" action="validate">
      <attribute name="src">
      <regexp-list>
      <regexp name="anything" />
      </regexp-list>
      </attribute>
      <attribute name="type">
      <regexp-list>
      <regexp name="anything" />
      </regexp-list>
      </attribute>
      </tag>
       
       
      <video width="100%"><source src="/content/dam/project/url.mp4" type="video/mp4"></source></video>
       
       You may use JS to control the video with other attributes
       
      Thanks  
        kautuk_sahni
        Community Manager
        kautuk_sahniCommunity Manager
        Community Manager
        July 16, 2024

        @venkata-nelluri Did you find the suggestion helpful? Please let us know if you require more information. Otherwise, please mark the answer as correct for posterity. If you've discovered a solution yourself, we would appreciate it if you could share it with the community. Thank you!

        Kautuk Sahni
        V
        Venkata-NelluriAuthor
        Level 2
        July 17, 2024

        Thanks you all for your solutions.

        The below solution worked for me 

         

        <!-- Video tag --> <tag name="video" action="validate"> <attribute name="src"> <regexp-list> <regexp name="anything" value=".*" /> </regexp-list> </attribute> <attribute name="data-type"> <regexp-list> <regexp name="anything" value=".*" /> </regexp-list> </attribute> <attribute name="loop"> <regexp-list> <regexp name="anything" value=".*" /> </regexp-list> </attribute> <attribute name="autoplay"> <regexp-list> <regexp name="anything" value=".*" /> </regexp-list> </attribute> <attribute name="muted"> <regexp-list> <regexp name="anything" value=".*" /> </regexp-list> </attribute> <attribute name="controls"> <regexp-list> <regexp name="anything" value="true" /> </regexp-list> </attribute> <attribute name="width"> <regexp-list> <regexp name="percentage" value="\d+%|100%" /> </regexp-list> </attribute> </tag>

         

        I have embed the video tag as below in rich text editor 

         

        <video width="100%" src="videoURL" data-type="mp.4" controls="true">&nbsp;</video>

         

          Terms & ConditionsAccessibility statement

          Loading footer...