HTML in XML-Ansicht mit Captcha einfügen

Question

Ich arbeite gerade an einer Seite, die mit openui5 erstellt wurde, was ich tun muss, ist ein Captcha einzufügen, aber soweit ich weiß gibt es in openui5 kein Captcha, was ich versucht wurde, HTML-Inhalt in diesen einzufügen.

Das Problem ist, meine Ansichten sind in XML und ich habe versucht, direkt mit Tags einfügen und ändern Sie den Inhalt, aber war nicht möglich, es sagt falsche XML-Parsing.

Teil meiner Code, wo ich eingeben möchten meine html div:

<Page id="page1" class="marginBoxContent" showHeader="false" showFooter="false" enableScrolling="true"> 
<content> 
    <Image src="../../image/logo.svg" /> 
    <l:Grid 
    defaultSpan="L12 M12 S12" 
    width="100%"> 
    <l:content> 
     <f:Form id="FormChange354" 
     minWidth="1024" 
     maxContainerCols="2" 
     editable="true"> 
     <f:layout> 
      <f:ResponsiveGridLayout 
      labelSpanL="3" 
      labelSpanM="3" 
      emptySpanL="4" 
      emptySpanM="4" 
      columnsL="1" 
      columnsM="1" /> 
     </f:layout> 
     <f:formContainers> 
      <f:FormContainer> 
      <f:formElements> 
       <f:FormElement label="{i18n>Language}"> 
       <f:fields> 
        <Select id="animationSelect" selectedKey="en" change="languageChange"> 
         <core:Item text="English" key="en" /> 
        <core:Item text="Português" key="pt" /> 
         <core:Item text="Español" key="es" /> 
         <layoutData> 
         <FlexItemData growFactor="1" /> 
         </layoutData> 
        </Select> 
       </f:fields> 
       </f:FormElement> 
      </f:formElements> 
      <f:formElements> 
       <f:FormElement label="{i18n>User}"> 
       <f:fields> 
        <Input id="username" value="" type="Email" /> 
       </f:fields> 
       </f:FormElement> 
      </f:formElements> 
      <f:formElements> 
       <f:FormElement label="{i18n>Password}"> 
       <f:fields> 
        <Input id="password" type="Password" placeholder="" value="" /> 
       </f:fields> 
       </f:FormElement> 
      </f:formElements> 
      <f:formElements> 
       <f:FormElement label=""> 
       <f:fields> 
        <Button id="btnLogin" text="{i18n>Sigin}" type="Emphasized" press="login" /> 
       </f:fields> 
       </f:FormElement> 
      </f:formElements> 
      </f:FormContainer> 
     </f:formContainers> 
     </f:Form> 
     <l:VerticalLayout> 
      <Link text="{i18n>CreateUser}" press="navCreateUser" /> 
      <Link text="{i18n>RecoverPass}" press="navRecoverPass" /> 
      <Link text="{i18n>ChangePass}" press="navChangePass" /> 
     </l:VerticalLayout> 
    </l:content> 
    </l:Grid> 
</content> 

Ich möchte exaclty hier einfügen:

<f:formElements> 
      <f:FormElement label=""> 
      <f:fields> 
       <Button id="btnLogin" text="{i18n>Sigin}" type="Emphasized" press="login" /> 
      </f:fields> 
      </f:FormElement> 
     </f:formElements> 

Innerhalb der XML-Felder oder vor, weil das Captcha über der Login-Schaltfläche erscheint.

Der Inhalt des div ist, ich will einfügen von Google Captcha:

<div id='recaptcha' class="g-recaptcha" 
     data-sitekey="your_site_key" 
     data-callback="onSubmit" 
     data-size="invisible"></div> 

kann noch nicht Erfolg hat, jemand kann mir helfen mit, dass? Vielleicht etwas über den Namensraum ist, weiß ich nicht, hier ist mein Namensraum config:

<core:View 
    height="100%" 
    xmlns="sap.m" 
    xmlns:mvc="sap.ui.core.mvc" 
    xmlns:l="sap.ui.layout" 
    xmlns:f="sap.ui.layout.form" 
    xmlns:core="sap.ui.core" 
    controllerName="hiddenName.app.login.view.Login"> 

Vielen Dank für Ihre Zeit!

Answer 1

danke für jede Hilfe. Ich habe etwas Hilfe von allen Kommentaren, was ich tat, war den Namensraum deklarieren html:

<core:View 
    height="100%" 
    xmlns="sap.m" 
    xmlns:mvc="sap.ui.core.mvc" 
    xmlns:l="sap.ui.layout" 
    xmlns:f="sap.ui.layout.form" 
    xmlns:core="sap.ui.core" 
    xmlns:html="http://www.w3.org/1999/xhtml" 
    controllerName="hiddenName.app.login.view.Login"> 

Und hinzugefügt einfach das Tag wie ich hier unten zeigen:

<html:div id="recaptchaGoogle" class="g-recaptcha" data-sitekey="yourKey"></html:div>  

Denken Sie auch daran, die Einfuhr von erklären die google js (hinzugefügt, um es auf meinem Index):

<script src="https://www.google.com/recaptcha/api.js" async defer></script> 

ich bin immer noch versuchen, herauszufinden, wie man diese captcha Antwort zu erhalten und auf die Login passiert oder nicht.

Damit erscheint das Captcha und wird erzeugt.

Vielen Dank!

Answer 2

Um HTML in eine XML-Ansicht einzufügen, können Sie das HTML-Steuerelement aus der Bibliothek sap.ui.core verwenden. Sie müssen dem HTML-Text entkommen, bevor Sie ihn in XML verwenden.

<core:HTML content='&lt;div id=&quot;recaptcha&quot; class=&quot;g-recaptcha&quot; data-sitekey=&quot;your_site_key&quot; data-callback=&quot;onSubmit&quot; data-size=&quot;invisible&quot;&gt;&lt;/div&gt;' />