Automated IP Switching for Simulator/Devices #4245

Closed
aphillipo opened this Issue Nov 19, 2015 · 47 comments

Comments

Projects
None yet
@aphillipo

I have no idea where to add this but here is how to automate (mostly, under some conditions, your milage may vary - your network connection must be en0 etc.) changing the IP address of your machine when you want to run on the device.

  1. Click Your Project -> Build Phases -> Click the + -> New Run Script Phase
  2. Add the following code:
INFOPLIST="${TARGET_BUILD_DIR}/${INFOPLIST_PATH}"
echo "writing to $INFOPLIST"
PLISTCMD="Set :SERVER_IP $(ifconfig | grep inet\ | tail -1 | cut -d " " -f 2)"
echo -n "$INFOPLIST" | xargs -0 /usr/libexec/PlistBuddy -c "$PLISTCMD"

Next add the following to AppDelegate.m replacing the usual jsCodeLocation line:

NSString *jsBundleUrlString;

if (TARGET_IPHONE_SIMULATOR) {
  jsBundleUrlString = @"http://localhost:8081/index.ios.bundle";
} else {
  NSString *serverIP = [[NSBundle mainBundle] objectForInfoDictionaryKey:@"SERVER_IP"];
  NSString *jsCodeUrlString = [NSString stringWithFormat:@"http://%@:8081/index.ios.bundle", serverIP];
  jsBundleUrlString = [jsCodeUrlString stringByAddingPercentEscapesUsingEncoding:NSUTF8StringEncoding];
}

jsCodeLocation = [NSURL URLWithString:jsBundleUrlString];

And that's it, you should now be able to switch between the simulator and a device without any thought about where you are... Let me know if this works for you.

@jaygarcia

This comment has been minimized.

Show comment
Hide comment
@jaygarcia

jaygarcia Nov 19, 2015

Contributor

This look pretty damn awesome.

I've just been bundling with and use bundled code for devices. I like this a lot more.

Contributor

jaygarcia commented Nov 19, 2015

This look pretty damn awesome.

I've just been bundling with and use bundled code for devices. I like this a lot more.

@mschwartz

This comment has been minimized.

Show comment
Hide comment
@mschwartz

mschwartz Nov 19, 2015

Nice work.

A couple of points/issues perhaps.

Where is TARGET_IPHONE_SIMULATOR being set?

There's no logic for production builds (e.g. without a server at all).

Nice work.

A couple of points/issues perhaps.

Where is TARGET_IPHONE_SIMULATOR being set?

There's no logic for production builds (e.g. without a server at all).

@jaygarcia

This comment has been minimized.

Show comment
Hide comment
@jaygarcia

jaygarcia Nov 19, 2015

Contributor

TargetConditionals.h @mschwartz.

In Xcode, CMD+Click (like Webstorm, etc.)

Contributor

jaygarcia commented Nov 19, 2015

TargetConditionals.h @mschwartz.

In Xcode, CMD+Click (like Webstorm, etc.)

@jaygarcia

This comment has been minimized.

Show comment
Hide comment
@jaygarcia

jaygarcia Nov 19, 2015

Contributor

i've been using this with pre-bundling for phone testing. I like @aphillipo's approach much more.

#if TARGET_IPHONE_SIMULATOR

  jsCodeLocation = [NSURL URLWithString:@"http://localhost:8081/index.ios.bundle?platform=ios&dev=true"];

  /**
   * OPTION 2
   * Load from pre-bundled file on disk. To re-generate the static bundle
   * from the root of your project directory, run
   *
   * $ react-native bundle --minify
   *
   * see http://facebook.github.io/react-native/docs/runningondevice.html
   */
#else

   jsCodeLocation = [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];

#endif

Contributor

jaygarcia commented Nov 19, 2015

i've been using this with pre-bundling for phone testing. I like @aphillipo's approach much more.

#if TARGET_IPHONE_SIMULATOR

  jsCodeLocation = [NSURL URLWithString:@"http://localhost:8081/index.ios.bundle?platform=ios&dev=true"];

  /**
   * OPTION 2
   * Load from pre-bundled file on disk. To re-generate the static bundle
   * from the root of your project directory, run
   *
   * $ react-native bundle --minify
   *
   * see http://facebook.github.io/react-native/docs/runningondevice.html
   */
#else

   jsCodeLocation = [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];

#endif

@mschwartz

This comment has been minimized.

Show comment
Hide comment
@mschwartz

mschwartz Nov 20, 2015

Yeah...

I was suggesting #if / else if / else to handle production, target, and
emulator..,

On Thursday, November 19, 2015, Jay Garcia notifications@github.com wrote:

i've been using this with pre-bundling for phone testing. I like
@aphillipo https://github.com/aphillipo's approach much more.

#if TARGET_IPHONE_SIMULATOR

jsCodeLocation = [NSURL URLWithString:@"http://localhost:8081/index.ios.bundle?platform=ios&dev=true"];

/**

  • OPTION 2

  • Load from pre-bundled file on disk. To re-generate the static bundle

  • from the root of your project directory, run
    *

  • $ react-native bundle --minify
    *

  • see http://facebook.github.io/react-native/docs/runningondevice.html
    */
    #else

    jsCodeLocation = [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];

#endif


Reply to this email directly or view it on GitHub
#4245 (comment)
.

Yeah...

I was suggesting #if / else if / else to handle production, target, and
emulator..,

On Thursday, November 19, 2015, Jay Garcia notifications@github.com wrote:

i've been using this with pre-bundling for phone testing. I like
@aphillipo https://github.com/aphillipo's approach much more.

#if TARGET_IPHONE_SIMULATOR

jsCodeLocation = [NSURL URLWithString:@"http://localhost:8081/index.ios.bundle?platform=ios&dev=true"];

/**

  • OPTION 2

  • Load from pre-bundled file on disk. To re-generate the static bundle

  • from the root of your project directory, run
    *

  • $ react-native bundle --minify
    *

  • see http://facebook.github.io/react-native/docs/runningondevice.html
    */
    #else

    jsCodeLocation = [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];

#endif


Reply to this email directly or view it on GitHub
#4245 (comment)
.

@aphillipo

This comment has been minimized.

Show comment
Hide comment
@aphillipo

aphillipo Nov 20, 2015

I should have said, this is for development only. Feel free to add a version to automate the build based upon the RELEASE config stuff too.

This is more about when someone comes over to your desk and you want to show them what you;ve been working on on device. The mad scrabble to get the right IP etc. is annoying.

I should have said, this is for development only. Feel free to add a version to automate the build based upon the RELEASE config stuff too.

This is more about when someone comes over to your desk and you want to show them what you;ve been working on on device. The mad scrabble to get the right IP etc. is annoying.

@mschwartz

This comment has been minimized.

Show comment
Hide comment
@mschwartz

mschwartz Nov 20, 2015

Understood.

FWIW, my development machine has IP 192.168.0.14. I just used that IP in
AppDelegate.m and it works in both simulator and on device.

There was a bug that prevented this from working when one of iOS9.1 or
Xcode 7.1 came out. It didn't work with the 9.x simulators. I was able to
install the 8.x simulators which did work. It seems to be fixed in one of
the more recent (newer than 0.12) versions of RN.

Your solution is excellent if you have multiple people working on the
project or you use multiple machines (work/home or laptop/desktop kind of
thing). In those cases, you can't rely on a fixed IP like 192.168.0.14.

Cheers

On Fri, Nov 20, 2015 at 6:30 AM, Andrew Phillipo notifications@github.com
wrote:

I should have said, this is for development only. Feel free to add a
version to automate the build based upon the RELEASE config stuff too.

This is more about when someone comes over to your desk and you want to
show them what you;ve been working on on device. The mad scrabble to get
the right IP etc. is annoying.


Reply to this email directly or view it on GitHub
#4245 (comment)
.

Understood.

FWIW, my development machine has IP 192.168.0.14. I just used that IP in
AppDelegate.m and it works in both simulator and on device.

There was a bug that prevented this from working when one of iOS9.1 or
Xcode 7.1 came out. It didn't work with the 9.x simulators. I was able to
install the 8.x simulators which did work. It seems to be fixed in one of
the more recent (newer than 0.12) versions of RN.

Your solution is excellent if you have multiple people working on the
project or you use multiple machines (work/home or laptop/desktop kind of
thing). In those cases, you can't rely on a fixed IP like 192.168.0.14.

Cheers

On Fri, Nov 20, 2015 at 6:30 AM, Andrew Phillipo notifications@github.com
wrote:

I should have said, this is for development only. Feel free to add a
version to automate the build based upon the RELEASE config stuff too.

This is more about when someone comes over to your desk and you want to
show them what you;ve been working on on device. The mad scrabble to get
the right IP etc. is annoying.


Reply to this email directly or view it on GitHub
#4245 (comment)
.

@aphillipo

This comment has been minimized.

Show comment
Hide comment
@aphillipo

aphillipo Nov 20, 2015

Yeah, I've just been consistently working from cafe's and hotel lobbies on a project outside of work. It's annoying having to change it and getting out of sync so I decided to fix it!

For pointing APIs at my local machine does anyone know how I'd access the Info.plist value from the React/JS side of the app?

Yeah, I've just been consistently working from cafe's and hotel lobbies on a project outside of work. It's annoying having to change it and getting out of sync so I decided to fix it!

For pointing APIs at my local machine does anyone know how I'd access the Info.plist value from the React/JS side of the app?

@mschwartz

This comment has been minimized.

Show comment
Hide comment
@mschwartz

mschwartz Nov 20, 2015

Try this:

ifconfig | grep inet\ | tail -1 | cut -d " " -f 2

I think that will work for any en* interface.

On Fri, Nov 20, 2015 at 6:55 AM, Andrew Phillipo notifications@github.com
wrote:

Yeah, I've just been consistently working from cafe's and hotel lobbies on
a project outside of work. It's annoying having to change it and getting
out of sync so I decided to fix it!

For APIs the app uses does anyone know how I'd access the Info.plist value
from the React/JS side of the app?


Reply to this email directly or view it on GitHub
#4245 (comment)
.

Try this:

ifconfig | grep inet\ | tail -1 | cut -d " " -f 2

I think that will work for any en* interface.

On Fri, Nov 20, 2015 at 6:55 AM, Andrew Phillipo notifications@github.com
wrote:

Yeah, I've just been consistently working from cafe's and hotel lobbies on
a project outside of work. It's annoying having to change it and getting
out of sync so I decided to fix it!

For APIs the app uses does anyone know how I'd access the Info.plist value
from the React/JS side of the app?


Reply to this email directly or view it on GitHub
#4245 (comment)
.

@aphillipo

This comment has been minimized.

Show comment
Hide comment
@aphillipo

aphillipo Nov 20, 2015

I've updated the original code with your suggestion, @mschwartz.

I've updated the original code with your suggestion, @mschwartz.

@mschwartz

This comment has been minimized.

Show comment
Hide comment
@mschwartz

mschwartz Nov 20, 2015

Someone needs to test that out on a system with en0 and en1, maybe with
both connected.

On Fri, Nov 20, 2015 at 9:13 AM, Andrew Phillipo notifications@github.com
wrote:

I've updated the original code with your suggestion, @mschwartz
https://github.com/mschwartz.


Reply to this email directly or view it on GitHub
#4245 (comment)
.

Someone needs to test that out on a system with en0 and en1, maybe with
both connected.

On Fri, Nov 20, 2015 at 9:13 AM, Andrew Phillipo notifications@github.com
wrote:

I've updated the original code with your suggestion, @mschwartz
https://github.com/mschwartz.


Reply to this email directly or view it on GitHub
#4245 (comment)
.

@skevy

This comment has been minimized.

Show comment
Hide comment
@skevy

skevy Nov 24, 2015

Collaborator

@aphillipo this is a great tip!

I'm not sure this should make it in and be default behavior, but perhaps this should exist in a "Tips & Tricks" section of the docs? Thoughts @ide?

Collaborator

skevy commented Nov 24, 2015

@aphillipo this is a great tip!

I'm not sure this should make it in and be default behavior, but perhaps this should exist in a "Tips & Tricks" section of the docs? Thoughts @ide?

@mschwartz

This comment has been minimized.

Show comment
Hide comment
@mschwartz

mschwartz Nov 24, 2015

Same blog post here:

http://moduscreate.com/automated-ip-configuration-for-react-native-development/

fully automated, including fix for setting IP for the debugging web socket :)

Same blog post here:

http://moduscreate.com/automated-ip-configuration-for-react-native-development/

fully automated, including fix for setting IP for the debugging web socket :)

@aphillipo

This comment has been minimized.

Show comment
Hide comment
@aphillipo

aphillipo Nov 25, 2015

Amazing stuff Michael - thanks for the credit and improving the solution considerably 👍

Amazing stuff Michael - thanks for the credit and improving the solution considerably 👍

@satya164

This comment has been minimized.

Show comment
Hide comment
@satya164

satya164 Nov 25, 2015

Collaborator

Do you think this is something that can be in core?

Collaborator

satya164 commented Nov 25, 2015

Do you think this is something that can be in core?

@aphillipo

This comment has been minimized.

Show comment
Hide comment
@aphillipo

aphillipo Nov 25, 2015

I don't see why not; just needs a way to override it maybe? A force IP address setting? All the other stuff other than finding your IP consistently should be totally robust.

I don't see why not; just needs a way to override it maybe? A force IP address setting? All the other stuff other than finding your IP consistently should be totally robust.

@satya164

This comment has been minimized.

Show comment
Hide comment
@satya164

satya164 Nov 25, 2015

Collaborator

@aphillipo Yeah, it definitely will be.

Collaborator

satya164 commented Nov 25, 2015

@aphillipo Yeah, it definitely will be.

@shoreflyer

This comment has been minimized.

Show comment
Hide comment
@shoreflyer

shoreflyer Dec 1, 2015

Just tried this on a fresh app and it works like a charm.
http://moduscreate.com/automated-ip-configuration-for-react-native-development/

+1 for making this part of the process...

Just tried this on a fresh app and it works like a charm.
http://moduscreate.com/automated-ip-configuration-for-react-native-development/

+1 for making this part of the process...

@jaygarcia

This comment has been minimized.

Show comment
Hide comment
@jaygarcia

jaygarcia Dec 1, 2015

Contributor

Dope!

Contributor

jaygarcia commented Dec 1, 2015

Dope!

@jacobbubu

This comment has been minimized.

Show comment
Hide comment
@jacobbubu

jacobbubu Dec 2, 2015

I'm looking for it for long time, great job! Hope that could be merged to the core.

I'm looking for it for long time, great job! Hope that could be merged to the core.

@skevy

This comment has been minimized.

Show comment
Hide comment
@skevy

skevy Dec 7, 2015

Collaborator

@vjeux what are your thoughts about having something like this in core (assuming somebody sends a PR that's robust enough as to not break people's envs)? Not sure if you have any internal concerns that may warrant this not being a core feature.

Collaborator

skevy commented Dec 7, 2015

@vjeux what are your thoughts about having something like this in core (assuming somebody sends a PR that's robust enough as to not break people's envs)? Not sure if you have any internal concerns that may warrant this not being a core feature.

@vjeux

This comment has been minimized.

Show comment
Hide comment
@vjeux

vjeux Dec 8, 2015

Contributor

I have no context on this and would defer to @frantic. But reading the description, it sounds like we would want something like that in core. Whatever hack we can get to make people's experience less painful is welcome.

Contributor

vjeux commented Dec 8, 2015

I have no context on this and would defer to @frantic. But reading the description, it sounds like we would want something like that in core. Whatever hack we can get to make people's experience less painful is welcome.

@aphillipo

This comment has been minimized.

Show comment
Hide comment
@aphillipo

aphillipo Dec 8, 2015

The only part of this that can go wrong is the IP detection. Therefore I would suggest that any pull request include a commented out way to override the detected IP.

// OVERRIDE_DETECTED_IP = '127.0.0.1'; 

Maybe that should be in Info.plist?

The key parts to the pull request are adding the objective c code to AppDelegate.m and making sure the scripts are added when the project is initialised (I have no info on how react-native init creates it's Xcode stuff). Then we'd need to look at changing the docs. Probably would consist of just removing some bits and adding a comment about overriding the IP for weird networking configs.

In addition for this process to be totally complete, generating a release main js file could also be part of the script. All it would require is running "react-native bundle --minify" if the build is set to release.

To sum up the following conditions would now be automated:

  1. Running locally (automatically selecting localhost on the simulator)
  2. Running on device in DEBUG mode (automatically allowing debugging in a remote browser and referencing the machine the JS is on over the network based on automated IP detection)
  3. Building for Release on Device (Building the JS and setting mainBundle to be the file path).

Things that would need to be figured out:

  1. IP Address detection fails.
  2. Warnings about running on device when there is no network?
  3. Building for RELEASE on the simulator (is this necessary and would it just work?)
  4. I have absolutely no idea how to write tests for this!

I can have a look at this if you want a PR.

The only part of this that can go wrong is the IP detection. Therefore I would suggest that any pull request include a commented out way to override the detected IP.

// OVERRIDE_DETECTED_IP = '127.0.0.1'; 

Maybe that should be in Info.plist?

The key parts to the pull request are adding the objective c code to AppDelegate.m and making sure the scripts are added when the project is initialised (I have no info on how react-native init creates it's Xcode stuff). Then we'd need to look at changing the docs. Probably would consist of just removing some bits and adding a comment about overriding the IP for weird networking configs.

In addition for this process to be totally complete, generating a release main js file could also be part of the script. All it would require is running "react-native bundle --minify" if the build is set to release.

To sum up the following conditions would now be automated:

  1. Running locally (automatically selecting localhost on the simulator)
  2. Running on device in DEBUG mode (automatically allowing debugging in a remote browser and referencing the machine the JS is on over the network based on automated IP detection)
  3. Building for Release on Device (Building the JS and setting mainBundle to be the file path).

Things that would need to be figured out:

  1. IP Address detection fails.
  2. Warnings about running on device when there is no network?
  3. Building for RELEASE on the simulator (is this necessary and would it just work?)
  4. I have absolutely no idea how to write tests for this!

I can have a look at this if you want a PR.

@aarongreenwald

This comment has been minimized.

Show comment
Hide comment
@aarongreenwald

aarongreenwald Dec 8, 2015

I really like this, it helped a lot. The only thing is that it failed for me when I had more than just en0. When I change it to ifconfig en0 | grep inet\ | tail -1 | cut -d " " -f 2 it works regardless of whether I have ethernet connected or not. Of course I don't know how many other environments will break with that change. @mschwartz

I really like this, it helped a lot. The only thing is that it failed for me when I had more than just en0. When I change it to ifconfig en0 | grep inet\ | tail -1 | cut -d " " -f 2 it works regardless of whether I have ethernet connected or not. Of course I don't know how many other environments will break with that change. @mschwartz

@adamterlson

This comment has been minimized.

Show comment
Hide comment
@adamterlson

adamterlson Dec 8, 2015

Contributor

For pointing APIs at my local machine does anyone know how I'd access the Info.plist value from the React/JS side of the app?

Perhaps a different PR/effort, but this would be immensely useful.

Contributor

adamterlson commented Dec 8, 2015

For pointing APIs at my local machine does anyone know how I'd access the Info.plist value from the React/JS side of the app?

Perhaps a different PR/effort, but this would be immensely useful.

@mschwartz

This comment has been minimized.

Show comment
Hide comment
@mschwartz

mschwartz Dec 8, 2015

@aarongreenwald

If you have more than one network device (e.g. both en0 and en1 active), then my detection will perhaps fail and choose the wrong one. It is also likely to fail if you have something like VirtualBox installed with its bridge devices. Or VPN. And so on.

I suggest we can add another #if to the code:

#define AUTO_DETECT_IP
//#undef AUTO_DECTECT_IP
// uncomment the #undef to use the old code

#ifdef AUTO_DETECT_IP
// ... my suggested code based on @aphillipo's work
#else
// the existing code that people can edit the IP manually
// including the method 1 and method 2 both
#endif

This solution probably works for 90%+ of the people and is no worse than what we have to go through now for the remaining ~10%.

@aarongreenwald

If you have more than one network device (e.g. both en0 and en1 active), then my detection will perhaps fail and choose the wrong one. It is also likely to fail if you have something like VirtualBox installed with its bridge devices. Or VPN. And so on.

I suggest we can add another #if to the code:

#define AUTO_DETECT_IP
//#undef AUTO_DECTECT_IP
// uncomment the #undef to use the old code

#ifdef AUTO_DETECT_IP
// ... my suggested code based on @aphillipo's work
#else
// the existing code that people can edit the IP manually
// including the method 1 and method 2 both
#endif

This solution probably works for 90%+ of the people and is no worse than what we have to go through now for the remaining ~10%.

@mschwartz

This comment has been minimized.

Show comment
Hide comment
@mschwartz

mschwartz Dec 8, 2015

 ~  ifconfig -a | grep inet\
    inet 127.0.0.1 netmask 0xff000000
    inet 192.168.0.104 netmask 0xffff0000 broadcast 192.168.255.255
 ~  ifconfig -a | grep inet\  | grep -v 127.0.0.1
    inet 192.168.0.104 netmask 0xffff0000 broadcast 192.168.255.255
 ~  ifconfig -a | grep inet\
    inet 127.0.0.1 netmask 0xff000000
    inet 192.168.0.104 netmask 0xffff0000 broadcast 192.168.255.255
 ~  ifconfig -a | grep inet\  | grep -v 127.0.0.1
    inet 192.168.0.104 netmask 0xffff0000 broadcast 192.168.255.255
@aarongreenwald

This comment has been minimized.

Show comment
Hide comment
@aarongreenwald

aarongreenwald Dec 8, 2015

@mschwartz But then it's all or nothing. If you have more than one active network device you have to change your IP every day (or however often you're issued a new IP address, I think I get it daily).

What if we parametrized the network device to look for, default to any? This way I could say I always want en0 and I only have to do it once. For people with only one network device, or where their wireless card is always last, the default will work.

I don't know, maybe that makes the configuration too complicated and isn't worth the cost. I went ahead and fixed it to en0 for my code base anyway so it isn't pressing for me.

@mschwartz But then it's all or nothing. If you have more than one active network device you have to change your IP every day (or however often you're issued a new IP address, I think I get it daily).

What if we parametrized the network device to look for, default to any? This way I could say I always want en0 and I only have to do it once. For people with only one network device, or where their wireless card is always last, the default will work.

I don't know, maybe that makes the configuration too complicated and isn't worth the cost. I went ahead and fixed it to en0 for my code base anyway so it isn't pressing for me.

@mschwartz

This comment has been minimized.

Show comment
Hide comment
@mschwartz

mschwartz Dec 8, 2015

The issue is you take your laptop to work and use ethernet. en1 it is?

Then you go to Starbucks and you use wifi. en0 it is?

Or you and I work on a project together. Your laptop uses en0 wifi, my iMac uses en1 wifi. When either of us commits and pushes our code to the repo, we stomp on the other's changes.

Like I said, for the odd cases where there's more than one interface live and the script isn't detecting the right one, you can do the manual/painful thing we do today: uncomment the #undef, and edit the IP manually (or in your case, hardcode en0).

If you have two interfaces up, there's no way to automatically pick which one you REALLY want...

The issue is you take your laptop to work and use ethernet. en1 it is?

Then you go to Starbucks and you use wifi. en0 it is?

Or you and I work on a project together. Your laptop uses en0 wifi, my iMac uses en1 wifi. When either of us commits and pushes our code to the repo, we stomp on the other's changes.

Like I said, for the odd cases where there's more than one interface live and the script isn't detecting the right one, you can do the manual/painful thing we do today: uncomment the #undef, and edit the IP manually (or in your case, hardcode en0).

If you have two interfaces up, there's no way to automatically pick which one you REALLY want...

@mschwartz

This comment has been minimized.

Show comment
Hide comment
@mschwartz

mschwartz Dec 8, 2015

~  netstat -in | grep en
en0   1500  <Link#4>    ac:87:a3:0f:fe:3d     5443     0     9862     0     0
en1   1500  <Link#5>    b8:09:8a:bc:ee:8d 240392969     0 338836605     0     0
en1   1500  fe80::ba09: fe80:5::ba09:8aff 240392969     - 338836605     -     -
en1   1500  192.168.0/16  192.168.0.104   240392969     - 338836605     -     -
en2   1500  <Link#6>    0a:00:00:39:06:70        0     0        0     0     0
en3   1500  <Link#7>    0a:00:00:39:06:71        0     0        0     0     0
 ~  netstat -in | grep en | grep /
en1   1500  192.168.0/16  192.168.0.104   240393212     - 338836846     -     -
~  netstat -in | grep en
en0   1500  <Link#4>    ac:87:a3:0f:fe:3d     5443     0     9862     0     0
en1   1500  <Link#5>    b8:09:8a:bc:ee:8d 240392969     0 338836605     0     0
en1   1500  fe80::ba09: fe80:5::ba09:8aff 240392969     - 338836605     -     -
en1   1500  192.168.0/16  192.168.0.104   240392969     - 338836605     -     -
en2   1500  <Link#6>    0a:00:00:39:06:70        0     0        0     0     0
en3   1500  <Link#7>    0a:00:00:39:06:71        0     0        0     0     0
 ~  netstat -in | grep en | grep /
en1   1500  192.168.0/16  192.168.0.104   240393212     - 338836846     -     -
@mschwartz

This comment has been minimized.

Show comment
Hide comment
@mschwartz

mschwartz Dec 8, 2015

 ~  ifconfig | grep inet\ | grep -v 127.0 | head -1 | cut -d " " -f 2
192.168.0.104
 ~  ifconfig | grep inet\ | grep -v 127.0 | tail -1 | cut -d " " -f 2
192.168.0.104

The first variation returns the first IP address that's not 127.0.0.1

The second variation returns the last IP address that's not 127.0.0.1

 ~  ifconfig | grep inet\ | grep -v 127.0 | head -1 | cut -d " " -f 2
192.168.0.104
 ~  ifconfig | grep inet\ | grep -v 127.0 | tail -1 | cut -d " " -f 2
192.168.0.104

The first variation returns the first IP address that's not 127.0.0.1

The second variation returns the last IP address that's not 127.0.0.1

@skevy

This comment has been minimized.

Show comment
Hide comment
@skevy

skevy Dec 8, 2015

Collaborator

@aphillipo go ahead and start on a PR for this. Happy to help review, provide tips and get it merged into core.

Collaborator

skevy commented Dec 8, 2015

@aphillipo go ahead and start on a PR for this. Happy to help review, provide tips and get it merged into core.

@mschwartz

This comment has been minimized.

Show comment
Hide comment
@mschwartz

mschwartz Dec 8, 2015

I would have done a PR, but I couldn't figure out how the react guys are
creating the template for the xcodeproj file.

Maybe some documentation I missed somewhere? Or maybe something to add to
the main README.md for developers?

On Tue, Dec 8, 2015 at 8:45 AM, Adam Miskiewicz notifications@github.com
wrote:

@aphillipo https://github.com/aphillipo go ahead and start on a PR for
this. Happy to help review, provide tips and get it merged into core.


Reply to this email directly or view it on GitHub
#4245 (comment)
.

I would have done a PR, but I couldn't figure out how the react guys are
creating the template for the xcodeproj file.

Maybe some documentation I missed somewhere? Or maybe something to add to
the main README.md for developers?

On Tue, Dec 8, 2015 at 8:45 AM, Adam Miskiewicz notifications@github.com
wrote:

@aphillipo https://github.com/aphillipo go ahead and start on a PR for
this. Happy to help review, provide tips and get it merged into core.


Reply to this email directly or view it on GitHub
#4245 (comment)
.

@mschwartz

This comment has been minimized.

Show comment
Hide comment
@mschwartz

mschwartz Dec 9, 2015

@satya164 Yeah, I saw that much, but looking at the pbxproj file, there are a bunch of hash numbers and values in comment strings, and so on. I'm not clear on how to add the run phase to this template file:

https://github.com/facebook/react-native/blob/master/local-cli/generator-ios/templates/xcodeproj/project.pbxproj

What hash number do I choose? These seem to be generated by Xcode. So what I was suggesting was some docs on how to load these templates into Xcode, how to modify them, and how to save them back.

There's no whatever.xcodeproj to load in the repo...

Also, the UIExplorer demo has some really old code in it, last time I looked. The AppDelegate.m file doesn't look anything like modern react-native.

@satya164 Yeah, I saw that much, but looking at the pbxproj file, there are a bunch of hash numbers and values in comment strings, and so on. I'm not clear on how to add the run phase to this template file:

https://github.com/facebook/react-native/blob/master/local-cli/generator-ios/templates/xcodeproj/project.pbxproj

What hash number do I choose? These seem to be generated by Xcode. So what I was suggesting was some docs on how to load these templates into Xcode, how to modify them, and how to save them back.

There's no whatever.xcodeproj to load in the repo...

Also, the UIExplorer demo has some really old code in it, last time I looked. The AppDelegate.m file doesn't look anything like modern react-native.

@satya164

This comment has been minimized.

Show comment
Hide comment
@satya164

satya164 Dec 9, 2015

Collaborator

I don't know much about this. @ide Any idea on this?

Collaborator

satya164 commented Dec 9, 2015

I don't know much about this. @ide Any idea on this?

@skevy

This comment has been minimized.

Show comment
Hide comment
@skevy

skevy Dec 9, 2015

Collaborator

@mschwartz what I would do (and there may be an easier way) is react-native init a new project, change the XCode project file appropriately, and apply the diff to the template file.

Collaborator

skevy commented Dec 9, 2015

@mschwartz what I would do (and there may be an easier way) is react-native init a new project, change the XCode project file appropriately, and apply the diff to the template file.

@skevy

This comment has been minimized.

Show comment
Hide comment
@skevy

skevy Dec 9, 2015

Collaborator

(and by apply the diff, I mean copy over the build phase)

Collaborator

skevy commented Dec 9, 2015

(and by apply the diff, I mean copy over the build phase)

@mschwartz

This comment has been minimized.

Show comment
Hide comment
@mschwartz

mschwartz Dec 9, 2015

Are these hash values in the .prxproj file somehow tied to the specific project?

They look like uuid of some sort, but could be used as a key in some internal Xcode table I'm unaware of.

I'll try your suggestion anyhow.

Are these hash values in the .prxproj file somehow tied to the specific project?

They look like uuid of some sort, but could be used as a key in some internal Xcode table I'm unaware of.

I'll try your suggestion anyhow.

@mschwartz

This comment has been minimized.

Show comment
Hide comment
@mschwartz

mschwartz Dec 9, 2015

#4681

Pull request created.

#4681

Pull request created.

@rclai

This comment has been minimized.

Show comment
Hide comment
@rclai

rclai Dec 10, 2015

Contributor

Guys, this is really awesome, great work. It is truly annoying having to press play on Xcode, wait for the build, then be welcomed with the red screen of death because I forgot to change the dev URL.

Contributor

rclai commented Dec 10, 2015

Guys, this is really awesome, great work. It is truly annoying having to press play on Xcode, wait for the build, then be welcomed with the red screen of death because I forgot to change the dev URL.

@kwcto

This comment has been minimized.

Show comment
Hide comment
@kwcto

kwcto Jan 7, 2016

Contributor

This tweak filters out additional inet interfaces (VirtualBox has created two on my machine):
http://stackoverflow.com/a/13322549/45852

INFOPLIST="${TARGET_BUILD_DIR}/${INFOPLIST_PATH}"
echo "writing to $INFOPLIST"
PLISTCMD="Add :SERVER_IP string $(ifconfig | head -30 | grep inet\ | tail -1 | cut -d " " -f 2)"
echo -n "$INFOPLIST" | xargs -0 /usr/libexec/PlistBuddy -c "$PLISTCMD" || true
PLISTCMD="Set :SERVER_IP $(ifconfig | head -30 | grep inet\ | tail -1 | cut -d " " -f 2)"
echo -n "$INFOPLIST" | xargs -0 /usr/libexec/PlistBuddy -c "$PLISTCMD" || true

Contributor

kwcto commented Jan 7, 2016

This tweak filters out additional inet interfaces (VirtualBox has created two on my machine):
http://stackoverflow.com/a/13322549/45852

INFOPLIST="${TARGET_BUILD_DIR}/${INFOPLIST_PATH}"
echo "writing to $INFOPLIST"
PLISTCMD="Add :SERVER_IP string $(ifconfig | head -30 | grep inet\ | tail -1 | cut -d " " -f 2)"
echo -n "$INFOPLIST" | xargs -0 /usr/libexec/PlistBuddy -c "$PLISTCMD" || true
PLISTCMD="Set :SERVER_IP $(ifconfig | head -30 | grep inet\ | tail -1 | cut -d " " -f 2)"
echo -n "$INFOPLIST" | xargs -0 /usr/libexec/PlistBuddy -c "$PLISTCMD" || true

@rturk

This comment has been minimized.

Show comment
Hide comment
@rturk

rturk Jan 18, 2016

This can help.
I'm using Mac so I can simply use mymacsharingname.local so jsBundleUrlString becomes @"http://mymacsharingname.local:8081/index.ios.bundle";

rturk commented Jan 18, 2016

This can help.
I'm using Mac so I can simply use mymacsharingname.local so jsBundleUrlString becomes @"http://mymacsharingname.local:8081/index.ios.bundle";

@aleclarson

This comment has been minimized.

Show comment
Hide comment
@aleclarson

aleclarson Mar 8, 2016

Contributor

#6362 and #6345 both have a go at fixing this issue

Contributor

aleclarson commented Mar 8, 2016

#6362 and #6345 both have a go at fixing this issue

@jondot

This comment has been minimized.

Show comment
Hide comment
@jondot

jondot May 4, 2016

Contributor

You can now try this https://github.com/jondot/react-native-network-boot

It should automatically find and link your .xcodeproj with the run script, and the IP detection script is sort of more generic than the normal ways suggested (since I personally move between LAN and WAN and routers a lot).
It will modify your .plist and add a local IP, but only the one that's to be packaged and not in your source tree, so you won't even feel that it's there.

Contributor

jondot commented May 4, 2016

You can now try this https://github.com/jondot/react-native-network-boot

It should automatically find and link your .xcodeproj with the run script, and the IP detection script is sort of more generic than the normal ways suggested (since I personally move between LAN and WAN and routers a lot).
It will modify your .plist and add a local IP, but only the one that's to be packaged and not in your source tree, so you won't even feel that it's there.

@lacker

This comment has been minimized.

Show comment
Hide comment
@lacker

lacker Oct 24, 2016

Contributor

Looks like this is fixed now

Contributor

lacker commented Oct 24, 2016

Looks like this is fixed now

@lacker lacker closed this Oct 24, 2016

@facebook facebook locked as resolved and limited conversation to collaborators Jul 20, 2018

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.