Develop Reference

Can you use a POST to GET data?

A company is asking me to do an Angular assignment. They provide the following instructions, but the API URL doesn't work:
Create a single page angular application and use the following API to retrieve sports results and sort into a table of results that are displayed. Each sport result contains several data and always includes the publication time.
Method: POST
Content-Type: application/json
Url: https://ancient-wood-1161.getsandbox.com:443/results
Tasks:
-Display the sports results in reverse chronological order on the page.
-Add a filter to the page to display only certain types or events (e.g. f1Results)
-How can you confirm the code works?
-Bonus: Implement the rest call asynchronously
You can click the URL https://ancient-wood-1161.getsandbox.com:443/results right now and see that it doesn't work - it returns {"errors":[{"message":"Error processing request"}]} and in Angular it gives me a standard CORS error.
I asked the company to please send a working URL and/or update the API to accept requests from everywhere. Their response was:
*guy's name* confirmed it worked. It is a post and the content type is json.
Can you use a POST request to GET data?

Absolutely. Take for example your avg Login Request that returns an access token for instance. It is going to be a POST as POST also has a bit more security than GET given that the payload is in the body rather than the URL string.
As for their excuse of it not working, try it in postman and see if the same issue still occurs. If it still does then ask them where did they test their API as if it is on prem then no duh the CORS would work. It is most likely not a company you would want to work for.

Yes, you can. On some cases it may be necessary, since GET doesn't take a body while POST does. So it can get you around things like URL length limits.

Reflect and make Axios request in the browser's URL

What I'm looking for
Bit of JavaScript logic help; although, I am not sure what I will need to do via Vue Router. Not looking exactly for the answer, but more pointed in the right direction (I'm not even sure I'm phrasing this question correctly).
Problem
I have been making API requests with Axios (no problem there). I have a JWT token in the requests’ headers. However, (never done this before) I now need to have the search params the user entered in the browser’s URL when they make a request to share the link to their coworkers which will route to the same page with the same options entered/selected and the API request called with those query params.
What I really don’t know is:
A. What’s the best way to make an API request on route (loading the url with query params)? The route of the page does NOT match the corresponding API endpoint Url.
B. How do I get the users’ entered/selected data into the browser’s URL?
C. Do I need to modify my route objects for those pages to still route correctly even if there is now a query string?
Solution
(Must be purely a frontend solution - I’m using the whole vue ecosystem)

Figured out what I need to do:
A
The project is not server-side rendered; therefore, I need to parse the URL on Vue's created and make a request with the params in the query string. This will seem like the URL caused a API request.
B
Simply append Axios' request query string to the URL, which I believe is cosmetic and should be fine.
C
I'm not sure, but will play around with it.

Ajax query for JSON data not returning data

I'm trying to use World Bank's API to obtain some data. This is how to query their database. Basically to query a country's information, I would need to go to this url:
http://api.worldbank.org/countries/"alpha2Code of the country"
In my code here (Link to CodePen code.) I use use the alpha2Code from a previous query to add to the World Bank query's URL. Here's the method:
getDetails(alpha2Code) {
this.load('http://api.worldbank.org/countries/'+alpha2Code)
.then((countryDetails) => {
this.generateOverlay(countryDetails);
});
},
the load() method is defined here:
load(url, type = 'json') {
return $.ajax({
dataType: type,
url: url,
});
},
According to World Bank's basic calling format, I would need to add
format=json
in order to receive response in JSON. Somehow I don't think it's actually obtaining anything from WorldBank.
The query to World Bank is suppose to give me details to put into the overlay that covers the country flags after a click.
Thank you in advance for the help!

One issue with the CodePen you shared that may or may not be the problem with your site is that the CodePen demo is loaded over HTTPS, but you're requesting an insecure resource (HTTP). Browsers don't like this and will usually block it.
Unfortunately, you can't just change the request to be HTTPS since the WorldBank API doesn't have its certificates sorted out, so those requests are blocked by the browser as well. One solution would be to load your site over HTTP; however, this is obviously not advisable if your page contains any user-sensitive information.
The better way is to use your own back-end server as a proxy. You can setup your own API on your server that queries the WorldBank API over HTTP and can then respond to your request over HTTPS. Of course, this assumes you have control over your backend which is not always the case.

You need to pass the desired result format in the query. For example, to query INDIA, you would need to change the url to :
http://api.worldbank.org/countries/IN?format=json
The resulting data received is like:
[{"page":1,"pages":1,"per_page":"50","total":1},[{"id":"IND","iso2Code":"IN","name":"India","region":{"id":"SAS","value":"South Asia"},"adminregion":{"id":"SAS","value":"South Asia"},"incomeLevel":{"id":"LMC","value":"Lower middle income"},"lendingType":{"id":"IBD","value":"IBRD"},"capitalCity":"New Delhi","longitude":"77.225","latitude":"28.6353"}]]
The default output is in XML format. Hence your code may not be working.

Query and process REST API using extjs

I have created a web application and deployed it in my tomcat. The API is a GET request and URL is: http://mymachine.home.net:8080/test.app-1.0/test/json which returns an output as:
{"details":[{"name":"tim","age":"13"},{"name":"jim","age":"15"}]}
I want to write a very simple extjs application that will call the URL and print the response (or write the response to a file). Can someone help me with this? I tried the examples mentioned at many places, but my URL is never hit from the extjs application.
Thanks in advance

This was resolved. A few things that I added / changed were:
I included ext-all.js in the index.html page.
The response returned from the web application was changed as:
someCallback({"summary":[{"hits":9118,"avg":13,"min":1,"max":1448,"errors":0,"date":"This period"},{"hits":1,"avg":1,"min":1,"max":1,"errors":0,"date":"Average"}]});
The callback name (someCallback) is sent as query parameter to the web application. The URI was changed to http://mymachine.home.net:8080/test.app-1.0/test/json?callback=someCallback
The response has to be wrapped around a string like ‘someCallback(…)’, else the Extjs code will not be able to parse it.

Send data to server

I am developing an app for the iphone.The thing is that i want to send the values of longitude and latitude i get from the phone using javascript to a server commanding it to search for something.Do i have to read about cross domain stuff? How could this be done?
I know that i can use Ajax but it can serve me if i refer to the same domain.
For example how can i do this:
$.post('http://127.0.0.1:8000/search/',{lon:30}) and have my database searched for objects that have this longitude?
I don't want to do this:
$.post('/search/',{lon:30})
I use django on the server side.

There is something called JSONP that is meant to solve this problem. You can read about it here. Its basically regular json with a callback function.

Also have a look at the below link:
http://groups.google.com/group/prototype-scriptaculous/browse_thread/thread/3f93834df24114b9/9c6596da9bedd4b2?q=#9c6596da9bedd4b2

JSONP or "serverside AJAX proxy" are your two options if the target server is in a different domain than your application.