I have a Single-Sign-On site opened in a webView. After the user logs in I need to take a cookie to request a token from the API and use it in the application for all the other requests. This all works fine on the Android, but one the iOS there are no cookies when I do a request for the token. WebView is configured to use shared cookie storage:
<WebView
source={{ uri: loginUrl }}
onMessage={handleSsoLogin}
injectedJavaScriptBeforeContentLoaded={JS_INTERFACE}
sharedCookiesEnabled={true}
/>
And if I inspect webView with devTools I can see the cookies. Also, if I visit SSO site again, I'm already logged it. So, cookies are persisted and used by webView. They are just not used by fetch
and CookieManager doesn't access them:
const cookies = await CookieManager.get(url);
console.log({ cookies });
...
{"cookies": {}}
So, the question is, how can I get these cookies from the webView?
You need to use import CookieManager from "@react-native-community/cookies";
and in webview, you can do like this :
<WebView
cacheEnabled={false}
ref={ref => (this.webView = ref)}
source={{
uri: "http://yoururl.com"
}}
style={{ marginTop: 20 }}
onNavigationStateChange={this.navChange}
thirdPartyCookiesEnabled={true}
/>
{this.state.loading && (
<ActivityIndicator
color={"blue"}
style={{ flex: 20 }}
size={"large"}
/>
navChange = e => {
console.log("e", e);
this.setState({ loading: e.loading });
if (e.url == "http://yoururl.com/landing") {
CookieManager.getAll(true).then(res => {
console.log("CookieManager.getAll =>", res);
if (!!res) {
console.log({res})
CookieManager.clearAll(true).then(res => {
console.log("LoginScreen CookieManager.clearAll =>", res);
});
}
});
}
};
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With