Question

所以我有这个代码，应该连接到谷歌api并获得用户的一些信息。但问题是启动登录功能的链接不起作用。

这是一个java RESTful项目，因此它通过maven构建并部署在tomcat服务器上（如果有帮助的话）。

<!DOCTYPE html>
<html>
<head>
    <script src='http://code.jquery.com/jquery-2.1.3.min.js'></script>
    <script type='text/javascipt'>
    $(document).ready(function(){
		var OAUTHURL = 'https://accounts.google.com/o/oauth2/auth?';
		var VALIDURL = 'https://www.googleapis.com/oauth2/v1/tokeninfo?access_token=';
		var SCOPE = 'https://www.googleapis.com/auth/userinfo.profile https://www.googleapis.com/auth/userinfo.email';
		var CLIENTID = 'sercret';
		var REDIRECT = 'myredirect';
		var LOGOUT = 'http://accounts.google.com/Logout';
		var TYPE = 'token';
		var url1 = OAUTHURL + 'scope=' + SCOPE + '&client_id=' + CLIENTID + '&redirect_uri=' + REDIRECT + '&response_type=' + TYPE;
		var acToken;
		var tokenType;
		var expiresIn;
		var user;
		var loggedIn = false;
		function login(){
		    var win = window.open(url1, 'windowname1', 'width=800, height=600'); 
		    var pollTimer = window.setInterval(function() {
		        try {
		            console.log(win.document.URL);
		            if (win.document.URL.indexOf(REDIRECT) != -1) {
		                window.clearInterval(pollTimer);
		                var url =   win.document.URL;
		                acToken =   gup(url, 'access_token');
		                tokenType = gup(url, 'token_type');
		                expiresIn = gup(url, 'expires_in');
		                win.close();	
		                validateToken(acToken);
		            }
		        } catch(e) {
		        }
		    }, 500);
		});
		function validateToken(token) {
		    $.ajax({
		        url: VALIDURL + token,
		        data: null,
		        success: function(responseText){
		            getUserInfo();
		            loggedIn = true;
		            $('#loginText').hide();
		            $('#logoutText').show();
		        }, 
		        dataType: 'jsonp'
		    });
		}
		function getUserInfo() {
		    $.ajax({
		        url: 'https://www.googleapis.com/oauth2/v1/userinfo?access_token=' + acToken,
		        data: null,
		        success: function(resp) {
		            user    =   resp;
		            console.log(user);
		            $('#uName').text('Welcome ' + user.name);
		            $('#imgHolder').attr('src', user.picture);
		        },
		        dataType: 'jsonp'
		    });
		}
		/*credits: http://www.netlobo.com/url_query_string_javascript.html*/
		function gup(url, name) {
		name = name.replace(/[\\\\[]/,'\\\[').replace(/[\]]/,'\\\]');
		    var regexS = '[\\#&]'+name+'=([^&#]*)';
		    var regex = new RegExp( regexS );
		    var results = regex.exec( url );
		    if( results === null )
		        return ;
		    else
		        return results[1];
		}
		function startLogoutPolling() {
		    $('#loginText').show();
		    $('#logoutText').hide();
		    loggedIn = false;
		    $('#uName').text('Welcome ');
		    $('#imgHolder').attr('src', 'none.jpg');
		}
	});
</script>
</head>
<body>
    <a href="#" onclick='login()' id='loginText'> Click here to login </a>
    <a href="#" style='display:none' id='logoutText' target='myIFrame' onclick="myIFrame.location='https://www.google.com/accounts/Logout'; startLogoutPolling();return false;"> Click here to logout </a>
    <iframe name='myIFrame' id='myIFrame' style='display:none'></iframe>
    <div id='uName'></div>
    <img src='' id='imgHolder'/>
</body>
</html>

Answer 1

小错误，浪费时间：）

 <script type='text/javascript'>

你错过了＆＃39; r＆＃39;在javascipt

Answer 2

这是在寻找一个名为login的函数：

onclick='login()'

但是，当前范围中不存在此类功能。它仅在document.ready处理程序的范围内定义：

$(document).ready(function () {
    function login() {
        //...
    }
});

所以它在处理程序之外是不可见的。为了使其可见，请在外部定义：

function login() {
    //...
}

$(document).ready(function () {
    //...
});

您通常不需要在document.ready中定义您的功能，它主要用于在评估选择器之前等待DOM加载。您可以定义其中的功能，如果这些功能不需要在其范围之外存在。

另一种选择是将其绑定在它定义的范围内，而不是在标记中内联。像这样：

$(document.ready(function () {
    function login() {
        //...
    }

    $('#loginText').click(login);
});

html文件中的Javascript无法正常工作

2 个答案: