{"id":14971604,"url":"https://github.com/react-native-china/react-native-webkit-webview","last_synced_at":"2025-10-01T18:31:01.394Z","repository":{"id":57341419,"uuid":"93872396","full_name":"react-native-china/react-native-webkit-webview","owner":"react-native-china","description":"💼 Common webkit latest-feature-supported webview for both android and iOS platform","archived":false,"fork":true,"pushed_at":"2017-12-25T01:28:30.000Z","size":40119,"stargazers_count":15,"open_issues_count":0,"forks_count":5,"subscribers_count":4,"default_branch":"master","last_synced_at":"2025-01-16T15:33:48.574Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","language":"Java","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":"jordaaash/react-native-webview-crosswalk","license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/react-native-china.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2017-06-09T15:27:38.000Z","updated_at":"2023-11-09T00:26:22.000Z","dependencies_parsed_at":null,"dependency_job_id":null,"html_url":"https://github.com/react-native-china/react-native-webkit-webview","commit_stats":null,"previous_names":[],"tags_count":20,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/react-native-china%2Freact-native-webkit-webview","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/react-native-china%2Freact-native-webkit-webview/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/react-native-china%2Freact-native-webkit-webview/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/react-native-china%2Freact-native-webkit-webview/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/react-native-china","download_url":"https://codeload.github.com/react-native-china/react-native-webkit-webview/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":234887394,"owners_count":18902083,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-09-24T13:45:32.067Z","updated_at":"2025-10-01T18:31:00.998Z","avatar_url":"https://github.com/react-native-china.png","language":"Java","funding_links":[],"categories":[],"sub_categories":[],"readme":"# react-native-webkit-webview\n\n[![NPM](https://nodei.co/npm/react-native-webkit-webview.png?downloads=true\u0026stars=true)](https://nodei.co/npm/react-native-webkit-webview/)\n\n\n[![Build Status](https://travis-ci.org/react-native-china/react-native-webkit-webview.svg?branch=master)](https://travis-ci.org/react-native-china/react-native-webkit-webview)\n[![MIT Licence](https://badges.frapsoft.com/os/mit/mit.png?v=103)](https://opensource.org/licenses/mit-license.php)\n[![depedencies](https://david-dm.org/react-native-china/react-native-webkit-webview.svg)](https://github.com/react-native-china/react-native-webkit-webview)\n\nForked from [react-native-webview-crosswalk](https://github.com/jordansexton/react-native-webview-crosswalk)\n\nCross-platform Webview component,With better performance on android.\n\n### Npm scripts sucks.Yarn recommended\n\n### Dependencies\n\n`react-native \u003e=0.32.0`, `react \u003e= 15.3.0`\n\n### Installation\n\n* From the root of your React Native project\n\n```shell\nnpm install react-native-webkit-webview --save\nmkdir android/app/libs\ncp node_modules/react-native-webkit-webview/libs/xwalk_core_library-22.52.561.4.aar android/app/libs/\n```\n\n### Include module in your Android project\n\n* In `android/setting.gradle`\n\n```diff\n...\n+ include ':CrosswalkWebView', ':app'\n+ project(':CrosswalkWebView').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-webkit-webview')\n```\n\n### Include libs in your Android project\n\n* In `android/build.gradle`\n\n```diff\n...\nallprojects {\n    repositories {\n        mavenLocal()\n        jcenter()\n\n+        flatDir {\n+            dirs 'libs'\n+        }\n    }\n}\n```\n\n* In `android/app/build.gradle`\n\n```diff\n...\ndependencies {\n  ...\n+  compile (name: \"xwalk_core_library-22.52.561.4\", ext: \"aar\")\n+  compile project(':CrosswalkWebView')\n}\n```\n\n* Register package :\n\n* In `android/app/src/main/java/com/YOUR_PROJECT_NAME/MainApplication.java`\n\n```diff\n+ import com.jordansexton.react.crosswalk.webview.CrosswalkWebViewPackage;\n\npublic class MainApplication extends Application implements ReactApplication {\n  ......\n\n  @Override\n  protected List\u003cReactPackage\u003e getPackages() {\n    return Arrays.\u003cReactPackage\u003easList(\n        new MainReactPackage(),\n+       new CrosswalkWebViewPackage()    // \u003c--- add this line\n    );\n  }\n\n  ......\n\n}\n```\n\n#### Usage\n\n```javascript\n// DemoComponents.js\nimport React,{ Component } from 'react'\nimport { View,TouchableHighlight,Text } from 'react-native'\nimport WebkitView from 'react-native-webkit-webview'\n\nimport localDemoPage from './demoPage.html'\n\nexport default class DemoComponents extends Component{\n  render(){\n    return (\n      \u003cView\u003e\n        \u003cTouchableHighlight onPress={ this.passMessageToWebpage }\u003e\n          \u003cText\u003eTell webpage some message\u003c/Text\u003e\n        \u003c/TouchableHighlight\u003e\n        \u003cWebkitView\n          source={ localDemoPage // local file usage}\n          source={{ uri:'http://www.demo.com/path' //link usage }}\n          injectedJavaScript=\"setTimeout(function(){document.write('WONDERFUL')},1000)\"\n          onMessage = { this.messageHandler }\n          ref={ (webkitView) =\u003e { this.webkitView = webkitView } }\n        /\u003e\n      \u003c/View\u003e\n    )\n  }\n\n  passMessageToWebpage = () =\u003e {\n    this.webkitView.postMessage('hello there')\n  }\n\n  messageHandler = (ev) =\u003e {\n    console.log(ev)\n  }\n}\n```\n\n```html\n\u003c!-- demoPage.html --\u003e\n\u003c!DOCTYPE html\u003e\n\u003chtml lang=\"en\"\u003e\n\u003chead\u003e\n  \u003cmeta charset=\"UTF-8\"\u003e\n  \u003ctitle\u003eDocument\u003c/title\u003e\n\u003c/head\u003e\n\u003cbody\u003e\n  \u003cscript\u003e\n    window.addEventListener('message',(ev) =\u003e {\n      console.log(ev);\n    })\n  \u003c/script\u003e\n\u003c/body\u003e\n\u003c/html\u003e\n\n```\n\n\n\n## License\nMIT\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Freact-native-china%2Freact-native-webkit-webview","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Freact-native-china%2Freact-native-webkit-webview","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Freact-native-china%2Freact-native-webkit-webview/lists"}