lucasferreira / react-native-webview-android Goto Github PK

After upgrading, react-native run-android gives the following error:-

/node_modules/react-native-webview-android/android/src/main/java/com/burnweb/rnwebview/NavigationStateChangeEvent.java:19: error: no suitable constructor found for Event(int)
        super(viewId);
        ^
    constructor Event.Event() is not applicable
      (actual and formal argument lists differ in length)
    constructor Event.Event(int,long) is not applicable
      (actual and formal argument lists differ in length)
Note: Some input files use or override a deprecated API.
Note: Recompile with -Xlint:deprecation for details.
Note: /home/qplum-5/Desktop/qplum-android-qfolio/node_modules/react-native-webview-android/android/src/main/java/com/burnweb/rnwebview/RNWebViewManager.java uses unchecked or unsafe operations.
Note: Recompile with -Xlint:unchecked for details.
1 error
:RNWebView:compileReleaseJavaWithJavac FAILED

FAILURE: Build failed with an exception.

* What went wrong:
Execution failed for task ':RNWebView:compileReleaseJavaWithJavac'.
> Compilation failed; see the compiler error output for details.

React Native: 0.30.0
React: 15.2.0

If it's intentional and supposed to be breaking, we can modify the version number to reflect that.

hi

i am trying to load a url using the webview but its not showing anything

i have copy pasted your webviewandroid example

this is the logs i get

11-24 18:23:50.225 2224 2224 W art : Attempt to remove non-JNI local reference, dumping thread
11-24 18:23:50.228 2224 2224 W AwContents: onDetachedFromWindow called when already detached. Ignoring
11-24 18:23:50.394 2224 2403 D ReactNativeJS: { url: 'https://www.google.com/',
11-24 18:23:50.394 2224 2403 D ReactNativeJS: canGoForward: false,
11-24 18:23:50.394 2224 2403 D ReactNativeJS: canGoBack: false,
11-24 18:23:50.394 2224 2403 D ReactNativeJS: loading: true }
11-24 18:23:50.504 2224 2403 D ReactNativeJS: { url: 'https://www.google.co.uk/?gfe_rd=cr&ei=PKtUVte-L_Kq8weggJbABA',
11-24 18:23:50.504 2224 2403 D ReactNativeJS: canGoForward: false,
11-24 18:23:50.504 2224 2403 D ReactNativeJS: canGoBack: false,
11-24 18:23:50.504 2224 2403 D ReactNativeJS: loading: true }
11-24 18:23:51.038 2224 2224 W BindingManager: Cannot call determinedVisibility() - never saw a connection for the pid: 2224
11-24 18:23:53.103 2224 2403 D ReactNativeJS: { url: 'https://www.google.co.uk/?gfe_rd=cr&ei=PKtUVte-L_Kq8weggJbABA',
11-24 18:23:53.103 2224 2403 D ReactNativeJS: canGoForward: false,
11-24 18:23:53.103 2224 2403 D ReactNativeJS: canGoBack: false,
11-24 18:23:53.103 2224 2403 D ReactNativeJS: loading: false }
11-24 18:23:54.910 2224 2224 W BindingManager: Cannot call determinedVisibility() - never saw a connection for the pid: 2224

i am on react native 0.14.2 .

any help would be appreciated

Probably mention that this is only useful till version 0.16 ?

in my case, i use webView with the {html} props, in html data, when i click any link, and call goBack method, webView just show me nothing , but not the data came from {html} props~

how can i do ? for now, i just change the state for re-rend the webView, but i guess maybe some better way i miss.. right?

Hi. I want to upgrade RN 0.34, so I updated RN in my project.

error is occur when i build project.

• What went wrong:
  A problem occurred configuring project ':RNWebView'.
  Could not resolve all dependencies for configuration ':RNWebView:_debugCompile'.
  Could not find any matches for com.facebook.react:react-native:+ as no versions of com.facebook.react:react-native are available.
  Searched in the following locations:
  file:/Users/......./Library/Android/sdk/extras/android/m2repository/com/facebook/react/react-native/maven-metadata.xml
  file:/Users/......./Library/Android/sdk/extras/android/m2repository/com/facebook/react/react-native/
  file:/Users/......./Library/Android/sdk/extras/google/m2repository/com/facebook/react/react-native/maven-metadata.xml
  file:/Users/......./Library/Android/sdk/extras/google/m2repository/com/facebook/react/react-native/
  Required by:
  pstoreApp:RNWebView:unspecified

Please help me.

• RN : 0.34, React : 15.3.1, JDK 8

how to set headers ,just like React Native's webview source?

I did exactly like the instructions and got:

:app:compileDebugJavaWithJavac
MainActivity.java:40: error: cannot find symbol
new RNWebViewPackage()
^
symbol: class RNWebViewPackage
location: class MainActivity
1 error
:app:compileDebugJavaWithJavac FAILED

Hi,
Followed all instructions

1. c:\React\NativeStarter>react-native run-android
   ....
   FAILURE: Build failed with an exception.

• Where:
  Build file 'C:\React\NativeStarter\android\app\build.gradle' line: 78
• What went wrong:
  A problem occurred evaluating project ':app'.

  Project with path ':RNWebView' could not be found in project ':app'.

• Try:
  Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output.
  BUILD FAILED

2. I got BUILD SUCCESSFUL with a secod attempt
   3)react-native start
   but get the following on start
   

Using RN 0.19.0
win10
genymotion
Thanls.
John

The rendering seems to be very slow and it also slows the rendering of the native components besided the html. Is this just because this is a temporary solution or am i doing something wrong ?

Hi, Thanks for the nice tool. I cannot set full height to the device to the webview in RN android app. Tried with different methods but could not get it worked. RN version is 0.13.1.

Very helpful module @lucasferreira.
Can you please tell me if it's possible that the file upload feature works on higher Android versions and not on others(4.4 in my example specifically)?
The example device I mentioned doesn't have any problems in file uploads on the same website in a browser but doesn't respond in case of WebViewAndroid.

To support links like mailto: etc from the webview. Currently it takes to -
ERR_UNKNOWN_URL_SCHEME error

Build started failing for me with the latest build

Using RN 28

/Users/me/code/company/project/node_modules/react-native-webview-android/android/src/main/java/com/burnweb/rnwebview/NavigationStateChangeEvent.java:19: error: no suitable constructor found for Event(int)
        super(viewId);
        ^
    constructor Event.Event() is not applicable
      (actual and formal argument lists differ in length)
    constructor Event.Event(int,long) is not applicable
      (actual and formal argument lists differ in length)
Note: Some input files use or override a deprecated API.
Note: Recompile with -Xlint:deprecation for details.
Note: /Users/me/code/company/project/node_modules/react-native-webview-android/android/src/main/java/com/burnweb/rnwebview/RNWebViewManager.java uses unchecked or unsafe operations.
Note: Recompile with -Xlint:unchecked for details.
1 error
:RNWebView:compileReleaseJavaWithJavac FAILED

FAILURE: Build failed with an exception.

is there anyway to do that atm?

Hello, have you by any chance tried using google maps inside the webview? Whenever I use a Navigator the webview doesn't show anything and when I use the webview on its own it works.
The maps site is written in react js.

The combination of the Navigation API and the Webview somehow disables maps with geolcation and nothing shows in the webview.

Console has no errors.

The iOS version of the app works fine. I am using RN0.22

Browsing through RN code, it looks like if the parent 'View' has backgroundcolor, the maps do not show.
I am not sure what the connection between geolcation inside a webview is affected by the Navigation API.

It's not rendering Google Map inside the web view on RN 0.19

WebViewAndroid in Listview is dismiss after scrolling in ListView

Many thanks for working on this!
The screen is completely white until the page loads. Is there a way to check when it is loading and when it finishes loading in order to use a progress bar/circle?

Edit: So, I was testing the wrong project. Completely ignore this issue.

I just upgraded my app to react 15.3.0 and react-native 0.32.0 and the app crashes each time when it tries to open a view which includes WebViewAndroid.
Does any one else had the same experience and manage to solve it?

After following the npm instructions and adding the entry into settings.gradle, I add 'compile project(':RNWebView')', without quotes - when I build I get the error: "Error:Configuration with name 'default' not found."

Hi,
How can I change the user agent to custom one?
I don't have any knowledge in Android SDK Development.

When I using the disable cookies mode to login instagram, it said I have no connection.

Hi, Thanks for the simple and nice webview component. I am using this component (along with navigator) for loading a web based map. If I swipe the map its navigating to previous screen. Please let me know how to disable this functioanlity with some code example. Thanks.

Hi Iucasferrira,

Is there a way to make the video go to fullscreen con react-native-webview-android?

Regards,

Hi,
I am not able to use the webView for some reason. I am only getting a redbox around the web view. Not sure if im doing something wrong

This is the Warning i get
Warning: Native component for "RNWebViewAndroid" does not exist. But I am able to view the component in console logs

I am trying to embed youtube and vimeo videos inside Webview but its not working.

This seems like a react specific bug to me, but I have no idea how to debug it. Here is what I am trying to do, any advice is highly appreciated: I follow this link to a simple energy comparison website:

http://www.verivox.de/energy/msp?gc=true&cmpc=1723&cmpt=506645&existing=false&regional=false&Source_ID=1707&PLZ=10437&ranking=1&Site_ID=2&Tariff_ID=521574&usage=976&profile=H0&switch=2&ori=qwYAAAAACWFiY2UxMDQzN9ADAAACaDAAAQABAf----8BAQALAAAAFbsHAAABAAAAAAAAAAAAAAAAAACA----------8AAP--AQAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAi0x-----wAAAAAAAAAAAAI%3d

The page loads and entering the checkout process by clicking the button works. But if I fill in data and want to go to the second checkout step (posting the data) I get to a 404 page. If I do exactly the same in Chrome (or "Internet") on the same smartphone I get to the next checkout step (I see from developer tools here that there is a 302 after posting the data). Does not work either using Webview or WebViewAndroid module, so the issue seems to be react specific. Any ideas how to debug this? With chrome::inspect I cannot see network request while the app loads so I have no clue what is going on or how to fix or work around this.

I posted some more details here: facebook/react-native#5211 (comment)

I have loaded a url which records sound using mobile microphone. I also had set permission settings which is required by android Marshmallow 6.0 using the https://github.com/lucasferreira/react-native-android-permissions

But when i load the url it gives error on website.

could not get permissions for recording.

Is there any properties i need to set in the webview to provide access for recording, as i have already provided access permissions in android manifest as provided in the above example.

# Update code for permission in the react-native and android :

React-native code

The following code i have inserted on the link click which will open the webiview with the respective import code for permissions component.

import {checkPermission} from 'react-native-android-permissions';
import {requestPermission} from 'react-native-android-permissions';

onMMSLinkClick(url) {
        console.log('mms link click url :: ', url);
        //console.log('this.props :: ',this.props);
        checkPermission("android.permission.RECORD_AUDIO").then((result) => {
            console.log("checkPermission Recording Already Granted!", result);
            //console.log('checkPermission Recording granted results :: ', result);
        }, (result) => {
            console.log("checkPermission Recording Not Granted!", result);
            //console.log('checkPermission Recording Not Granted results :: ', result);
        });

        requestPermission("android.permission.RECORD_AUDIO").then((result) => {
            console.log("requestPermission Recording Granted!", result);
            // now you can set the listenner to watch the user geo location 
        }, (result) => {
            console.log("requestPermission Recording  Not Granted!",result);
            //console.log(result);
        });
        this.props.navigator.push({
            component: WebViewMMS,
            title: "MMS Practice",
            passProps: {
                url
            }
        });
    }

Android Code:

In settings.gradle file :

include ':RNWebView'
project(':RNWebView').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-webview-android/android')

include ':RNPermissionsModule'
project(':RNPermissionsModule').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-android-permissions/android')

In build.gradle file :

targetSdkVersion 23
compile project(':RNPermissionsModule')
compile project(':RNWebView')

In MainActivity.java File:

import com.burnweb.rnwebview.RNWebViewPackage;
import com.burnweb.rnpermissions.RNPermissionsPackage;

@Override
    protected List<ReactPackage> getPackages() {
        return Arrays.<ReactPackage>asList(
            new MainReactPackage(),
            new RNPermissionsPackage(),
            new RNWebViewPackage(),
);
}

@Override
    public void onRequestPermissionsResult(int requestCode, String[] permissions, int[] grantResults) {
        RNPermissionsPackage.onRequestPermissionsResult(requestCode, permissions, grantResults); // very important event callback
        super.onRequestPermissionsResult(requestCode, permissions, grantResults);
    }

If you need any other code. Please let me know.

Hi,
I tried to follow your orders to enable YouTube playback,
Added android:hardwareAccelerated="true" in the <application on AndroidManifest.xml
Also, tried to add some properties, followed stack overflow questions, but can't get it to work.
Worth to notice that Kickstarter videos are playing fine, and I saw you added WebChromeClient to your library.
If it matters, I'm trying to run it on Samsung Galaxy Note 4.
Any ideas?

Inside the html that I am passing as source {html}, I have an badge. Clicking on it on Android, gives me a ERR_UNKNOWN_URL_SCHEME error (opens a new screen with this message). Using react native WebView I was able to catch it with onError function, which is missing here.
Also it opens new call normally on iOS.

Such as the title. THX

Hello,
I have an error when compiling the application
--> Error: more than one library with package name 'com.burnweb.rnwebview'

React: 15.3.0
React-native: 0.33.0

Hi there,
I was wondering - how would I go about adding in Back, Forward and Reload button functionality? I've tried but failed :/

The props aren't being passed through to the view for react-native 0.19.

facebook/react-native#5649

A fix seems to be settings the build.gradle file to:
dependencies {
compile 'com.facebook.react:react-native:0.19.+'
}

And changing the import ReactProps in RNWebViewManager to:
import com.facebook.react.uimanager.annotations.ReactProp;

I'll make a pull request

Urls starts with test is not loading, example http://test.something.com is not loading. Can you please check.

Hello, when adding compile project(':RNWebView') to "android/app/build.gradle", I get the following error Error:Configuration with name 'default' not found. I am running Android SDK 2.1.3 on windows 10.
Please help me clarify the issue.

Thanks,
Joe

Requiring React Native >=0.19 is a major not minor release. I think that the way you are going your versioning needs updating. 1.0.13 is a breaking change, that requires a different versioning strategy.

Rather than passing a url, is there a way to pass a string of html like this?:
https://github.com/lwansbrough/react-native-canvas/blob/master/Canvas.js#L26

Would love to use this to get a canvas prototype working.

Great plugin by the way! 👍

i want play embed youtube, but black screen.

ex url :
https://www.youtube.com/embed/zETNXBcVBz4

input type=file does not work,how to fix? thanks very much。

like react-native-webview-bridge
I have found JsBridge for native Android, But I don't know how to intergrate it

I think I successfully placed react-native-webview-android with React Native 0.19 ( following the guide on https://facebook.github.io/react-native/docs/native-components-android.html#content )
but the webview component did not load a page properly, showing blank.

ADB log showed..
'nativeondraw failed clearing to background color'

I turned off the hardware acceleration on the application (of my project) and on the view (of RNWebViewAndroid project)
I also tried to set width, height, and background color of the web view component
but none of the solutions I found on the internet did not work.

After googling, it seems that many people using KitKat experience the same problem, however no clear solution for react-native native UI component

Can anyone help me out?

Just trying to login Gitter. After successfully GitHub login it should redirect to Gitter app, but it displays just a dark background and that's it.

Also tried with React Native Webview and got the same issue which can be tracked here.

Hi there,
Great WebView - I was just wondering, is it possible to inject some javascript into the page at the point of loading being complete?

Hi Lucasferreira,

I did set android:hardwareAccelerated="true" in your AndroidManifest.xml file. However, The video still didn't go fullscreen.

Anything else have to set?

Thanks for great component

Is there any way to send event from web view to react native? thanks

Since React Native 0.17+ ships with a WebView for Android, it might be courteous to mention it in this repo.

Thanks for filling in the missing gap in the meantime, @lucasferreira! It served me well.