web-dev-qa-db-fra.com

Android, Apple connexion

J'essaie d'ajouter Apple à mon application Android). Je suis l'approche contextuelle. Je ne parviens pas à y accéder travail.

class AppleLoginWebViewActivity : BaseActivity(), AppleLoginContract.View {

   private val TAG = AppleLoginWebViewActivity::class.Java.simpleName

   override fun onCreate(savedInstanceState: Bundle?) {
       super.onCreate(savedInstanceState)
       setContentView(R.layout.activity_Apple_login)

       prepareWebView()
   }

   private fun prepareWebView() {

       if (BuildConfig.DEBUG) {
           WebView.setWebContentsDebuggingEnabled(true)
       }

       webView.addJavascriptInterface(
           AppleLoginJavaScriptInterface(),
           "AndroidInterface"
       )

       val webSettings: WebSettings = webView.settings
       webSettings.javaScriptEnabled = true
       webView.webViewClient = MyWebViewClient()
       webView.webChromeClient = MyWebChromeClient()
       webView.settings.loadWithOverviewMode = true
       webView.settings.domStorageEnabled = true
       webView.settings.useWideViewPort = true
   }

   private inner class MyWebViewClient : WebViewClient() {

       override fun onPageFinished(
           view: WebView,
           url: String
       ) { //Calling a javascript function in html page
           Logger.info(TAG, "page started: $url")
           // view.loadUrl("javascript:alert(clickAppleSignInButton())")
           view.loadUrl("javascript:AndroidInterface.showHTML" +
               "('<html>'+document.getElementsByTagName('html')[0].innerHTML+'</html>');");
       }

       override fun shouldOverrideUrlLoading(
           view: WebView?,
           request: WebResourceRequest?
       ): Boolean {
           return false
       }
   }

   private class MyWebChromeClient : WebChromeClient() {
       override fun onJsAlert(
           view: WebView,
           url: String,
           message: String,
           result: JsResult
       ): Boolean {
           result.confirm()
           return true
       }
   }

   override fun loadUrl(appleLoginLocalUrl: String) {
       webView.loadUrl(appleLoginLocalUrl)
   }
}

et voici le fichier html que je charge

<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
 <title>Apple Sign in</title>
</head>
<body>
<script type="text/javascript" src="https://appleid.cdn-Apple.com/appleauth/static/jsapi/appleid/1/en_US/appleid.auth.js"></script>
<div id="appleid-signin" data-color="black" data-border="true" data-type="sign in"></div>
<script type="text/javascript">

     const options = {
       clientId: 'MY_CLIENT_ID',
       scope: 'email name',
       redirectURI: 'MY_REDIRECT_URL',
       state: '',
       usePopup : true
     };
     AppleID.auth.init(options);
 </script>

 <script type="text/javascript">
   function clickAppleSignInButton() {
     document.getElementById("appleid-signin").click();
   }
 </script>

 <script type="text/javascript">
   //Listen for authorization success
   document.addEventListener('AppleIDSignInOnSuccess', successFunction);
   //Listen for authorization failures
   document.addEventListener('AppleIDSignInOnFailure', failureFunction);

   function successFunction(data) {
     //handle successful response
     console.log("success")
     AndroidInterface.onLoginSuccess(data);
   }

   function failureFunction(error) {
     //handle error
     console.log("failure")
     AndroidInterface.onLoginFailed(error);
   }
 </script>
</body>
</html>

Donc, dans la dernière étape, lorsque j'inspecte la vue Web, je peux voir les données d'authentification publiées (demande POST) vers une autre URL dans la vue Web. Mais l'écouteur d'événement avec AppleIDSignInOnSuccess n'est jamais appelé. il y a une erreur qui dit "Failed to execute 'postMessage' on 'DOMWindow': The target Origin provided ('MY_REDIRECT_URL') does not match the recipient window's Origin ('https://appleid.Apple.com').", source: (0).

Alors, j'ai quelques questions:

  1. Comment réparer cette erreur?
  2. Pourquoi l'écouteur d'événements n'est pas appelé?
  3. Existe-t-il un moyen d'intercepter et d'analyser la réponse POST directement à partir de la vue Web?)
javascriptandroidhtmlwebviewapple-sign-in
8
a fair player

Le problème peut être que la page n'a pas encore fini de se charger. Essayez de changer

document.getElementById("appleid-signin").click();

à

window.addEventListener('load', function() {
    document.getElementById("appleid-signin").click();
});

Vous pouvez configurer le débogage à distance avec Chrome qui vous permettra d'utiliser Chrome Dev Tools pour déboguer votre vue Web avec votre appareil connecté. Docs ici: https://developers.google.com/web/tools/chrome-devtools/remote-debugging

0
Jake