Unable to perform a Cross domain ajax call. - JQuery - javascript

I have checked many post and tried every logic that were mentioned in various blogs and posts. But I am unable to perform a cross domain ajax call to an IIS server. Please anybody advice what else I should look into or configure it to get working. All your help is greatly appreciated.
Here is my ajax call:
var url = "http://mydomain .com/myauthorizeservice";
var jsonParam = JSON.stringify({ username: 'user007', password: 'pass007' });
$.ajax({
type: "POST",
url: url,
crossDomain: true,
data: jsonParam,
success: fnSuccess,
error: fnError,
dataType: "json",
contentType: "application/json"
});
function fnSuccess() {
alert("Success");
}
function fnError() {
alert("Error");
}
My config in the root web.config:-
Error:-
Access Denied.

I really struggled a lot to make this thing work. Here some points that also matters and restrict the cross domain calls-
Note: I am using WCF REST service. and configurations are for IIS 7.5.
1: Make sure your OPTIONSVerbHandler looks like-
2: Make sure you have the correct ordering in HandlerMappings-
Rest settings and the way to perform ajax call is mentioned in the question.
Happy coding!

Related

Sending ajax request by jquery doesn't working

I'm trying to send ajax request to api. My code is
$(".doit").click(function(){
console.log("GG");
$.ajax({
type: 'POST',
url: "localhost:8000/api/get-user/1",
data: {id:1},
success: function(res) {
console.log(res);
}
});
})
It's just a simple code. Everyone know. But it works in "console.log("GG"). Not working in ajax part.
I monitored the network traffic by firefox, but I ddin't see any network traffic.
Do you have any idea about that case?
Update your ajax URL as below
url: "http://localhost:8000/api/get-user/1",
or
url: "api/get-user/1",
Hope this will fix your issue
This is because you are specifying the port number, and also not including the scheme.
Simply removing your domain should be enough:
$(".doit").click(function(){
console.log("GG");
$.ajax({
type: 'POST',
url: "/api/get-user/1",
data: {id:1},
success: function(res) {
console.log(res);
}
});
})
The problem is that you do not specify the URL scheme. So, instead of localhost:8000/api/get-user/1 you should use //localhost:8000/api/get-user/1, or better specify just the relative path /api/get-user/1.
I think because your url in the same url as you want to make request and that didn't make you will see the network traffic. just using the different url will show the request ajax from the network traffic.
just try to change your url to this: https://jsonplaceholder.typicode.com/posts
and read about this further information: https://github.com/typicode/jsonplaceholder#how-to

Facebook count using ajax

I have a problem with getting number of shares of my custom url. Im trying this code:
$.ajax({
type: "POST",
url: "http://graph.facebook.com/https://www.myurl.com/somelink/?callback=?",
processData: true,
contentType: 'application/json',
success: function(r){
var fbjson = JSON.stringify(r);
console.log(fbjson);
}
});
I've tried also:
$.getJSON('http://graph.facebook.com/https://www.myurl.com/somelink/?cal‌​lback=?'), function (data) {
fbjson = JSON.stringify(fbjson);
console.log(fbjson);
};
When I paste url into browser I recieving JSON with all needed information, but when I am using $.ajax etc. I am recieving totaly different json or some error that I should use XMLHttpRequest or some other serwer status information. Important knowladge may be that I am using https://.
Anyone know how to correctly get FB share count for custom URL ?
PS Be understanding for me, this are my first steps in JS, thanks :)
For the json might be cooke issue. your browser have cookie for that URL but in ajax you need to pass that cookie !
Why you are counting share count manually ?
There is lots of share tools is available for fee !
example : http://js-socials.com/
I think this plugin will give you what you need !
Thanks
I've solve it. This script work correctly ;)
(function fbcount() {
var token = 'token here',
url = 'url here';
$.ajax({
url: 'https://graph.facebook.com/v2.7/',
dataType: 'jsonp',
type: 'GET',
data: {access_token: token, id: url},
success: function(data){
$('.facebook-scount').append(data.share.share_count);
},
error: function(data){
}
});
})();
Thanks!

Ajax Post request example

I was wondering if anyone could help me with a simple ajax request example just so I can wrap my head around the whole idea. I tried testing an ajax request to search the word "rails" on github. So my code looks something like this:
$.ajax({
url: 'www.github.com',
type: 'post',
contentType: 'application/x-www-form-urlencoded',
data: {
q: 'rails'
},
success: function(data) {
console.log(data);
}
});
This request is responding with a 404 response. So, I'm just curious how are you supposed to know what the key names for the "data" element should be? When I inspected the search bar on github, it told me the name of the element was q. Hence why I used the key "q" and I wanted to search for say "rails". If anyone could help me with this example or perhaps provide a better one that would be greatly appreciated. Thanks!
Try to add http in your url, but, for security reason you can't do Ajax Crossdomain request without autorisation of the github.com domain in your case.
http://api.jquery.com/jquery.ajax/

Getting 400 Bad Request when making JSONP request to Yahoo Finance API

I want to have an input field that would suggest stock tickers as the user types in letters, like you'd see on Yahoo or Google Finance. I can't just use JSON unless I enable CORS, in which case it works. Here's code that I cobbled together from various questions I found on Stack Overflow (here and here) while researching the problem I'm facing.
$("input#stocklookup").autocomplete({
source: function(request, response){
$.ajax({
url: 'http://d.yimg.com/autoc.finance.yahoo.com/autoc?query='+request.term+'&region=US&lang=en-US',
dataType: 'jsonp',
jsonpCallback: 'YAHOO.util.ScriptNodeDataSource.callbacks'
});
YAHOO = {
util: {
ScriptNodeDataSource: {
callbacks: function(data) {
console.log(data);
}
}
}
};
}
})
Searching for 'a', I will get a 400 error and the URL is listed as
http://d.yimg.com/autoc.finance.yahoo.com/autoc?query=a&region=US&lang=en-US&callback=YAHOO.util.ScriptNodeDataSource.callbacks&_=1462660878200
I think the extra numbers at the end are what may be causing the 400, but I don't know why it's being appended to the URL. If you navigate to the URL above, the results show properly in your browser.
I also tried using this block of code after seeing this page in the learn jQuery docs, but I also get a 400 error using this.
.$ajax({
url: 'http://d.yimg.com/autoc.finance.yahoo.com/autoc?region=US&lang=en-US',
jsonp: 'callback',
dataType: 'jsonp',
data: {
q: request.term,
format: 'json'
},
success: function(response){
console.log(response);
}
})
Any help to get me in the right direction would be appreciated. Thanks.
Update
$.ajax({
url: 'http://d.yimg.com/autoc.finance.yahoo.com/autoc?query='+request.term+'&region=US&lang=en-US',
cache: true, //<--new
dataType: 'jsonp',
jsonpCallback: 'YAHOO.util.ScriptNodeDataSource.callbacks'
});
YAHOO = {
util: {
ScriptNodeDataSource: {
callbacks: function(data) {
console.log(data);
}
}
}
};
This works for some requests but not others, some still return a 400 status.
I fixed it!
Added this in to my HTML file.
<meta charset="UTF-8" name="referrer" content="no-referrer">
Just a heads up - I have a couple of projects (Java and JavaScript) which call this API. They usually work but occasionally fail with a 400 without any change to the code - then work a few hours/days later, again, without changing the code. I think if there is some problem with the server it may return this rather than a correct error in the 500 range (server error - It's me, not you)
Errors in the 400 range should be a message from the server along the lines of "it's you, not me - fix your request before you send it again" but I don't think this is the case with this API.
For example - one of my requests which worked, didn't work, did work and then didn't is:
http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20yahoo.finance.xchange%20where%20pair%20=%20%22USDGBP%22&env=store://datatables.org/alltableswithkeys
in a browser I get the same 400 error but the following XML....
<error xmlns:yahoo="http://www.yahooapis.com/v1/base.rng" yahoo:lang="en-US">
<description>
No definition found for Table yahoo.finance.xchange
</description>
</error>
In short - it may be them not you!

Jquery unable to get the response from WCF REST service

I have developed WCF rest service and deployed it on a link that can be accessed via the browser because its action is "GET".
I want to get that data using jQuery. I tried my best to get WCf get response using jQuery
but in vain. I also tried $.Ajax with 'jsonp' with no luck. Can any one help me?
The url is: http://www.lonestarus.com/AndroidApp/AndroidLocation.svc/RestService/getLatestLocation
You can check that url response by pasting url in browser.
You need to set Access-Control-Allow-Origin to value [*] in your response header.
this blog gives the more details how it can be done in WCF REST service
if you were to do this in Web API you could have just added
Response.Headers.Add("Access-Control-Allow-Origin", "*")
calling the service using a fiddle
$(function() {
$.ajax({
url: "http://www.lonestarus.com/AndroidApp/AndroidLocation.svc/RestService/getLatestLocation",
datatype: 'json',
type : 'get',
success: function(data) {
debugger;
var obj = data;
}
});
})​;​
I got the error
XMLHttpRequest cannot load
http://www.lonestarus.com/AndroidApp/AndroidLocation.svc/RestService/getLatestLocation.
Origin http://fiddle.jshell.net is not allowed by
Access-Control-Allow-Origin.
I can't make a cross domain example to show you but
$('#a').load('http://www.lonestarus.com/AndroidApp/AndroidLocation.svc/RestService/getLatestLocation​​​​​​​​​​​​​​​​​?callback=run');​
would work had those things been set.
Your service needs to either enable JSONP callbacks or set the Access-Control-Allow-Origin header for cross domain requests to work, or you need to run the script from the same domain. Given that your url says AndroidApp I'm thinking you want cross domain.
Sample code below:
$.ajax
(
{
type: 'GET',
url: http://www.lonestarus.com/AndroidApp/AndroidLocation.svc/RestService/getLatestLocation,
cache: false,
async: true,
dataType: 'json',
success: function (response, type, xhr)
{
window.alert(response);
},
error: function (xhr)
{
window.alert('error: ' + xhr.statusText);
}
}
);

Categories