I am using react-native-render-html
in my react-native
application and successfully rendering 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}
/>
)
How can I specify the originWhitelist
props for the WebView
component (or any other WebView
props for that matter)?
I intend to use originWhitelist
to control the list of origins from which I can load content in an attempt to reduce the surface area for an attacker who could control the HTML content (I am using the '@native-html/iframe-plugin'
to load iframes
. Note that I have not included that code for brevity).
You can use defaultWebViewProps
for that purpose:
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}
/>
)