realm / realm-js

Realm is a mobile database: an alternative to SQLite & key-value stores
https://realm.io
Apache License 2.0
5.77k stars 573 forks source link

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

Closed byk04712 closed 7 years ago

byk04712 commented 7 years ago

wx20170527-113423

wx20170527-113652

{
    "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 commented 7 years ago

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 commented 7 years ago

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...

blagoev commented 7 years ago

@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 commented 7 years ago

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

Selman555 commented 7 years ago

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 commented 6 years ago

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 commented 6 years ago

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 commented 6 years ago

Hi guys,

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

Hope this helps someone

arshbot commented 6 years ago

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

MatthieuPeyrot commented 6 years ago

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 commented 6 years ago

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 commented 6 years ago

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 commented 6 years ago

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.

lattice0 commented 6 years ago

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 commented 6 years ago

What Happend friends, what is the solution?

otaviogaiao commented 6 years ago

Having the same issue on iOS simulator.

dhirendrarathod2000 commented 6 years ago

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 commented 6 years ago

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 commented 5 years ago

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 commented 5 years ago

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

michael-harley commented 5 years ago

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 commented 3 years ago

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