FOSOAuthServerBundle的Javascript客户端_Javascript_Oauth 2.0_Fosoauthserverbundle_Hello.js

FOSOAuthServerBundle的Javascript客户端

javascript oauth-2.0

FOSOAuthServerBundle的Javascript客户端,javascript,oauth-2.0,fosoauthserverbundle,hello.js,Javascript,Oauth 2.0,Fosoauthserverbundle,Hello.js,我很难让身份验证工作流正常工作。我试过JSO 这是我的测试代码（忽略登录字段）登录登录：密码： $（文档）.ready（函数（）{ var jso； $.getJSON（'parameters.json'，函数（数据）{ jso=新的jso({ providerID:“电影应用程序”，客户端id:data['backend-api']['client\u id']，重定向_uri:window.location.href，授权：“http://”+data['backend-api

我很难让身份验证工作流正常工作。我试过JSO

这是我的测试代码（忽略登录字段）


登录
登录：

密码：
$（文档）.ready（函数（）{
var jso；
$.getJSON（'parameters.json'，函数（数据）{
jso=新的jso({
providerID:“电影应用程序”，
客户端id:data['backend-api']['client\u id']，
重定向_uri:window.location.href，
授权：“http://”+data['backend-api']['host']+“/oauth/v2/auth”，
作用域：{请求：[”https://www.googleapis.com/auth/userinfo.profile"]}
});
log（数据['backend-api']['host']）；
});
JSO.enablejQuery（$）；
$（“#获取_令牌”）。单击（函数（）{
getToken（函数（令牌）{
log（“我得到了令牌：”，令牌）；
});
});
$（“#清除_标记”）。单击（函数（）{
jso.wipeTokens（）
});
$（'#回调'）。单击（函数（）{
jso.callback（）
});
$（'#dump'）。单击（函数（）{
警报（jso.dump（））；
});
$（'#fetch'）。单击（函数（）{
jso.ajax({
url:“http://movie-app.localhost/app_dev.php/showtimes/2014-09-27",
数据类型：“json”，
//跨域：是的，
成功：功能（数据）{
log（“响应（谷歌）：”；
控制台日志（数据）；
}
});
});
});

我不确定我的工作流程是否正确，因为每次我想从URL获取数据时，我都需要授权使用api。
我认为第一次尝试获取需要授权的数据时，我使用了token，但我的代码不支持这种方式。
有人能举一个很好的例子，说明如何将JSO、Hello.js或任何其他Javascript客户端代码与FosOAuthServerBundle一起使用吗

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8"/>
    <title>Login</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="icon" type="image/x-icon" href="{{ asset('favicon.ico') }}"/>
    <script type="text/javascript" src="/vendor/jso/build/jso.js"></script>
</head>
<body>
<form action="" name="login" method="post">
    login: <input type="text" name="user"><br>
    password: <input type="password" name="password">
    <input type="submit" value="Submit" id="submit">
</form>
<input type="button" value="Get Token" id="get_token">
<input type="button" value="Clear Token" id="clear_token">
<input type="button" value="Dump" id="dump">
<input type="button" value="Fetch" id="fetch">
<input type="button" value="Callback" id="callback">
<script type="text/javascript" src="/vendor/jquery/dist/jquery.min.js"></script>
<script>
    $(document).ready(function () {
        var jso;
        $.getJSON('parameters.json', function (data) {
            jso = new JSO({
                providerID: "movieApp",
                client_id: data['backend-api']['client_id'],
                redirect_uri: window.location.href,
                authorization: "http://" + data['backend-api']['host'] + "/oauth/v2/auth",
                scopes: {request: ["https://www.googleapis.com/auth/userinfo.profile"]}
            });
            console.log(data['backend-api']['host']);
        });

        JSO.enablejQuery($);

        $('#get_token').click(function () {
            jso.getToken(function (token) {

                console.log("I got the token: ", token);

            });
        });
        $('#clear_token').click(function () {
            jso.wipeTokens()
        });
        $('#callback').click(function () {
            jso.callback()
        });
        $('#dump').click(function () {
            alert(jso.dump());
        });
        $('#fetch').click(function () {
            jso.ajax({
                url: "http://movie-app.localhost/app_dev.php/showtimes/2014-09-27",
                dataType: 'json',
                //crossDomain: true,
                success: function (data) {
                    console.log("Response (google):");
                    console.log(data);
                }
            });

        });
    });
</script>
</body>
</html>