Question

我正在一个项目中，该项目包括有助于充电的模块，所以发生的情况是用户的数据已经保存在应用程序中，并且当他们选择充电时，该应用程序会打开this网页视图中的网页。

当前，我正在使用WebBridgeView以如下方式打开网页：-

render() {
    return (
        <WebViewBridge
            ref="webviewbridge"
            onBridgeMessage={this.onBridgeMessage.bind(this)}
            source={{uri: "https://currencypin.com/PrepaidMeterPaymentsV2.0/cartwiz?c=IN&p=5&pm=tm"}}/>
    );
  }
}

现在，我想要的是当网页打开时， form字段会预先填充我拥有的自定义数据。因此，用户需要在页面上填写的唯一字段是CAPTCHA。

我一直遵循this article来实现相同目标，但实际上它假设该网站是可自定义的。就我而言，这是不可能的，因为它属于第三方供应商。

有哪些方法可以实现？

Answer 1

您必须使用injectedJavaScript中的WebView道具。

首先声明一个jsCode变量：

const amount = 2
const jscode = `
  if (document.getElementById('txtAmount') == null) {
      // field not existing, deal with the error
    } else {
      document.getElementById('txtAmount').value = '${amount}';
    }
`

请注意“”字符。用于将变量放入字符串中。

然后像这样使用它：

<WebViewBridge
  ref="webviewbridge"
  onBridgeMessage={this.onBridgeMessage.bind(this)}
  injectedJavaScript={jsCode}

使用React Native填充在Web视图中打开的网页的表单字段

1 个答案: