CODEWITHSUNDEEP
jqueryajaxcorscross-domain
Arbab Rasheed
Arbab Rasheed

Reputation: 493

jQuery ajax request being block because Cross-Origin

How to get content from remote url via ajax?

jQuery ajax request being block because Cross-Origin

Console Log

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://www.dailymotion.com/embed/video/x28j5hv. (Reason: CORS header 'Access-Control-Allow-Origin' missing).

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://www.dailymotion.com/embed/video/x28j5hv. (Reason: CORS request failed).

Code

$.ajax({
url: "http://www.dailymotion.com/embed/video/x28j5hv",
type:'GET',
contentType: "html",
crossDomain:true,
success: function(data){
   //$('#content').html($(data).html());
   var src = $(data).html();
    alert(src);
    return false;
}

Upvotes: 34

Views: 188735

Answers (6)

ashleedawg
ashleedawg

Reputation: 21619

If the source is a server you have access to, then you can open up cross-domain access for a specific folder (and it's sub-folders) with an .htaccess file located in appropriate folder:

<IfModule mod_headers.c>
  Header set Access-Control-Allow-Origin "*"
</IfModule>

Upvotes: 0

israfilgazi
israfilgazi

Reputation: 11

$.ajax({
            url: "https://api.dailymotion.com/video/x28j5hv?fields=title",
            type: "POST",
            dataType: "json",
            crossDomain: true,
            format: "json",
            success:function(json){
                console.log('message: ' + "success"+ JSON.stringify(json));                     
            },
            error:function(error){
                console.log('message Error' + JSON.stringify(error));
            }  
        });    
/* <?php header('Access-Control-Allow-Origin: *'); ?> */

Upvotes: 0

HaukurHaf
HaukurHaf

Reputation: 13796

There is nothing you can do on your end (client side). You can not enable crossDomain calls yourself, the source (dailymotion.com) needs to have CORS enabled for this to work.

The only thing you can really do is to create a server side proxy script which does this for you. Are you using any server side scripts in your project? PHP, Python, ASP.NET etc? If so, you could create a server side "proxy" script which makes the HTTP call to dailymotion and returns the response. Then you call that script from your Javascript code, since that server side script is on the same domain as your script code, CORS will not be a problem.

Upvotes: 18

Alexandru Popescu
Alexandru Popescu

Reputation: 67

I solved this by changing the file path in the browser:

  • Instead of: c/XAMPP/htdocs/myfile.html
  • I wrote: localhost/myfile.html

Upvotes: 0

Ram Chander
Ram Chander

Reputation: 1522

Try with cURL request for cross-domain.

If you are working through third party APIs or getting data through CROSS-DOMAIN, it is always recommended to use cURL script (server side) which is more secure.

I always prefer cURL script.

Upvotes: 2

Hassaan
Hassaan

Reputation: 7662

Try to use JSONP in your Ajax call. It will bypass the Same Origin Policy.

http://learn.jquery.com/ajax/working-with-jsonp/

Try example

$.ajax({
    url: "https://api.dailymotion.com/video/x28j5hv?fields=title",

    dataType: "jsonp",
    success: function( response ) {
        console.log( response ); // server response
    }

});

Upvotes: 53

Related Questions