How can I pass my custom cookie to WKWebview request header? As it was done completely by UIWebview before. (Kindly correct me if I'm wrong)
Just that you know, I'm aware and have read few of the links below:
- https://blog.bigbinary.com/2016/07/26/passing-request-headers-on-each-webview-request-in-react-native.html
- Adding custom headers in Javascript for all http requests
- https://github.com/react-native-community/react-native-webview/blob/82af9559ef17692e4d1f653e47154071cbd9ea33/docs/Guide.md#working-with-custom-headers-sessions-and-cookies
My use case:Suppose the webview header should include another cookie return from Backend Server after user successfully login, for authorization purpose.
How can I pass my request header to ensure every subsequent page load in webview gets it?
What I've tried:
- Setting custom header at prop source THEN setState to cookie once I retrieve from cookie manager - so when cookie is retrieved, the app force a re-render component with my custom header
Webview
<Webviewsource={{ uri: this.state.url, headers: {Cookie: this.state.cookie}}}onLoadStart={this.webviewOnLoadStart}useWebKit={true}sharedCookiesEnabled={true}/>
webviewOnLoadStart
webviewOnLoadStart = async ({ nEvent }) => { const cookie = await ApiHelper.getSessionCookieString() if(this.state.cookie !== cookie){ console.log('setting cookie '+ cookie); this.setState({ cookie }) }};
Environment
"react-native": "0.61.5","react-native-webview": "^10.3.2","@react-native-community/cookies": "^3.0.0",