Realm-js: Failed to execute 'send' on 'XMLHttpRequest', React Native Debugger

[byk04712]

{
    "react": "16.0.0-alpha.6",
    "react-native": "^0.44.0",
    "realm": "^1.3.1",
     ...
}

When i debugger on Android，I've this error. But debugger on iOS Simulator. It's working.

Please hope

[blagoev]

Have you checked the port 8082 is forwarded properly.

adb forward will show if it is currently. Also check you don't have multiple emulators running.

[jcharlet]

hi!
exactly the same issue (as displayed in android emulator + errors in chrome debugging).
port is not forwarded properly, when I add it, the app still does not work, and if I reload the app in the emulator, the port is not forwarded anymore.

42:$ adb forward tcp:8082 tcp:8082
adb server is out of date. killing...

• daemon started successfully *
  42:$ adb forward --list
  emulator-5554 tcp:8082 tcp:8082

[blagoev]

@jcharlet It seems you are using two different versions of adb. Can you check you don't have android tools on two places on your system with different versions

[jcharlet]

that was it! thanks @blagoev now the debugging tool is very slow to load but it is mentioned in another issue

[Selman555]

I'm receiving the same issue for no apparent reason because it was working before.

The adb forwarding checks out:

adb forward --list
0215393942364341 tcp:8082 tcp:8082

adb devices -l
0215393942364341       device usb:336592896X product:zenltexx model:SM_G928F device:zenlte

[airguide]

This may sound dumb but it worked for me: You have to make sure you're on the same network on the real device and the computer

[keermanish]

I'm still facing this issue.

working on android(emulator), I've tried adb forward tcp:8082 tcp:8082 but didn't work.
my react-native server is running on 8088 (react-native start --port 8088)

Please guide.

[hdsenevi]

Hi guys,

I had the same issue and these are the steps that I followed to resolve it.

• adb forward tcp:8082 tcp:8082
• adb forward --list (check if your device/emulator is in the list)
• close or detach usb cable if you have more than one device/emulator opened (in my case I had one emulator and one physical device plugged in) - in short ONLY keep one device open
• uninstall the app and re-install and start debugging as normally

Hope this helps someone

[arshbot]

Erm... I'm facing the same issue but unlike anyone in this thread, I'm using an iOS simulator

[MatthieuPeyrot]

I have the same issue when I try to use Debug JS Remotely on iOS simulator and on device i have

Failed to execute 'send' on 'XMLHttpRequest', React Native Debugger

I using the last version react native and realm

[rabahs]

I am getting this message on iOS device by just importing Realm: Failed to execute 'open' on 'XMLHttpRequest' and only when Debug JS Remotely is enabled.

[xotahal]

It seems they just switched from localhost to actual ip address. See https://github.com/facebook/react-native/pull/17720/files

Just temporary solution!

So I've changed:
https://github.com/realm/realm-js/blob/master/react-native/ios/RealmReact/RealmReact.mm#L124
Instead of:

#if TARGET_IPHONE_SIMULATOR
    NSArray *hosts = @[@"localhost"];
#else
    NSArray *hosts = [self getIPAddresses];
#endif

I used this:

NSArray *hosts = [self getIPAddresses];

And in here:
https://github.com/realm/realm-js/blob/master/react-native/ios/RealmReact/RealmReact.mm#L250
Instead of this:

[response setValue:@"http://localhost:8081" forAdditionalHeader:@"Access-Control-Allow-Origin"];

I used this:

[response setValue:@"http://192.168.x.x:8081" forAdditionalHeader:@"Access-Control-Allow-Origin"];

[arsenalexanyan]

Thanks @xotahal, this helped me to fix the issue on IOS device.

Actually I have used only the second suggestion: but instead of http://192.168.x.x:8081 I have put there the host of my up and running debugger which had 'http://192.168.x.x.xip.io:8081'strange format.

[lucaszanella]

Could someone explain to me the source of the problem? Is the phone trying to connect to something in the host? Because if that's the case, why adb forward instead of adb reverse? I'm running a very complicated setup (docker inside virtual machine and emulator outside virtual machine) so I need to know exactly what's happening in the network level so I can redirect the ports accordingly.

It looks like the phone is trying to access localhost:8083 on my device. Therefore I should do adb reverse, not adb forward...

[brayanL]

What Happend friends, what is the solution?

[otaviogaiao]

Having the same issue on iOS simulator.

[dhirendrarathod2000]

it works for me with what @xotahal suggested but that did not work for me when i did Debug JS Remotly

in RealmReact.xcodeproj > RealmReact > RealmReact.mm

[response setValue:@"http://192.168.x.x.xip.io:8081" forAdditionalHeader:@"Access-Control-Allow-Origin"];

This is what worked for me
see the URL with xip.io domain.

Thanks
D

[kaushal9678]

The solution provided by @Selman555.

it worked for me. I hope it will work for others also.

My guess is as follows.
Running on a device and debugging fails because normally adb forward tcp:8082 tcp:8082 takes care of the correct redirection from device to host.
Because you are debugging from chrome http://:8082/create_session is an invalid url.

I changed the following lines in node_modules/realm/lib/browser/rpc.js

// The global __debug__ object is provided by Visual Studio Code.
if (global.__debug__) {
let request = global.__debug__.require('sync-request');
let response = request('POST', url, {
body: JSON.stringify(data),
headers: {
"Content-Type": "text/plain;charset=UTF-8"
}
});

statusCode = response.statusCode;
responseText = response.body.toString('utf-8');

} else {
let body = JSON.stringify(data);
let request = new XMLHttpRequest();

request.open('POST', url, false);
request.send(body);

statusCode = request.status;
responseText = request.responseText;

}
to

// The global __debug__ object is provided by Visual Studio Code.
if (global.__debug__) {
let request = global.__debug__.require('sync-request');
let response = request('POST', url, {
body: JSON.stringify(data),
headers: {
"Content-Type": "text/plain;charset=UTF-8"
}
});

statusCode = response.statusCode;
responseText = response.body.toString('utf-8');

} else {
let body = JSON.stringify(data);
let request = new XMLHttpRequest();

// ALWAYS POINT TO LOCALHOST
if (__DEV__) {
    url = 'http://localhost:8082' + url.substring(url.lastIndexOf('/'));
}

request.open('POST', url, false);
request.send(body);

statusCode = request.status;
responseText = request.responseText;

}
And now everything works fine (even when not debugging remotely)
I hope this helps

[matheusgrieger]

None of the solutions above has worked for me... Tried to forward with adb, tried to edit code, nothing helped.

I'm not even using the whole platform, just the React Native database. No sync options whatsoever. Why is this create_session being called?

[truongluuxuan]

This is error by version off Realm, change version to 2.16.0. done, enjoy.

[michael-harley]

This may sound dumb but it worked for me: You have to make sure you're on the same network on the real device and the computer

Wow really, this works somehow.
It ain't dumb if it's worked. ;)

Thanks for sharing, saved me time.

[vikil143]

I tried all above solution but none of them worked for please any one works properly please let me know