Well, it's definitely possible with JavaScript and even as a Web
Application, but only in one of these cases :
* User marks the web application as trusted, to avoid cross-domain
restrictions
* Twitter implements Mozilla's cross-domain XHR method
* From a file:// location or another location that has full scripting
access
The most common way of doing this is sending all requests via a
server-side proxy.
Also, I *must* point out that your current approach, with OAuth keys
plaintext in the code, is in violation of the Twitter API TOS. You have
to make it harder for people to find those keys.
Tom
On 4/28/11 6:25 PM, Victor wrote:
Hi There!.
I am having problems using the OAUTH authentication from an web based
application developed in javascript.
Basically i can do the first step requesting a "Request Token" using
submit a form. But i cannot make it work with an ajax request.
I guess that this step the application must do it in "background"
hidden from the final user.
The final user hasn't to press a button to submit a form to get the
request token.... he probably doesn't even want to know what it's
means... so,i insist, that there must be a way using ajax. to get a
request token
So, i tried and tried... looking across the web and the universe...
and after a lot of work, finally i was able to get to be able to send
a HTTP header for request token, and twitter answer me with a 200 HTML
code (i see that using firebug, the net panel) , but there is NO text
in the response!!
I will copy paste the code that make things work with forms and
apparently with XHR but it doesn't return anything.
JUST PASTE IT IN A FILE, PUT A REAL CONSUMER KEY AND SECRET AND VIOLA
THE RESULTS.
Thanks for advance to all the readers!!
Hope anyone can help me!.
Víctor.
<!DOCTYPE html>
<html>
<head>
<title>OAuth Sandbox</title>
<script type="text/javascript" src="sha1.js"></script>
<script type="text/javascript" src="oauth.js"></script>
</head>
<body>
<script>
var myConsumerKey ='A'; // HERE IT WAS A REAL KEY
var myConsumerSecret ='B'; // HERE WAS A REAL SECRET
requestToken();
function requestToken (form)
{
var accessor = {
consumerSecret: myConsumerSecret,
tokenSecret: ''
};
var message = {
method: "POST",
action:
"https://api.twitter.com/oauth/request_token";,
parameters: {
oauth_signature_method: "HMAC-SHA1",
oauth_consumer_key: myConsumerKey,
oauth_callback: "oob"
}
};
OAuth.setTimestampAndNonce(message);
OAuth.SignatureMethod.sign(message, accessor);
// FILL THE FORM INPUTS WITH THE NECESARY PARAMETERS
var parameterMap =
OAuth.getParameterMap(message.parameters);
for (var p in parameterMap) {
if (p.substring(0, 6) == "oauth_"&& form[p] !=
null&&
form[p].name != null&& form[p].name != "")
{
form[p].value = parameterMap[p];
}
}
return true;
}
function requestTokenXHR ()
{
var accessor = {
consumerKey: myConsumerKey,
consumerSecret: myConsumerSecret,
tokenSecret: ''
};
var message = {
method: "POST",
action:
"https://api.twitter.com/oauth/request_token";,
parameters: {
oauth_signature_method: "HMAC-SHA1",
oauth_consumer_key: myConsumerKey,
oauth_callback: "oob"
}
};
OAuth.setTimestampAndNonce(message);
OAuth.completeRequest(message, accessor);
OAuth.SignatureMethod.sign(message, accessor);
var a =
OAuth.SignatureMethod.normalizeParameters(message.parameters);
var encodedParameters = OAuth.formEncode
(message.parameters);
var authorizationHeader =
OAuth.getAuthorizationHeader("",message.parameters);
var http = new XMLHttpRequest();
http.open("POST", message.action, false);
//Send the proper header information along with the
request
http.setRequestHeader("Content-type",
"application/x-www-form-
urlencoded");
http.setRequestHeader("Content-length",
encodedParameters.length);
http.onreadystatechange=function()
{
if (http.readyState==4)
{
document.getElementById("myDiv").innerHTML=http.responseText;
}
}
http.send(encodedParameters);
}
</script>
<form name="sender" method="POST" action="http://api.twitter.com/
oauth/request_token" onSubmit="requestToken(this)">
<input type="submit" value="Get Request Token "/><br/>
<input type="button" value="Get Request Token USING XHR"
onClick="requestTokenXHR()"/><br/>
consumer key:<input name="oauth_consumer_key"
type="text" size="64"/><br/>
signature method:<input name="oauth_signature_method"
type="text"/>
<input name="oauth_timestamp"
type="hidden"/>
<input name="oauth_nonce"
type="hidden"/>
<input name="oauth_signature"
type="hidden"/>
<input name="oauth_callback"
type="hidden" value="oob"/
</form>
<div id="myDiv">
</div>
</body>
</html>
--
Twitter developer documentation and resources: http://dev.twitter.com/doc
API updates via Twitter: http://twitter.com/twitterapi
Issues/Enhancements Tracker: http://code.google.com/p/twitter-api/issues/list
Change your membership to this group:
http://groups.google.com/group/twitter-development-talk
