[英]Authentication in a React Native WebView
I have a working react-native application, which I would like to extend in a flexible way by adding a tab which displays a WebView
.我有一个可用的 react-native 应用程序,我想通过添加一个显示
WebView
的选项卡以灵活的方式扩展它。 Here a user will be able to see their profile information, so I need to be able to authenticate each user.在这里,用户将能够看到他们的个人资料信息,因此我需要能够对每个用户进行身份验证。
I didn't think this would be difficult to implement since a user is already authenticated within the app, but apparently it is not possible to add custom headers to a WebView in react-native.我认为这并不难实现,因为用户已经在应用程序中进行了身份验证,但显然不可能在 react-native 中向 WebView 添加自定义标头。 And the same goes for the community component react-native-webview.
社区组件 react-native-webview 也是如此。 So I cannot set an authorisation token on a request.
所以我无法在请求上设置授权令牌。
This complicates the process of authentication, so I am looking for an alternative approach to do authentication within a WebView.这使身份验证过程变得复杂,因此我正在寻找在 WebView 中进行身份验证的替代方法。 To my surprise there isn't much information available on the web on how to do this.
令我惊讶的是,网络上没有太多关于如何执行此操作的信息。 So what is a good approach to tackle auth in a react native
WebView
?那么在 React Native
WebView
处理身份验证的好方法是什么?
From within the WebView
you have access to the Fetch API in JavaScript which supports custom headers.在
WebView
您可以访问支持自定义标头的 JavaScript 中的Fetch API 。 So you can call fetch
.所以你可以调用
fetch
。
fetch('https://example.com/profile/alice', {
headers: {
'Authorization': /* your token here... */
}
}).then(function (response) {
return response.json();
}).then(function (myJson) {
console.log(JSON.stringify(myJson));
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.