403 Forbidden in Google Chrome (only) when I call twitter search with Jquery (ajax)

Question

I have this issue with Google Chrome (v26.0.1410.64m). When i call Twitter search with jquery, i get the following error:

GET https://search.twitter.com/search.json?q=youtube&rpp=5&result_type=recent&callback=jQuery19101530768966767937_1365645647773&_=1365645647774 403 (Forbidden)

This is the code i used :

$.ajax({
   type: "GET",
   url: "https://search.twitter.com/search.json?q=youtube&rpp=5&result_type=recent",
   contentType: "application/json",
   dataType: "jsonp",
   success: function(data) {
       console.log(data);
   }
});

On Firefox, Internet Explorer, Safari and Opera this is working. But in Chrome i have this forbidden error. I try to add in my .htaccess the following code for the cross-origin :

Header set Access-Control-Allow-Origin: *
Header set Access-Control-Allow-Credentials: true

Nothing has changed. Where i'm wrong? If this help, I'm working in dev environment with virtual domain (en.domain.com.local, fr.domain.com.local, etc...) on Windows/Apache.

Thank you for your help. Sorry for my English.

Answer 1

All right I founded what's wrong. When i've replace https to http, Google Chrome has accepted the query. I guess it was a security issue. For now, my website is not working with https protocol. Thanks !

EDIT : Hum... false positive. It's worked once. But when i refresh the page, the forbidden error has return.

EDIT 2 : Wow... In fact, the script worked fine when the developper console of Google Chrome is closed... I have the same result with the fiddle made by Perception

Answer 2

I've recently ran into this problem, but I was able to find a hack/workaround.

What I found to work was introducing an arbitrary timeout of about 100ms. I used 150ms just to be really sure that the hack will work.

function latestTweet(screenName) {
  var deferred = new $.Deferred();

  // Introduce a timeout before we make a search request to Twitter.
  // This is added in the event that this function is called when
  // the page is ready and your user is using Chrome. When in Chrome
  // and a search request is sent to Twitter it will always return a 403.
  setTimeout(function () {
    $.ajax({
      url: "//search.twitter.com/search.json?q=from%3A"+screenName,
      type: 'GET',
      dataType: 'jsonp',
      success: function(data) {
        if (data && data.results) {
          data = data.results;
          if (typeof data.length === 'number') {
            deferred.resolve(data[0]);
          } else {
            deferred.reject();
          }
        }
      }
    });
  }, 150); // This works with 100ms, but pad just to be sure.

  return deferred.promise();
}

// Somewhere in my code ...
latestTweet('someScreenName').done(displayTweet);

Now in Chrome you shouldn't get a 403 Forbidden response and in all other browsers it will continue to work.