React-Native-Webview: Unable to connect to 10.0.2.2 via android emulator. The certificate authority is not trusted

Viewed 437

I'm new to android development and I'm beginning work on a new android app. I'm currently testing out expo with react-native-webview in an android studio emulator while I wait on my employer to send me proper development devices. I am testing setting up an iframe that renders our existing site in the app and everything was going smoothly until I tried to connect to the site being served from my local machine over https. I saw this issue on expos git page saying that they pulled this fix into their december release and it does seem to be working in all cases for me except when connecting to 10.0.2.2 over https. I tried enabling the "Accept all certificates" option in android studio but that doesn't seem to have fixed it either.

These snippets all render ok

  <WebView source={{ uri: 'https://www.google.com/' }} />
  <WebView source={{ uri: 'http://10.0.2.2/website/' }} />
  <WebView source={{ uri: 'https://{alphaenvironment}.com/website/' }} />

While the following returns "SSL Error: the certificate authority is not trusted"

  <WebView source={{ uri: 'https://10.0.2.2/website/' }} />

This is my package json

  "main": "node_modules/expo/AppEntry.js",
  "scripts": {
    "start": "expo start",
    "android": "expo start --android",
    "ios": "expo start --ios",
    "web": "expo start --web",
    "eject": "expo eject",
    "test": "jest --watchAll"
  },
  "jest": {
    "preset": "jest-expo"
  },
  "dependencies": {
    "@expo/vector-icons": "^12.0.0",
    "@react-native-community/masked-view": "0.1.10",
    "@react-navigation/bottom-tabs": "5.11.2",
    "@react-navigation/native": "~5.8.10",
    "@react-navigation/stack": "~5.12.8",
    "expo": "~40.0.0",
    "expo-asset": "~8.2.1",
    "expo-constants": "~9.3.0",
    "expo-font": "~8.4.0",
    "expo-linking": "~2.0.0",
    "expo-splash-screen": "~0.8.0",
    "expo-status-bar": "~1.0.3",
    "expo-web-browser": "~8.6.0",
    "react": "16.13.1",
    "react-dom": "16.13.1",
    "react-native": "https://github.com/expo/react-native/archive/sdk-40.0.1.tar.gz",
    "react-native-gesture-handler": "~1.8.0",
    "react-native-inappbrowser-reborn": "^3.5.1",
    "react-native-safe-area-context": "3.1.9",
    "react-native-screens": "~2.15.0",
    "react-native-web": "~0.13.12",
    "react-native-webview": "^11.0.0"
  },
  "devDependencies": {
    "@babel/core": "~7.9.0",
    "@types/react": "~16.9.35",
    "@types/react-native": "~0.63.2",
    "jest-expo": "~40.0.0",
    "typescript": "~4.0.0"
  },
  "private": true
}

Can anyone help this noob?

1 Answers

Check your computer's ip using the ipconfig command if it's windows or ifconfig if it's linux and replace 10.0.2.2 with it

Related