Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
// RNative Webview Parent
class App extends Component {
constructor(props) {
super(props);
this.webviewRef = null;
}
async componentDidMount() {
if (Platform.OS === 'android') {
const permission = await PermissionsAndroid.request(
PermissionsAndroid.PERMISSIONS.ACCESS_FINE_LOCATION
);
if (permission === PermissionsAndroid.RESULTS.GRANTED) {
console.log("You can use the location");
await Geolocation.getCurrentPosition(
(position) => {
// SENDING CODE
this.webviewRef.injectJavaScript(`window.postMessage(${JSON.stringify(position)})`);
Alert.alert('latitude: ', position.coords.latitude.toFixed(2));
},
(error) => console.log(error),
);
} else {
console.log("Location permission denied")
}
}
};
render() {
return (
<WebView
ref={webview => this.webviewRef = webview}
source={{ uri: 'http://localhost:3000' }}
style={{ marginTop: 20 }}
onMessage={(event) => {
const { data } = event.nativeEvent;
}}
/>
);
}
}
// React JS App.js
useEffect(() => {
window.addEventListener('message', (message) => console.log({ msg: message.data });
}, []);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment