CODEWITHSUNDEEP
javascriptajaxtwitter
amylynn83
amylynn83

Reputation: 187

400 Error on AJAX Call to Twitter

I'm working on a web page that lets you search for twitter users in your area. You enter a name in the search box and it returns users with that name within 50 miles of the city (the city is always the same).

I was having trouble authenticating, and I found oauth.io. I used that to authenticate and it seems to be working. But when I do a search, my request to Twitter returns as a 400 bad request error. I'm not sure what I'm doing wrong. I've looked at the oauth.io documentation but couldn't find anything.

Here is the part of the code that gets the value of what the user entered into the form field:

// Click function
  $('.user-getter').submit(function(event) {
      // prevent form refresh
      event.preventDefault();
      // zero out results if previous search has run
      $('.user-results').html('');
      // Get the values of what the person entered in search
      var query = $(this).find("input[name='user_search']").val();
      // Run function to send API request to Twitter
      getUser(query);
  }); // end click function

Here is the part of the code that calls the authorization and then sends the ajax request:

var getUser = function(query) {

  OAuth.initialize('oMQua1CuWerqGKRwqVkzDx5uijo')
  OAuth.popup('twitter').done(function(twitterData) {

    $.ajax({
      type: "GET",
      url: "https://api.twitter.com/1.1/users/search.json?&geocode=42.94003620000001,-78.8677924,50mi&q=" + query,
      dataType: "jsonp"
    });

    console.log( "Data Saved: " + twitterData ); // can see in inspector tab under Network

  }); // end oAuth popup
};

Right now, I just want to see the result in console.log.

Upvotes: 4

Views: 246

Answers (1)

Thibaud Arnault
Thibaud Arnault

Reputation: 1435

To make a request to Twitter API using OAuth.io you have to use the OAuth.io Javascript SDK instead of directly $.ajax (the OAuth.io Javascript SDK use the syntaxe of $.ajax behind the scene)

OAuth.initialize('oMQua1CuWerqGKRwqVkzDx5uijo')
OAuth.popup('twitter').done(function(twitterData) {
    twitterData.get('/1.1/users/search.json', {
         data: {
             q: query
         }
    }).done(function(search) {
         //result of the search here
         console.log(search);
    }).fail(function(error) {
         //error management here
    });
})

The SDK does all the hard things for you transparently: proxy the HTTP request, inject all the needed OAuth credentials (oauth_token, oauth_token_secret, signature, nonce, timestamp etc..)

Take a look to this jsfiddles: http://jsfiddle.net/uz76E/10/

I hope that helps,

Upvotes: 5

Related Questions