`react-native-render-html` 默认 WebView 道具（`originWhitelist`）

Question

我在我的 react-native 应用程序中使用 react-native-render-html 并成功呈现 HTML:

import RenderHtml from 'react-native-render-html'
import WebView from 'react-native-webview'

export const MyComponent = (props: {html: string, width: number}) => (
    <RenderHtml
        source={{html: props.html}}
        contentWidth={props.width}
        WebView={WebView}
     />
)

如何为 WebView 组件指定 originWhitelist 道具（或任何其他 WebView 道具）？

我打算使用 originWhitelist 来控制我可以从中加载内容的来源列表，以试图减少可以控制 HTML 内容的攻击者的表面积（我是使用 '@native-html/iframe-plugin' 加载 iframes。请注意，为简洁起见，我没有包含该代码）。

Answer 1

您可以使用 defaultWebViewProps 来达到这个目的：

import RenderHtml from 'react-native-render-html'
import WebView from 'react-native-webview'

const webViewProps = {
  originWhitelist: "*"
};

export const MyComponent = (props: {html: string, width: number}) => (
    <RenderHtml
        source={{html: props.html}}
        contentWidth={props.width}
        WebView={WebView}
        defaultWebViewProps={webViewProps}
     />
)

`react-native-render-html` 默认 WebView 道具（`originWhitelist`）

`react-native-render-html` default WebView props (`originWhitelist `)

react-native

react-native-render-html