Consume remote rest services in AngularJS app - javascript

I would like to consume two remote REST services (which I don´t have control over) from my AngularJS app.
Service 1: To authenticate myself by passing the credentials as form-data in the HTTP header using POST verb.
Service 2: To get the data in JSON format by using GET verb.
Using the $http or $ngResource leads to same error message in Chrome Developer console:
OPTIONS http://remote.service.com
net::ERR_EMPTY_RESPONSE
Example on $http GET
$http.get('http://remote.service.com').
success(function(data) {
$scope.greeting = data;
});
I believe this is because of XSS limitations in JavaScript? I have considered solutions like CORS (requires control over the remote service) and JSONP (only GET) but none of these will solve my problem so Im seeking tip on other solutions.
What I don´t fully understand is why calls to the very same services works fine when using REST Client Plug-in in Chrome (for instance POSTMAN) from my local machine.
Im running Express and NodeJS in the backend, if that might help.

In stead of calling the remote REST service directly from the frontend app (AngularJS app), call the backend service within same origin and from backend do the remote service call (as a proxy). This solves this issue.

Related

Cross-domain JSON request not returning data. (AngularJS)

I've been trying all day to get the JSON data from the following url: https://www.easports.com/iframe/fifa17proclubs/api/platforms/XBOXONE/clubs/2650219/membersComplete
I am very new to cross-domain calls, I tried to use JSONP, $get.JSON with no success. All I want is to store the data from that link into an Angular variable so I can use it on my app.
This is a browser security restriction (cross site script attack) and requires the server to add the following response in the header in order for your browser-based app to access the data
Access-Control-Allow-Origin: *
If you cannot get the server to change, then there's nothing you are going to be able to do. This restriction does not exist if you create a desktop app - it's just a browser security restriction.
More information here:
https://enable-cors.org/server.html

CORS Angular JS

I'm a beginner learning node and angular but running into many issues. I have Angular running on Node, and my code in Angular makes http requests to retrieve json from an API on another web server (this web server is something I add routes to and I'm not allowed to enable CORS on it). I'm getting 'CORS blocked' due to my http request although I know this resource is accessible. I understand that you have to enable CORS in the web server but in this case that is not an option. There is another web app (not running on the same origin as the resource) that is doing a similar thing to mine but instead he uses node to retrieve the json data and then I think he sends that to angular to process. Is this a possible work around?
Yes it is. If you can't enable cors headers on the server then the only thing you can do is access the server from your nodejs or any other type of server. If you eventually plan to run your angular in cordova you could make a direct $http request because cordova does not block corsable requests.

Accessing http headers in angularJS

We are having two applications. One is written running on salesforce (App A and other app (App B) is using angularJS for UI.
When a user performs a certain actions in App A, App B has to be opened in a new tab. In this case, certain parameters have to be passed to App B from App A.
As App A and App B are running in different domain we can't use cookies to share the data.
So we wanted to pass it as a http header. Is it possible to read the http header in angular JS?
Please note that this different from AngularJS - accessing http headers. That was related when we access a http from angular JS. But we want to read the http headers passed to our angularJS application.
How can we read the HTTP headers sent to an angular JS application?
Or is there any better approach to solve this issue?
You can access headers from $http or from $resource but depends on what you are trying to do. If passing the state/data then it might not be possible.
pass as query string in the App B URL and open in new window/tab. Login information might not persist in second domain if you are not using Auth2/Auth domain authorization method and not sending data using get method with request data when opening in new tab or window.
You need the assistance from server side, you don't have the access to page headers in JS, and it isn't Angular issue.
You can try cross-domain localStorage with this package. It also has Angular module bundled.

How to make a request to sails.js controller without using sails.io client helper methods

I'm developing an application using sails in which I have to connect from external sources. they can be IOS or android mobile applications or simply an external html client.
In that regard I cant't use sails helper methods to make web sockets request be handled by controller actions.
as I read through the sails.io client file i figured I could just use.
socket.emit('get' , {url:'/tomato' , data:{message:'pony'}} , function(response){});
to mimick the sails socket.get() function but it is not working.
sails log in terminal shows the following message : No session data returned, and an error was encountered saving session data for the first time: undefined.
Sorry you had to give up! This is a fairly common issue that comes up around communicating via sockets with a 3rd party. It actually has nothing to do with the Sails helper functions, and your usage of socket.emit to replicate the socket.get functionality is perfectly valid . Unfortunately the error message for this case is (clearly) broken in Sails v9, but the gist is: you need to get a cookie from the 3rd party domain before you connect the socket. This means making a JSONP request to that domain. Socket.io can actually do that for you, although you may have to set io.util.ua.hasCORS = false manually before calling io.connect. Or you can create a JSONP endpoint on the remote server and hit it yourself. Either way, once you have that third-party cookie in place, the socket handshake should work fine and allow perfect communication between your site and the Sails server.
Edit
The io.util.ua.hasCORS method is not valid, as it turns out--it will cause a JSONP request to be made to the remote server, but the response won't have a cookie attached so it's not going to get the job done. However, when the next version of Sails is released it will include a mechanism to request a cookie from the external domain, and will handle the connection automatically in the background within sails.io.js. Also note that you need to set authorization to false in the /config/sockets.js file in your Sails app in order to allow sockets to connect from remote domains.

Use JavaScript to call a SOAP web service that requires authentication

Can I call a SOAP web service from JavaScript? The SOAP web service in question is a member of the Exchange Web Services platform. I have found the Exchange Web Services OSX Widget but that uses Curl to do the actual SOAP call. So I am wondering if there is a limitation in the JavaScript abilities to interface with SOAP using authentication.
Javascript isn't very good at web services because of the same origin policy which means you're only allowed to request resources from the same domain as the page you call from.
You could work around this by setting up a proxy on your server to hand the request off to elsewhere. The problem with this is you'd have to build the SOAP message yourself as I very much doubt anyone has ever bothered to write a js SOAP library due to the afore mentioned limitations.
Instead, I would pick your favourite server side SOAP library and expose an interface to be called via AJAX.

Categories