反应本机 android oauth2

react native android oauth2

我正在开发一个 react-native 应用程序,在这个应用程序中我尝试使用 oauth2 进行身份验证。现在我正在尝试使用 webview 来检索我的 redirect_uri 凭据,但我不确定如何在 Android 设备上以 react-native 检索它。

我找到了一个示例,但它没有解释如何在变量中获取访问令牌,而且我不知道如何在 react-native 中实现它。

为此,我尝试使用隐式流程。

Grant Type: Implicit The implicit grant type is used for mobile apps and web applications (i.e. applications that run in a web browser), where the client secret confidentiality is not guaranteed. The implicit grant type is also a redirection-based flow but the access token is given to the user-agent to forward to the application, so it may be exposed to the user and other applications on the user's device. Also, this flow does not authenticate the identity of the application, and relies on the redirect URI (that was registered with the service) to serve this purpose.

The implicit grant type does not support refresh tokens. The implicit grant flow basically works as follows: the user is asked to authorize the application, then the authorization server passes the access token back to the user-agent, which passes it to the application. If you are curious about the details, read on. https://www.digitalocean.com/community/tutorials/an-introduction-to-oauth-2

Integrate oauth2 with native (iOS/Android) mobile application

我的问题是我的 redirect_uri 应该是什么? 如何检索 react-native Android 上的变量? 'implicit flow'是在移动应用上使用的方式吗?

首先,您应该根据您尝试登录的位置选择正确的授权类型。 如果服务是您的,您可以使用 grant type password。 如果服务是第三方的,可以使用implicit类型。您提供重定向 uri,它必须在该特定服务中注册,并用于在用户通过身份验证后重定向用户。 最后,在你使用 fetch 的 React Native 中有一个网络 API(参见 docs)。作为此函数的第二个参数,您可以提供其他信息和 header。您可以在此处设置 oAuth2 文档中提供的所有必需信息。

首先,您开始通过查看其他推荐的内容来了解​​哪种 oauth2 流类型对于您的应用程序来说是最安全的。

之后我查看了 'implicit versus password grant_type' 并查找了所需的字段:

https://www.rfc-editor.org/rfc/rfc6749

我确保授权端点处于活动状态以进行测试(通过使用正确的 grant_type 自己激活一个端点)接下来我想知道如何填写所有字段。通过安装 postman,我可以分析并给自己打电话 POST。

之后你查看你的 url,在我的例子中是:localhost:8000/oauth/token post 使用 postman.

来对抗它

我被困在你不能在请求正文中使用 JSON 的部分,而是 oauth 请求需要在 1 个称为 'body' 的长参数中作为字符串。这就是 httprequest 的工作方式。

//authorization grant type: Resource owner password-based.
const HOST_ADRESS = "192.168.104.137:8000"; //change with your own host 
const client_id   = "jpijpijpijpijipjipijipijipijipj";
fetch('http://'+HOST_ADRESS+"/oauth/token/", {
    method: 'POST',
    headers: {
        'Content-Type': 'application/x-www-form-urlencoded',
        'Cache-Control': 'no-cache'
    },
    body: "client_id=sfjwepifjpfweijgpeijSGIOEJOPGIWSJA35340537530708&grant_type=password&username="+username+"&password="+password
})
    .then((response) => response.text())
    .then((responseText) => {
        console.log(responseText);
        //redux succed do something.
        //dispatch(actionsCreators.succesLogin(responseText));
    })
    .catch((error) => {
        const data = {error: "A error happened"};
        //redux error.   
        //dispatch(actionsCreators.errorLogin(data));
        console.warn(error);
    });

希望其他人从我采取的步骤中学到一些东西。 只需要将令牌保存在数据库中的某个位置以检查 (sql lite ) 或 realm.io (yay for the next steps.)

这是一个非常有趣的例子:https://github.com/bartonhammond/reactnative-oauth-hapi