时间戳

首页 > 解决方案 > Window.close() 未关闭 Google Oauth 弹出窗口 [Java Servlets]

javascript - Window.close() 未关闭 Google Oauth 弹出窗口 [Java Servlets]

问题描述

我正在尝试实现 Google Oauth 功能。这就是我的程序运行的方式。首先，index.jsp 文件运行并打开一个页面，如下所示： 在此处输入图像描述

我的 index.jsp 代码是：

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Website</title>
</head>
<style>
h1 {
	font-family: Bookman;
	font-size: 150px;
	font-style: normal;
	font-variant: normal;
	font-weight: 800;
	line-height: 26.4px;
	text-color: white;
	text-align: center;
}
p {
	font-family: Bookman;
	font-size: 50px;
	font-style: normal;
	font-variant: normal;
	font-weight: 800;
	line-height: 26.4px;
	text-color: white;
	text-align: center;
}
.main_background{
    background-image: url("img/main_page_background.jpg");
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}
</style>
<body class=main_background>
<h1 style="color:white">Title</h1>
<p style="color:white">Subtitle</p>
<form action="google_oauth" method="post">
<input type="submit" value="Sign In With Google"/>
</form>

</body>
</html>

发生的情况是用户单击重定向到 servlet 的“使用 Google 按钮登录”。在 servlet 内部，使用以下代码打开另一个 html 文件：

	protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		File htmlFile = new File("C:\\Users\\neel-\\OneDrive\\Eclipse Workspace\\Website\\Website\\WebContent\\google_oauth.html");
		Desktop.getDesktop().browse(htmlFile.toURI());
	}

}

我知道我可以将其实现到 .jsp 文件中，但进一步我将需要重定向。打开 html 文件后会发生什么，我们会得到一个像这样的窗口。

在此处输入图像描述

打开的 html 文件是 google_ouath.html 文件，代码是：

<!DOCTYPE html>
<html>
<head>
    <script src="jquery.js"></script>
    <script>
        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    =   '778647136201-d9trubpsuokohuj9a0c9bgufpo1qvqtf.apps.googleusercontent.com';
        var REDIRECT    =   'http://localhost:8080/Website/main_page'
        var LOGOUT      =   'http://accounts.google.com/Logout';
        var TYPE        =   'token';
        var _url        =   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(_url, "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"
            });
        }

        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>

但是，此问题的相关代码是：

        function login() {
            var win         =   window.open(_url, "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);
        }

在这里，弹出窗口打开客户端登录并关闭弹出窗口。像这样。 在此处输入图像描述

上面，我们可以看到 google 登录已经完成并且 url 已经重定向。但是回到 login() 函数， win.close() 实际上并没有关闭弹出窗口。我在网上四处搜索，发现了几个不起作用的解决方案。例如，这里它声明使用一种解决方法

open(location, '_self').close();

但这也不起作用。

另一件事是，在Brock Adams 解决方案中，它指出：

除了一个小例外，不得允许 javascript 关闭不是由同一 javascript 打开的窗口。

但是，我不认为这是一个问题。

问题：当 win.close() 不起作用时，如何关闭此弹出窗口。

更新：在尝试了 b4tch 的分析器之后。我得到以下信息： 在此处输入图像描述

标签： javascripthtmleclipseservletsgoogle-oauth

解决方案

不得允许 Javascript 关闭不是由同一 javascript 打开的窗口。出于安全原因这样做。

可能只是您必须调用自定位对象，该对象用于配置打开的窗口必须由相同的 java 脚本打开。为此，如果您尝试open(location, '_self').close();代替win.close()它应该可以工作，这就是我的情况。如果它仍然不起作用，请 Ping 我。

推荐阅读