I am creating an extension for Google Chrome and I'm having trouble authenticating with Twitter.
This extension is published in this link:
As you can see, I am also consuming Dropbox API (which also works with OAuth 1.0) and it works perfectly!
To work with OAuth use a library called jsOAuth available at this link.
When the user clicks on the "Twitter", a window (popup) appears to be made authentic:
//Request Windows token
chrome.windows.create({url: url, type:"popup"}, function(win){
chrome.tabs.executeScript(win.tabs[0].id, { file: "/scripts/jquery-1.7.1.min.js" }, function() {
chrome.tabs.executeScript(win.tabs[0].id, { file: "/scripts/querystring-0.9.0-min.js" }, function() {
chrome.tabs.executeScript(this.args[0], { file: "/scripts/services/TwitterPage.js" });
});
});
});
url = _https://api.twitter.com/oauth/authorize?oauth_token=XXX&oauth_token_secret=YYY&oauth_callback_confirmed=true_
TwitterPage.js code
$(document).ready(function() {
$("#allow").click(function(){
var token = $.QueryString("oauth_token");
var secret = $.QueryString("oauth_token_secret");
var data = { oauth_token: token, oauth_secret: secret };
chrome.extension.sendRequest(data);
});
});
Then the authentication window is displayed
Full link: https://i.stack.imgur.com/e2s7D.png
As you can see in the above code, a request is sent to my extension. Following is the code that captures this request:
chrome.extension.onRequest.addListener(function(request, sender, sendResponse) {
chrome.windows.remove(sender.tab.windowId, fetchAccessToken);
});
fetchAccessToken function:
fetchAccessToken = function() {
oauthObj.fetchAccessToken(function(){
console.log("This code is only executed when debug step by step")
}, failureHandler);
}
Looking at the console, the error: GET https://api.twitter.com/oauth/access_token 401 (Unauthorized)
is displayed
Full image: https://i.stack.imgur.com/8MgNw.png
Questions
What is wrong?
Step by step debugging, authentication is performed successfully!?! Why?