CODEWITHSUNDEEP
javascriptoauth
fabian
fabian

Reputation: 5463

oAuth Fails: Is not allowed … Access-Control-Allow-Origin

what's wrong here?

OPTIONS https://twitter.com/oauth/request_token 401 (Unauthorized) jsOAuth-1.3.4.js:483 XMLHttpRequest cannot load https://twitter.com/oauth/request_token. Origin "http://localhost:8080" is not allowed by Access-Control-Allow-Origin.Object

<!DOCTYPE html>
<html>
<head>
<!--

A simple example of PIN-based oauth flow with Twitter and jsOAuth.

This is mostly based on/copied from <http://log.coffeesounds.com/oauth-and-pin-based-authorization-in-javascri>.

Get jsOAuth at <https://github.com/bytespider/jsOAuth/downloads>

-->

    <meta charset="utf-8">
    <title>jsOauth test</title>

    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>

    <script type="text/javascript" src="jsOAuth-1.3.4.js"></script>

    <style type="text/css" media="screen">

    </style>


    <script>


    $(document).ready(function() {
        var options = {
            consumerKey: 'YOUR_CONSUMER_KEY',
            consumerSecret: 'YOUR_CONSUMER_SECRET'
        };
        var requestParams;
        var accessParams;

        var oauth = OAuth(options);

        oauth.get('https://twitter.com/oauth/request_token',

            function(data) {
                console.dir(data);
                window.open('https://twitter.com/oauth/authorize?'+data.text);
                requestParams = data.text
            },

            function(data) { alert('darn'); console.dir(data) }
        );


        $('#pinbutton').click(function() {
            if ($('#pin').val()) {
                oauth.get('https://twitter.com/oauth/access_token?oauth_verifier='+$('#pin').val()+'&'+requestParams,

                    function(data) {
                        console.dir(data);

                        // split the query string as needed                     
                        var accessParams = {};
                        var qvars_tmp = data.text.split('&');
                        for (var i = 0; i < qvars_tmp.length; i++) {;
                            var y = qvars_tmp[i].split('=');
                            accessParams[y[0]] = decodeURIComponent(y[1]);
                        };

                        oauth.setAccessToken([accessParams.oauth_token, accessParams.oauth_token_secret]);
                        getHomeTimeline();
                    },

                    function(data) { alert('poop'); console.dir(data); }
                );              
            }
        });


        function getHomeTimeline() {
            oauth.get('https://api.twitter.com/1/statuses/home_timeline.json',

                function(data) {
                    entries = JSON.parse(data.text);
                    var html = [];
                    for (var i = 0; i < entries.length; i++) {
                        html.push(JSON.stringify(entries[i]));
                    };
                    $('#timeline').html(html.join('<hr>'));
                },

                function(data) { alert('lame'); console.dir(data); }
            );          
        }


    });
    </script>
</head>
<body>
    <h1>jsOauth test</h1>

    When you get a PIN, enter it here.

    <input id="pin" type="text" value=""><button id='pinbutton'>Save</button>

    <div id="timeline">

    </div>

</body>
</html>

Upvotes: 1

Views: 2352

Answers (1)

Tom van der Woerdt
Tom van der Woerdt

Reputation: 29985

I could give you the answer, but what you're doing is against the Twitter API Terms of Service. OAuthing in JavaScript exposes the secret credentials to anyone who visits the site and that is A Bad Thing. Please do this on your back-end.

Upvotes: 6

Related Questions