I am using Visual Studio 2013 Update 4 and I have a web api project setup to receive get requests that returns an array. For the client app I have setup cordova and am emulating an android angular app using ng-resource to call the web api get. Everytime I call the GET I get a ripple.js error that says connection refused. I get the connection refused even if I try with a real android device as well. Here is the error when using the ripple emulator
OPTIONS http://****:4400/ripple/xhr_proxy?tinyhippos_apikey=ABC&tinyhippos_rur…Fget%3D%257B%2522method%2522%3A%2522GET%2522%2C%2522array%2522%3Atrue%257D net::ERR_CONNECTION_REFUSED
I was sure to enable cors on the web api 2 server since the cordova and web api projects are different port numbers on the same local host. I proved not only the cors functionality but also the code by creating an exact replica of the cordova angular app with just angular web page. I also tried with postman and both get json responses correctly. It is only the cordova android app that is giving me the connection refused. Any help would be greatly appreciated!
Here is what the angular get looks like
app.factory('mrMaintService', function ($resource) {
return $resource('http://localhost:15528/api/requests', {
get: { method: 'GET', array: true }
});
});
This shows I am allowing all domains on the web api project:
<httpProtocol>
<customHeaders>
<add name="Access-Control-Allow-Origin" value="*" />
</customHeaders>
</httpProtocol>
The solution was to disable cross domain proxies from the drop down right in the emulator. Easy mistake to make if you aren't familiar with the ripple emulator.
The answer as it pertains to issues with accessing http://localhost (which is the same thing as 127.0.0.1) can be found here: http://developer.android.com/tools/devices/emulator.html - which says:
"Also note that the address 127.0.0.1 on your development machine corresponds to the emulator's own loopback interface. If you want to access services running on your development machine's loopback interface (a.k.a. 127.0.0.1 on your machine), you should use the special address 10.0.2.2 instead."
So, instead of using http://localhost use http://10.0.2.2 and then append whatever port you're using. Example: http://localhost:8001 can be access at http://10.0.2.2:8001
Related
In my Expo React Native app, I've been trying to fetch data from my Ruby on Rails API but it seems that http connections are not allowed.
All the solutions I've found either add configuration to AndroidManifest.xml in Android and Info.plist in iOS which I can't access, but I'd rather keep development in Expo instead of ejecting. I've tried changing localhost to 127.0.0.1, 10.0.2.2, and my machine's IP as well, but none worked. I've looked at the documentation for configuration with app.json and networking but I can't find anything about configuring App Transport Security within Expo. I'm currently running Expo on android 9.0 Pie.
fetch(`http://localhost:3000/api/v1/trainers`, {
headers: {
Accept: 'application/json',
"Content-Type": "application/json"
},
}).then(res => res.json())
.catch(err => console.log(err));
TypeError: Network request failed
at XMLHttpRequest.xhr.onerror (420454d9-7271-44d5-b…-3a968d130699:48065)
at XMLHttpRequest.dispatchEvent (420454d9-7271-44d5-b…-3a968d130699:53513)
at XMLHttpRequest.setReadyState (420454d9-7271-44d5-b…-3a968d130699:52368)
at XMLHttpRequest.__didCompleteResponse (420454d9-7271-44d5-b…-3a968d130699:52195)
at 420454d9-7271-44d5-b…-3a968d130699:52305
at RCTDeviceEventEmitter.emit (420454d9-7271-44d5-b…-3a968d130699:22482)
at MessageQueue.__callFunction (420454d9-7271-44d5-b…-3a968d130699:22097)
at 420454d9-7271-44d5-b…-3a968d130699:21854
at MessageQueue.__guard (420454d9-7271-44d5-b…-3a968d130699:22051)
at MessageQueue.callFunctionReturnFlushedQueue (420454d9-7271-44d5-b…-3a968d130699:21853)
What domain is your REST api on?
I was having the same problem with fetching from a react native app (running on an emulator) to a node.js/express REST api. I couldn't find a workaround within React.
I found a solution with ngrok (https://ngrok.com). It allows you to expose a specific local domain:port to the outside. With this method I was able to fetch from my app to my REST api.
To be clear, I'm not sure the problem is on React-Native's end. I suspect it was my firewall not allowing the connection to go through. Instead of messing with all of those settings, I simply used ngrok.
I am writing a SPA using create-react-app and am using an expressjs server as my backend. For development I run my frontend test server on port 3000 and my backend expressjs test server on 3003.
I make many API calls client side using Axios so for development convenience I have defined proxy: "http://localhost:3003" in my package.json
This works fine on my laptop, but when running on my workstation I constantly get the error when accessing my app:
Proxy error: Could not proxy request /sockjs-node/487/wrst1bub/websocket from localhost:3000 to http://localhost:3003/. See https://nodejs.org/api/errors.html#errors_common_system_errors for more information (ECONNRESET).
I have no idea where this is coming from and I do not use sockjs in any capacity as far as I know. This is a console error and it does not crash my app but it is very annoying and I would like to get rid of it. Any help is greatly appreciated.
In my case, I was using Firefox and for some reasons, it gives me the same error. I tried to use Chrome and it worked!
I have an app built on react native and I want to connect to a database that i have made on the Microsoft SQL server. I have searched online and there are things like myssql but I still get errors with that. I followed this tutorial nodejs from the official Microsoft website, and it works with the nodejs and I use node to run it, but how can i use this in my react native project?
You can use AXIOS to make requests to your NodeJS Server
In Android you can access your localhost by the IP 10.0.2.2 (default proxy configured in your Android Virtual Device).
In iOS you can just use localhost
Remember to add the port assigned your NodeJS Server and the
protocol http
Example URL for Android: http://10.0.2.2:3000
You need to write back-end service code.I suggest you to use Asp.Net Web API .You can use Entity Framework.
Also you can use PHP,Java or Python...
I'm trying to debug my Android app built with cordova over USB.
My device is showing up in adb and chrome://inspect and I've port forwarded the device to connect to localhost:9000.
I have confirmed that the port forwarding is working, since I can access localhost:9000 from Chrome on the device.
However when the app tries tp make a request to localhost:9000, I get a 404 (Not Found) error.
I can copy the same address the app is trying to access and it opens correctly in Chrome on the device and also through the address bar of the webview inspector in Chrome devtools on my dev machine.
Why is my app unable to connect to localhost when Chrome can?
EDIT:
The closest similar issue I could find was Android device communicate with local API server
However the solution suggested, adding a CSP, didn't resolve my issue.
Some things I've tried to no avail:
Added a CSP
Updated the whitelist plugin
Added <allow-intent href="*" /> and <allow-navigation href="*" />
Updated the CLI version
Connecting with IP instead of localhost
I probably forgot something, I've been working on and off on this for a while now. Any and all suggestions welcome. Thanks!
I managed to resolve this by changing the bindings of the local server I was trying to connect to with the client.
My server is using .NET and IIS Express for development, so I modified the applicationhost.config file from
<binding protocol="http" bindingInformation="*:9000:localhost" />
to
<binding protocol="http" bindingInformation=":9000:" />
as per Binding IIS Express to an IP Address. This allows me to connect to the server using 127.0.0.1:9000 or my machine's IP instead of just localhost:9000.
I then modified my port forwarding in chrome://inspect to MYLOCALIP:9000 instead of localhost:9000 and configured the app to make requests to 127.0.0.1:9000 instead of localhost:9000.
Try opening the connection on whitelist configuration with <access origin='*' allows-arbitrary-loads-for-media='true' allows-arbitrary-loads-in-web-content='true' allows-local-networking='true' /> in config.xml
I am trying to integrate npm's application insights module (https://www.npmjs.com/package/applicationinsights) into my React js application.
My source for doing this is:
import appInsights from 'applicationinsights';
appInsights.setup(applicationInsightsKey).start();
The problem I got is that in my Chrome Developer tools I can see a preflight request made to https://dc.services.visualstudio.com/v2/track.
But in the console I can see the following error:
"Fetch API cannot load https://dc.services.visualstudio.com/v2/track.
Request header field content-encoding is not allowed by
Access-Control-Allow-Headers in preflight response."
Do you have an idea how can I fix this issue?
The node.js module you are using is the AI SDK for Node.js server. And As the React js applications are client applications in javascript, technically they are different.
Please try to use ApplicationInsights-JS.
Additionally, you can refer to https://azure.microsoft.com/en-us/documentation/articles/app-insights-web-track-usage/ for more info.