Question

我正在向webview发送本地文件路径，并希望在画布中显示图像。

我正在进入我的网页视图的路径，但无法加载它，这是我收到的消息：

不允许加载本地资源：file：//// Users / ...

是否有任何解决方案可以访问本地文件或任何解决方法？

<WebView
    style={{flex:1,borderWidth:2}}
    source={require('./webview/canvas.html')}
    ref={webview => {this.webview = webview; }}
    onLoad={this._webViewLoaded.bind(this)}
    onMessage={this._getMessageFromWebView.bind(this)}

/＆GT;

然后发送数据：

this.webview.postMessage(this.state.path);

其中this.state.path是使用相机组件后的本地路径

Answer 1

我正在解决这个问题。使用react-native-fetch-blob：

RNFetchBlob
        .config({
            fileCache : false,
            appendExt : 'jpg'
        })
        .fetch('GET', this.state.path)
        .then((res) => {
            let base64Str = res.base64().then((result)=>{
                this.setState({imageBase64 : result})
                this.webview.postMessage(this.state.imageBase64);
            });
        })

在react-native中访问WebView内的本地文件

1 个答案: