How to use Reactotron with physical iOS device

[tsemerad]

I feel like maybe I'm missing something obvious. I have my React Native iOS app using Reactotron fine when I build to an iOS simulator, but when I build to a device it's not working. I think I need to be port forwarding to port 9090 (like I do when I debug on a physical Android device), but is that possible on a physical iOS device?

I looked through the docs and didn't see any mention of this. If it's possible to remotely use Reacotron on iOS I'd love to add instructions to the docs for it.

[skellock]

There isnt port forwarding, but you can use the IP address of your computer. I'll put together some docs. I hear that question a lot.

[tsemerad]

Thanks a lot. I really appreciate it! 👍

[Eyesonly88]

For those looking to do this on iOS, here's how to do it:

Reactotron
  .configure({host:'YOUR_APP_ADDRESS'}) // not localhost, get it from ifconfig
  .connect()

[mkubliniak]

I use this:

import {NativeModules} from 'react-native';
import Reactotron from 'reactotron-react-native';

let scriptHostname;
if (__DEV__) {
    const scriptURL = NativeModules.SourceCode.scriptURL;
    scriptHostname = scriptURL.split('://')[1].split(':')[0];
}

Reactotron
    .configure({host: scriptHostname})
    .connect();

[skellock]

woah. that's awesome!

[lndgalante]

Does anyone try the @mkubliniak solution on Android ?

[antondomratchev]

@Fenwil I tried using this solution on Android, the result was Reactotron display's connection event, but no other events are displayed.

[lndgalante]

It worked for me @antondomratchev my problem was that I was using other ports and not doing port forwarding from the smartphone to reactotron using the reactotron default port 9090.

"scripts": {
    "start": "node node_modules/react-native/local-cli/cli.js start",
    "android": "adb reverse tcp:8888 tcp:8888; adb reverse tcp:9090 tcp:9090; react-native run-android --variant developmentDebug",
    "lint-staged": "lint-staged",
    "lint": "eslint index.*.js src",
    "test": "jest --runInBand",
    "test-cov": "jest --runInBand --coverage",
    "prettier": "node ./bin/prettier.js write"
  },

"android": "adb reverse tcp:8888 tcp:8888; adb reverse tcp:9090 tcp:9090; react-native run-android --variant developmentDebug",

[imdadahad]

I followed the step to get my machine's IP address from ifconfig and then added the following code but it still doesn't seem to work:

Reactotron
  .configure({host:'YOUR_APP_ADDRESS'}) // not localhost, get it from ifconfig
  .connect()

Am I missing a step?

[skellock]

@imdadahad -- i answered over on #671

[dreamchasersuon]

I use this:

import {NativeModules} from 'react-native';
import Reactotron from 'reactotron-react-native';

let scriptHostname;
if (__DEV__) {
    const scriptURL = NativeModules.SourceCode.scriptURL;
    scriptHostname = scriptURL.split('://')[1].split(':')[0];
}

Reactotron
    .configure({host: scriptHostname})
    .connect();

Work like a charm on physical Android device with Expokit!! Thank you so much:)

[DonaldMackay]

If you see the connection but no logging in the timeline; click the bottom of the reactotron window where it says x connections, and select the device you want to see the timeline for.

[gkcgautam]

I use this:

import {NativeModules} from 'react-native';
import Reactotron from 'reactotron-react-native';

let scriptHostname;
if (__DEV__) {
    const scriptURL = NativeModules.SourceCode.scriptURL;
    scriptHostname = scriptURL.split('://')[1].split(':')[0];
}

Reactotron
    .configure({host: scriptHostname})
    .connect();

This throws invalid host exception in release build because host is undefined. Make sure that you set the host config value only in the dev environment.

[Abfareye]

Reactotron (version - v2.17.1)is showing 0 connections. Its showing
device: Waiting for connection

I have set the id address in host in ReactotronConfig.js

On running command - adb reverse --list
It is showing -
host-12 tcp:8081 tcp:8081
host-12 tcp:9090 tcp:9090

I am running a react native project on emulator. Why it is not connecting ?

[mattgle]

I use this:

import {NativeModules} from 'react-native';
import Reactotron from 'reactotron-react-native';

let scriptHostname;
if (__DEV__) {
    const scriptURL = NativeModules.SourceCode.scriptURL;
    scriptHostname = scriptURL.split('://')[1].split(':')[0];
}

Reactotron
    .configure({host: scriptHostname})
    .connect();

Bro you are a life saver! Completely nailed it!

[AshlandWest]

I use this:

import {NativeModules} from 'react-native';
import Reactotron from 'reactotron-react-native';

let scriptHostname;
if (__DEV__) {
    const scriptURL = NativeModules.SourceCode.scriptURL;
    scriptHostname = scriptURL.split('://')[1].split(':')[0];
}

Reactotron
    .configure({host: scriptHostname})
    .connect();

Work like a charm on physical Android device with Expokit!! Thank you so much:)

This worked for me to get the connection, but XCode is still full of SocketRead errors. Does anyone know how to resolve that? I assume it's related to permissions needed to use the Reactotron port.

[WayneKim92]

If you are inconvenient to manually enter the IP when connecting reactotron to the actual device, try using this plugin.