ignite-jhipster does't work with backend Jhipster

Question

I follow this tutorial https://jruddell.com/blog/ignite-jhipster.

I create backend and start it, i create the frontend and push the app on a device (avd), i try to login with user/user, it doesn't work, but on web http://localhost:8080/ it works well.

AppConfig.js

export default {
  apiUrl: 'http://localhost:8080',
  appUrlScheme: 'mobile',
  // font scaling override - RN default is on
  allowTextFontScaling: true
}

The react-native config changed ? And how can i see the logs with ignite-jhispter ?

Thanks you

Can you access http://localhost:8080 from your device's browser? You may need to specify your computer's local network IP if not — Jon Ruddell, May 01 '18 at 14:11
No i can't access to localhost:8080 from my avd, how i can confgure that ? — csu, May 01 '18 at 14:43
I usually use my computer's local IP. You can also use `10.0.2.2:8080` See https://stackoverflow.com/a/6310592/3737815 — Jon Ruddell, May 01 '18 at 15:31
I can access on avd's browser with 10.0.2.2:8080, so i replace 'apiUrl' in the AppConfig.js, but the app launch in the avd can't login. Someone can try the tutorial please ? — csu, May 01 '18 at 15:37
You're right, 10.0.2.2 doesn't work either. Using your computer's local IP works though. I added an answer — Jon Ruddell, May 02 '18 at 01:38

Jon Ruddell · Answer 1 · 2018-05-02T14:28:34.697

1

When you start your JHipster backend, it displays the local and external IPs that your app is reachable at. Copy the External IP and use that as your API url. http://localhost:8080 will work with the iOS emulator, but not the Android emulator as it has its own loopback service.

----------------------------------------------------------
    Application 'backend' is running! Access URLs:
    Local:      http://localhost:8080
    External:   http://10.0.0.113:8080 <- Use this as your apiUrl for Android
    Profile(s):     [swagger, dev]
----------------------------------------------------------

edited May 02 '18 at 14:28

answered May 02 '18 at 01:37

Jon Ruddell

6,244
1
22
40

i use the avd, It's possible to see the URL called by the app ? Running C:\Users\Me\AppData\Local\Android\Sdk\/platform-tools/adb -s emulator-5554 reverse tcp:8081 tcp:8081 – csu May 02 '18 at 12:24
As mentioned in the Ignite JHipster readme, I recommend using Reactotron for debugging, logs, and network requests https://github.com/infinitered/reactotron/tree/v1.x. You would need to configure the IP in ReactotronConfig.js as well. Otherwise, use the standard React Native debugging tools https://facebook.github.io/react-native/docs/debugging.html – Jon Ruddell May 02 '18 at 13:45
react-native can't access to localhost server – csu May 02 '18 at 13:48
The external IP shows an IP, not localhost. I verified this solution on an android emulator – Jon Ruddell May 02 '18 at 14:27
any IP doesn't work too, it seems a react-native know problem on android emulator, but IOS works well. – csu May 02 '18 at 15:16

csu · Accepted Answer · 2018-05-04T07:53:27.043

0

Finally, i found it :D

After launching the android emulator:

adb reserve tcp:8080 tcp:8080

I must specify the port when i run the app:

react-native run-android --port 8080

And of course, as you said, use this IP 10.0.2.2 in AppConfig.js

export default {
  apiUrl: 'http://10.0.2.2:8080',
  appUrlScheme: 'mobile',
  allowTextFontScaling: true
}

It works on my avd now.

edited May 04 '18 at 07:53

answered May 03 '18 at 09:33

csu

385
1
7
20

The `--port` flag starts the React Native packager on that port, I don't think it's doing what you expect. – Jon Ruddell May 03 '18 at 15:19
I have another problem, the can't update when i press twice 'R', it call http://10.0.2.2:8181/index.delta?[...]. The port 8181 is already used by McAfee. – csu May 03 '18 at 15:41
Try using `--port 8083`, 8080 is used by your backend and the default port for the React Native packager is 8081 but that is in use by McAfee https://kc.mcafee.com/corporate/index?page=content&id=KB66797 – Jon Ruddell May 03 '18 at 15:50
It works with this solution https://stackoverflow.com/questions/37376512/dev-server-returned-error-code-403-react-native – csu May 03 '18 at 20:06

ignite-jhipster does't work with backend Jhipster

2 Answers2