从React Native中的应用程序本身的webview重定向到移动应用程序

Question

从React Native中的应用程序本身的webview重定向到移动应用程序

Sur*_*r E 17 javascript android webview oauth-2.0 react-native

我正在构建一个需要从外部auth提供程序进行身份验证的android应用程序.所以我使用react-native-oauth包来处理这个问题.

定义的redirect_uri是一个深层链接,理想情况下应该在成功验证后打开我的应用程序.但是WebView似乎没有处理这个重定向,我得到的响应是找不到404页面.

这是我为处理身份验证而编写的服务:

    const manager = new OAuthManager('<app_name>')

    manager.addProvider({
         'provider': {
                  auth_version: '2.0', 
                  authorize_url:'<auth-url>',
                  access_token_url: '<auth-url>/token',
                  callback_url: 'http://localhost/provider',
         }
    });

    manager.configure({
       provider: {
           client_id: '<id>',
           client_secret: '<secret>',
           redirect_uri: '<redirect-uri>' //DEEP LINK HERE
      }
    });
   module.exports = {
      authManager: () => {
      manager.authorize('<provider>')
                        .then(resp => console.log(resp))
                        .catch(err => console.log(err));    
                    }
   }

Run Code Online (Sandbox Code Playgroud)

此外,我已经在Android文档中指定了如何声明应用程序的深层链接的 intent-filter .深度链接在使用应用程序组件中的Linking.openURL()打开时工作正常.

非常感谢任何帮助.

Answer 1

小智 10

您无法直接将redirect_uri设置为移动应用程序(因为大多数身份验证提供程序不支持自定义OAuth方案).

但是您可以创建一些接受来自OAuth提供商的重定向的网页,并打开您的应用(并发送所有重定向参数等token).

例如,您创建页面https://example.com/oauth/并设置callback_url为https://example.com/oauth/XXXXX_provider,因此当用户被重定向到页面时https://example.com/oauth/XXXXX_provider&token=xxx,它将使用打开您的应用程序appName://example/oauth/google?token=xxx

您可以appName://example/oauth/google?token=xxx 使用 Deeplink处理(它将在设备上安装时打开您的移动应用程序)

处理重定向的页面示例:

<html><head></head><body>
<p>Please wait while we redirect you to Your APP NAME...</p>
<p><a href="javascript:redirectToApp()">Open appname</a></p>
<script>
  var redirectToApp = function() {
    var scheme = "appnameapp";
    var openURL = "appname" + window.location.pathname + window.location.search + window.location.hash;
    var iOS = /iPad|iPhone|iPod/.test(navigator.userAgent);
    var Android = /Android/.test(navigator.userAgent);
    var newLocation;
    if (iOS) {
      newLocation = scheme + ":" + openURL;
    } else if (Android) {
      newLocation = "intent://" + openURL + "#Intent;scheme=" + scheme + ";package=com.appnameapp;end";
    } else {
      newLocation = scheme + "://" + openURL;
    }
    console.log(newLocation)
    window.location.replace(newLocation);
  }
  window.onload = redirectToApp;
</script>


</body></html>

Run Code Online (Sandbox Code Playgroud)

归档时间：	7 年，10 月前
查看次数：	5854 次
最近记录：	7 年，10 月前