Search code examples
windowsreact-nativeandroid-studioandroid-emulatorexpo

Expo app will not run on Android Emulator (Error) Something went wrong. Could not load exp://127.0.0.1:19000

I am developing a React Native app using Expo in Visual Studio Code. I am rendering this app on an Android Studio emulator and I am developing on a Windows OS.

I have never had any issues rendering the Expo app on the emulator until recently. My Android emulator has suddenly stopped rendering ANY expo application, even a newly initialized one (so the issue cannot be any dependencies/modules added to my source code).

The error that is thrown by the emulator is this:

Something went wrong.
Could not load exp://127.0.0.1:19000

Uncaught Error:java.lang.Exception:{"error":"Error:self signed certificate in certification chain"}

The error that is thrown by the terminal in VS Code and the Metro Bundler Developer Tools page is this:

Error: self signed certificate in certificate chain
    at TLSSocket.onConnectSecure (node:_tls_wrap:1530:34)
    at TLSSocket.emit (node:events:390:28)
    at TLSSocket._finishInit (node:_tls_wrap:944:8)
    at TLSWrap.ssl.onhandshakedone (node:_tls_wrap:725:12)

I have tried to switch between the LAN and LOCAL options on the Metro Bundler Developer Tools page. Both of these options produce the error code above.

I have tried setting the NODE_TLS_REJECT_UNAUTHORIZED environment variable to '0' ( I know, I know, not secure!) and the emulator error remains the same, while the terminal error changes to:

Error: Request failed with status code 403
    at createError (C:\Users\KCTCodingIm12\AppData\Roaming\npm\node_modules\expo-cli\node_modules\axios\lib\core\createError.js:16:15)
    at settle (C:\Users\KCTCodingIm12\AppData\Roaming\npm\node_modules\expo-cli\node_modules\axios\lib\core\settle.js:17:12)
    at IncomingMessage.handleStreamEnd (C:\Users\KCTCodingIm12\AppData\Roaming\npm\node_modules\expo-cli\node_modules\axios\lib\adapters\http.js:260:11)
    at IncomingMessage.emit (node:events:402:35)
    at endReadableNT (node:internal/streams/readable:1343:12)
    at processTicksAndRejections (node:internal/process/task_queues:83:21)

If I attempt to use the Tunnel option in my Metro Bundler, I receive the following messages:

Successfully ran `adb reverse`. Localhost URLs should work on the connected Android device.
Using legacy dev server: false
Tunnel URL not found (it might not be ready yet), falling back to LAN URL.
Tunnel URL not found (it might not be ready yet), falling back to LAN URL.
Error starting tunnel Starting tunnels timed out

I have also tried to manually set the REACT_NATIVE_PACKAGER_HOSTNAME env variable by using $env:REACT_NATIVE_PACKAGER_HOSTNAME ="127.0.0.1"

The port numbers in my packager-info.json are as follows:

{
  "devToolsPort": 19002,
  "expoServerPort": 19000,
  "packagerPort": 19000,
  "webpackServerPort": 19006
}

The expo apps run in the web browser just fine.

Here are the things I have tried directly on Android studio:

  1. I have tried deleting all of my Virtual Devices and recreating them.
  2. I have updated all of my SDK Tools.
  3. I have wiped the data from the device manager on Android Studio.
  4. I have Cold Booted and cleared the cache of my emulator.

I have been trouble shooting this problem all week and I have tried many more "solutions" than the ones I listed above -- I am stumped.

I can't imagine this being a network/connection problem because I am running my code editor and my Android emulator from the same device. Also, like I said, my emulator has been connecting fine for months -- I have no idea what the sudden issue is.

Solution

  • I still am not sure what was going on, but I did figure out how to solve this issue.

    First, I had to reset my Android Studio setting back to their default state. I did this by deleting the AndroidStudio4.X folder found at:

    C:\Users\username\AppData\Roaming\Google\.AndroidStudio4.X

    Then I had to delete all of my globally installed node modules. I did this by deleting all of the files inside of:

    C:\Users\username\AppData\Roaming\npm

    I then removed the global .expo file from inside of my terminal. I did this by navigating to C:\Users\username> and entering in rmdir .expo.

    After I reset and uninstalled all of these things, I reinstalled Expo with npm install -g expo-cli, my Expo app loaded on my Android Emulator.

    Again - I have no idea what was actually causing this error, but these steps did solve it.