Accessing google api's with Sencha 2 - extjs

I want to access google places api with Sencha 2. I am using Ajax but I am getting cross origin request error (Testing in Chrome browser).
I cannot use jsonp as google api does not support response with callback parameter.
Does Sencha 2 provide any API to achieve this or do I have to route the response of api through my server?
Thanks

Found Google provides JS library to access the same places API.
http://code.google.com/apis/maps/documentation/javascript/places.html
It works perfectly now without the need to have ajax calls.
Thanks

Related

Why I can request to a API with Postman but not working in React JS?

I can request to a API very easily in Postman. But when I try it with React JS and on localhost:3000, it throws me an error:
Please tell me why?! Thanks
See https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS/
If you know CORS problems, it would be easier to explain.
Because the requests sent by Postman or ones by your React.JS are kind of different.
As you send requests with Postman directly, the requests are considered sent by as "a person", like you enter the URLs of your APIs in your browser.
It's different with sending requests with React because React is a front-end JavaScript based framework language "executed" by your browser.
Imaging if you happen to access a malicious web-site, and the site sends intended codes of React(or some JavaScript) to manipulate your browser(An easy example: If there are no limits, it can use your browser as a web crawler to other sites).
You know that every time you open a site, your browser is executing lots of codes from the site.
So you may have to understand why we need CORS policy, and how CORS works to develop your APIs.

How to access the Google Maps Directions API client-side from a library

I'd like to send requests against the Google Directions API. Google provides a Node.JS client library for the API. However, this AP is server-side only. Attempting to use it from a browser script results in a CORS failure. Multiple past answers (such as this one) indicate that this library simply can't be used in this way.
The alternative is to use the client-side JavaScript API. However, this requires adding a <script> tag to the document root. That's the wrong level of abstraction for my needs. I'd like to use a method from a library or dot-js file instead.
Following the advice given here, I'd like to ask: is there a module available through npm I can use to query the Google Directions API client-side?
It's not naively possible to access the Google Maps Directions API from the client side. Web browsers implement the Single-Origin Policy, which requires that any requests to a domain come from the same domain. Requires between domains are disallowed by default. Cross-domain requests can be enabled at the server lever by setting the right CORS headers on the endpoint, but the Google Maps servers choose not to do this.
There are two ways of working around this. One is to wrap the request using the Google API Auth library. However, I could not get this to work.
What did work was using a reverse proxy. This workaround is actually mentioned in the Google Directions API intro page (albeit obliquely). You will need to set up a server which forwards any requests to an API request, then returns that API request to the original requester. Since this is now a server-side request, SOP will not apply, and you will be good to go.
For an example implementation check out this repository on GitHub.
https://developers.google.com/maps/documentation/directions
This is the Directions API web service. It does not require adding a <script> tag.
You can make direct requests to the service as per the example:
https://maps.googleapis.com/maps/api/directions/json?origin=75+9th+Ave+New+York,+NY&destination=MetLife+Stadium+1+MetLife+Stadium+Dr+East+Rutherford,+NJ+07073&key=YOUR_API_KEY
once you have generated an API key and replaced YOUR_API_KEY in the request with your own key.

Angular2 vs Rails Api vs Facebook Auth

I am using a rails api with devise gem to login to facebook. When i use a link from an html under the rails app directly to login. It works perfectly.
Now if i try to move to a client with angular2 and call the same route in the rails app. The problem occur in the redirect to facebook. I can hit the route cause i have already setuped "cors rack gem" but when behind the scene "devise gem" call the facebook api the origin for this call is null. I didn't find a way to get it work after 3h searching.
anyone setuped angular (1 or 2) with rails api and devise/omniauth?
the rails api and the angular app are under different domain
I endup using this gem for token based auth.
https://github.com/lynndylanhurley/devise_token_auth
I have removed devise totally from my gem file and i am using only "devise_token_auth" now.
You need to use a frontend library as for angular1
https://github.com/lynndylanhurley/ng-token-auth to call the api.
In my case i just used the demo from ng-token-auth, i extract the parameters from the call to register and used this parameters in a normal ajax call in my angular2 app => i was able to create a user.
normally devise_token_auth handle facebook proprely for ajax call (didn't try it yet)

Disable API discovery for API Explorer

I'm new to App Engine and am trying to figure out how to disable the API Explorer from showing all my APIs, which are currently public and available to anyone visiting [MYPROJECT].appspot.com/_ah/api/explorer
Supposedly Snapchat uses AppEngine, however visiting https://apis-explorer.appspot.com/apis-explorer/?base=https://feelinsonice.appspot.com/_ah/api#p/ does not reveal their APIs.
Viewing network activity for that page you'll see that requests are being made to https://feelinsonice.appspot.com/_ah/api/discovery/v1/apis but returning a 404.
How do I do the same?
When visiting the API Explorer using my project ID I see this:
Is this the culprit?
Endpoints is the 'culprit'. I'm assuming you are using endpoints since you've included that tag, and I guess snapchat doesn't use endpoints.
There is nothing you can do to change this other then stop using endpoints.

Accessing Google Calendar API from AngularJS APP

I am implementing (I am trying to implement) a 100% client side AngularJS web app which should access the google calendar API. Of course, this doesn't work because I hit the cross domain problem:
XMLHttpRequest cannot load http://... . Origin http://localhost:9000 is not allowed by Access-Control-Allow-Origin.
Is there any solution to bypass this issue, except creating a proxy? By setting some header or changing some google configuration? I don't see one ...
Great hint Philipp! The google javascript api client (see here) does the job.
But I am wondering: How does the google javascript api client bypasses the cross domain issue? Does someone know?
You need googles side to return the right headers, Access-Control-Allow-Origin, to your browser so it doesnt complain about the cross browser issue.
Make sure in the google cloud console is configured correctly to web application. Im assuming web app because the redirect though.
If its a phoneapp or not serving anything on localhost:9000 redirect endpoint there are other options. For example you could open up the oauth redirect in another window, still use localhost:9000 as the redirect. Even though you are not listening at that port you could still grab the url code or error that is set on the redirect from the parent window.
CORS is an issue that you will experience when running the app through web browsers. I suggest you download a CORS toggle extension on google chrome so you can toggle off CORS and the API will connect. Good luck!

Resources