React Native - 在 WebView 中使用 cookie 进行身份验证

Question

所以我已经为 React Native 应用程序提供了几个 API。一个端点用于身份验证，它 returns 一个允许访问其他 API 的 cookie。

cookie 具有以下结构：

{"auth":"ok","instance":"private","cookies":{"SSOsess":"300|c6dc6d70vfvbf0891004364665f24b77","RTBk":"300|451706342c67a37dfe5dede0b5d22469","ph03RPNCiscoASA":"application.api.urlweb.com","ph04RPNCiscoASA":"application.client.urlweb.com"}}

经过一些格式化后，cookie 就可以发送了，如下所示：

SSOsess=300%7Cc6dc6d70vfvbf0891004364665f24b77; RTBk=300%7C451706342c67a37dfe5dede0b5d22469;
ph03RPNCiscoASA=application.api.urlweb.com;
ph04RPNCiscoASA=application.client.urlweb.com;

React Native 应用程序中有一些 WebView 访问网站的某些受限部分，该网站使用最初提供的一些 API。

如何将 cookie 发送到 WebView？我知道 React Native 有一些可用于将 cookie 注入 WebView 的属性，例如 injectedJavaScript 或 injectedJavaScriptBeforeContentLoaded 但这些属性究竟应该包含什么？

我试过通过以下方式发送，但没有成功：

<WebView source={{ uri: 'http://urlweb.com' }}
               style={{width: 600, height: 400}}
               injectedJavaScriptBeforeContentLoaded={jsInjectedCode}
/>

哪里

jsInjectedCode = 'document.cookie = '+'SSOsess=300%7Cc6dc6d70vfvbf0891004364665f24b77; RTBk=300%7C451706342c67a37dfe5dede0b5d22469;
    ph03RPNCiscoASA=application.api.urlweb.com;
    ph04RPNCiscoASA=application.client.urlweb.com;'

Answer 1

你可以像这样 DOCS

将 cookies 字符串传递到 header 里面的 Cookie

import React, {Component} from 'react';
import {StyleSheet, View} from 'react-native';
import {WebView} from 'react-native-webview';

export default class App extends Component {
  render() {
    const cookiesString="cookie1=asdf; cookie2=dfasdfdas";   //here you can put your cookies
    return (
      <View style={styles.container}>
        <WebView
          source={{
            uri: `${domain}`,
            headers: {
              Cookie: cookiesString,
            },
          }}
          style={styles.WebViewStyle}
        />
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#FFF',
  },
  WebViewStyle: {
    flex: 1,
    resizeMode: 'cover',
  },
});

React Native - 在 WebView 中使用 cookie 进行身份验证

React Native - Use cookies to authenticate in WebView

cookies

android

webview

ios

react-native