jQuery ajax is making connection, but the response is blank? - javascript

i'm trying to make a test with ajax response using an external array as a config file...
But it isn't working, i'm getting always a blank response...
Can anyone point me the reason?
Here is the link of jsBin test: http://jsbin.com/udanu/2/edit

It looks like you have bumped into the Same Origin Policy. You cannot make Ajax requests to hosts outside your domain, unless you use JSONP, or some other technique to get around the policy.
You may want to check out the following Stack Overflow post for a few popular solutions to work around the SOP (mainly the JSONP, CORS and Reverse Proxy methods):
Ways to circumvent the same-origin policy

As you are trying to get data from another domain, maybe you should try using "jsonp" instead of "text" as a dataType.
EDIT: didn't see the previous answer.

Related

modify getJSON to work with CORS

I am looking for ways to allow cross-domain access using $.getJSON. I came across solutions which suggest that using CORS is the solution to this problem. But most of the solutions have a general ajax format.
I cannot use JSONP since I get data from a server which I do not have access. Is there a way to modify this code using $.getJSON to get the data?
$.getJSON(jsonURL, function(res){
console.log(JSON.stringify(res));
});
Or do I have to use ajax format for CORS?
Server which I do not have access
I think, this will break your neck.
You need some kind of access to the server or contact someone who has. At least you have to adjust the HTTP-Header to enter your domain Access-Control-Allow-Origin is the keyword.
Have a look at MDN
If you have access to set the HTTP Response Headers for the page that loads your JS scripts, then YES you can use CORS to send cross-domain requests. However, this is not supported in older browsers.
You need to set the Access-Control-Allow-Origin header, e.g.
Access-Control-Allow-Origin: *
Or
Access-Control-Allow-Origin: http://host-of-other-site.com
https://developer.mozilla.org/en-US/docs/HTTP/Access_control_CORS

Getting the request origin in a Django request

So I'm trying to enable cross origin resource sharing in Django, so I can post to an external site, and it's easy to do when I set
response["Access-Control-Allow-Origin"]="*"
but I want to instead have it check whether the origin is in an allowed list of origins (essentially to restrict it to only allow specific sites) but I can't seem to find anywhere in the Django request where I can get the origin information.
I tried using request.META['HTTP_HOST'] but that just returns the site that's being posted to. Does anyone know where in the Request object I can get the origin of the request?
As for getting the url from request (which is what I was looking for), use request.META['HTTP_REFERER'] instead.
In Django,
request.headers['Origin']
answers the original question.
You can print(request.headers) to see everything available in the headers.
Use this:
origin = request.META.get("HTTP_ORIGIN")
This is the way django-cors-headers use it in the middleware:
you can get it by request.META["HTTP_ORIGIN"]
I strongly advice you to use django-cors-headers. It lets you to define CORS_ORIGIN_WHITELIST which is a list of allowed origins in more pythonic way.
To answer the question "Does anyone know where in the Request object I can get the origin of the request?", would the request.META['REMOTE_ADDR'] give you what you need?
In Django 2.2 use:
request.META.get('HTTP_REFERER')
Make sure that the request property doesn't have mode = no-cors
see:
https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Origin
"There are some exceptions to the above rules; for example, if a cross-origin GET or HEAD request is made in no-cors mode, the Origin header will not be added."

Access-Control-Allow-Origin headers in GAS

I am sending an (HTTP GET) $.ajax request (from jsfiddle) to my Google Apps Script server and I get the following error:
XMLHttpRequest cannot load https://script.google.com/macros/s/mykey?params.
Origin http://fiddle.jshell.net is not allowed by Access-Control-Allow-Origin.
What is the best way to solve this problem?
I have successfully implemented jsonp $.ajax requests to retrieve json data and javascript using this GAS/jsfiddle configuration. However, I seem unable to accomplish this jsonp success this time. Possibly because I am going through an .updaterow() function (per jqWidgets?)
My research:
This post almost asks a similar question except it is not specific to GAS.
I do not think GAS allows one to set server-side response headers. But surely there must be a way to get my request to execute?
Perhaps this question explains it better? (GAS issue) Is there a workaround solution? (Come on creative people.)
GAS does not allow CORS headers at this time.

changing the referrer of an Ajax POST

Anyone knows if with jquery or general javascript, I can change the referrer from the header in an http ajax call?
basically I want it to be sent from my page but have a referrer from another page. Any information would be great.
The browser will overwrite the referrer always for the tests that I've done. Meaning you can't change the referrer of an ajax call.
You can use .setRequestHeader( 'referer', 'foo' ), but I'm not sure if the browser would just replace that with the proper one or not.
via jQuery, the .ajax() method allows headers as well (.get() and .post() don't)
Note that there's very little point to doing this as you can't do cross-domain AJAX and even attempting to do this could possibly trigger XHR security rules in some browsers and just stop the request altogether.
You can always use this :
jQuery.ajaxSetup({
'beforeSend': function(xhr) {xhr.setRequestHeader("header key", "header value")}
})
But ofcourse, the browser can have a different opinion about the referer header.
This should be tested :)
You can't do that with jQuery, but you CAN do that with fetch
Not sure if it would work for cross domain requests (you will obviously need at least CORS permissions for that) but it definitely does work for same domain + different page like in this example
fetch("http://example.com",{"referrer":"http://example.com/inbox","body":"{\"format\":\"root\"}","method":"POST"});

How to get cross-domain data using Javascript in django?

Imagine, that you have two domains and you want them to interact through a Javascript mechanism.
So, what I've done so far is host two servers on different ports on my local machine. It seems that the request is being sent from one server to another, only it doesn't seem to return any data.
What do you think the problem is ? How can I solve it ?
P.S. Code examples would be greatly appreciated. Thank you.
I don't know about django, but the other domain must support CORS (see Wikipedia and the w3 spec).
Basically, the remote server must support the Access-Control-Allow-Origin header. Usually I just have my server set the header value to * to allow all origins to access data.
You might need to find more specific documentation for your particular webserver. You might also want to watch the conversation between servers using wireshark. It's a great little utility for finding out what's really happening with your HTTP requests/responses...
You need to add an extra header to host 2 to allow host 1. This site will help you http://enable-cors.org/
JSONP is about to solve cross domain issues:
http://en.wikipedia.org/wiki/JSONP
jQuery has good functionality to support JSONP,
(just some googled link of this topic)
http://sangers.nu/blog/tech/20090129-jsonp-with-jquery
EDIT:
JSONP could look a little weird than at first sight :) basically should support JSONP notation (call callback method, if it is provided). So, it checks if 'callback' method is provided and instead of returning results like
{ some: 12 }
It does,
callback( { some: 12 } )
Here is my blog post on that:
http://www.beletsky.net/2010/07/json-jsonp-and-same-origin-policy-issue.html
jsonp is your option infact I used a django snippet available here
http://djangosnippets.org/snippets/2208/

Categories

Resources