captchaでXMLビューにHTMLを挿入する

Question

私は現在openui5で作成されたページで作業していますが、私はcaptchaを挿入する必要がありますが、openui5にはcaptchaはありませんこれにHTMLコンテンツを挿入することを試みていました。

問題は、私のビューはXMLであり、タグを使って直接挿入しようとしましたが、コンテンツを変更しようとしましたが、不可能ではありませんでした。私は入力に私の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> 

私はexacltyここに挿入する：前フィールドのxmlまたは内部

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

、キャプチャがログインボタンの上に表示されるためです。

私は挿入するdiv要素のコンテンツは、Googleのキャプチャからである：

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

まだ成功していませんでした、誰もがそれで私を助けることができますか？

<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"> 

おかげで、あなたの時間のためにたくさん： はたぶん、私は知らない名前空間についての何かである、ここに私の名前空間の設定です！

Answer 1

ご協力いただきありがとうございます。私は私がやったことは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"> 

、単純には、タグを追加しました：

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

もの輸入を宣言することを忘れないでくださいGoogleのJS（私のインデックスにこれを追加しました）：

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

は、私はまだ、このキャプチャの答えを得ると、ログインに渡すかしないかをどのように把握しようとしています。

これで、キャプチャが表示され、生成されます。

ありがとうございました！

Answer 2

HTMLをXMLビューに挿入するには、sap.ui.coreライブラリのHTMLコントロールを使用できます。 XMLで使用するには、HTMLテキストをエスケープする必要があります。

<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;' />