WebView onMessage提供意外响应

时间:2017-07-03 14:55:59

标签: react-native webview

我正在尝试从WebView和我的应用程序的RN层获取一些数据,但是我从WebView收到的响应看起来像一个事件对象,我无法看到从WebView发送的字符串在对象上。

响应如下:

Proxy { dispatchConfig: Object, _targetInst: Constructor, isDefaultPrevented: function, isPropagationStopped: function, _dispatchListeners: function...}

单击上面的对象会导致奇怪的行为,并且结构会发生变化。点击打开后,上面的对象如下所示:

{
    [[Handler]]: Object,
    [[Target]]: SyntheticEvent,
    [[IsRevoked]]: false
}

在上面那个奇怪的事件寻找对象里面,我找不到我硬编码的字符串被发送回RN。

有什么想法吗?

这是我传递给WebView的代码:

var defer = function (fn, delay) {
  if (!fn || typeof fn !== 'function') return console.log('defer: First argument must be a function.');
  if (!delay) delay = 0;

  return setTimeout(fn, delay);
};

var initBridge = function () {
  try {
    if (!window.postMessage) {
      console.log('Could not initiate WebView bridge');
    }

    defer(function () { window.postMessage('HELLO'); }, 500);
    let sentTest = false
    document.addEventListener('message', function (data) {
      console.log('Received message from RN!');
      console.log(data);
    });

    console.log('WebView bridge successfully initialised');
  } catch (err) {
    console.log(window.postMessage);
    console.log('Failed to initiate WebView bridge');
    console.log('Error: ', err);
  }
};

defer(initBridge);

这是我的onMessage处理程序:

  _onMessage (message) {
    console.log('MESSAGE FROM WEBVIEW: ', message)
    console.log('ARGS: ', arguments)

    this._webView.postMessage('Hello, from RN!')
  }

1 个答案:

答案 0 :(得分:3)

如果您对从WebView收到的邮件发送message.persist(),则可以在message.nativeEvent.data下找到数据。