Javascript 将值从Google登录传递到JSF登录
我对所有这一切都有点陌生，但我有一个JSFWeb应用程序（可以运行），它也有一个Google身份验证（Google身份验证本身可以运行） 我试图将googleauth的响应传递给JSF登录名（电子邮件地址&googleid），然后JSF登录名将通过jdbc域进行身份验证 因此，我想澄清一下，通过JdbcRealm的JSF身份验证本身是有效的，而google登录本身也是有效的——我只想将google的响应（电子邮件地址和google id）传递给JSF身份验证，并自动执行JSF身份验证表单的点击操作 我的问题是，在我登录谷歌后，我得到了错误 TypeError:document.getElementById（…）为空 这是我的JSF登录页面，包含所有JavascriptJavascript 将值从Google登录传递到JSF登录,javascript,java,jsf-2,glassfish,google-authentication,Javascript,Java,Jsf 2,Glassfish,Google Authentication,我对所有这一切都有点陌生，但我有一个JSFWeb应用程序（可以运行），它也有一个Google身份验证（Google身份验证本身可以运行） 我试图将googleauth的响应传递给JSF登录名（电子邮件地址&googleid），然后JSF登录名将通过jdbc域进行身份验证 因此，我想澄清一下，通过JdbcRealm的JSF身份验证本身是有效的，而google登录本身也是有效的——我只想将google的响应（电子邮件地址和google id）传递给JSF身份验证，并自动执行JSF身份验证表单的点击操
<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:f="http://xmlns.jcp.org/jsf/core"
xmlns:h="http://xmlns.jcp.org/jsf/html">
<h:head>
<meta charset="utf-8"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
<meta name="viewport" content="width=device-width, initial-scale=1"/>
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<meta name="description" content="NDIS Management System"/>
<meta name="author" content="Danielle Walker"/>
<meta name="google-signin-client_id" content="270287108664-3g7l6e6ah3gr5am9onokua84t3bvdbvf.apps.googleusercontent.com" />
<title>NDIS Home</title>
<!-- Bootstrap core CSS -->
<h:outputStylesheet name="bootstrap/css/bootstrap.min.css"/>
<h:outputStylesheet name="bootstrap/css/the-big-picture.css" />
<h:outputStylesheet name="css/google-button.css" />
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<f:verbatim>
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</f:verbatim>
<!-- Google API Javascript needs to be loaded in the page before the actual Javascript -->
<script src="https://apis.google.com/js/api:client.js" />
<ui:insert name="head"/>
</h:head>
<h:body class="full">
<nav class="navbar navbar-inverse navbar-fixed-bottom" role="navigation">
<div class="container">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#"></a>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
<li>
<a href="#">About</a>
</li>
<li>
<a href="#">Contact</a>
</li>
</ul>
<ul class="navbar-right">
<li>
<div id="gSignInWrapper" style="padding-top:5px;">
<div id="customBtn" class="customGPlusSignIn" style="float: right;">
<span class="icon"></span><span class="buttonText">Sign In</span>
</div>
</div>
<span style="color:#f9f9f9"><div id="name"></div></span>
</li>
</ul>
</div>
<!-- /.navbar-collapse -->
</div>
<!-- /.container -->
</nav>
<h:form id="login" onsubmit="document.getElementById('login').action = 'j_security_check';" prependId="false">
<!--<h:panelGrid columns="2">-->
<h:outputLabel for="j_username" value="Username" />
<h:inputText id="j_username" />
<h:outputLabel for="j_password" value="Password" />
<h:inputText id="j_password" size="8"/>
<h:commandButton id="submit" value="Login" />
<!--</h:panelGrid>-->
</h:form>
<f:verbatim>
<script>
var googleUser = {};
var startApp = function () {
gapi.load('auth2', function () {
// Retrieve the singleton for the GoogleAuth library and set up the client.
auth2 = gapi.auth2.init({
client_id: '270287108664-3g7l6e6ah3gr5am9onokua84t3bvdbvf.apps.googleusercontent.com',
cookiepolicy: 'single_host_origin'
// Request scopes in addition to 'profile' and 'email'
//scope: 'additional_scope'
});
attachSignin(document.getElementById('customBtn'));
});
};
</script>
</f:verbatim>
<script>startApp();</script>
<f:verbatim>
<script>
function attachSignin(element) {
console.log(element.id);
auth2.attachClickHandler(element, {},
function (googleUser) {
//document.getElementById('name').text = "Signed in: " +
// googleUser.getBasicProfile().getId();
document.getElementById("login.j_username").value = googleUser.getBasicProfile().getEmail();
document.getElementById("login.j_password").value = googleUser.getBasicProfile().getId();
}, function (error) {
alert(JSON.stringify(error, undefined, 2));
//alert("Opps... an error Occured");
});
}
function signOut() {
var auth2 = gapi.auth2.getAuthInstance();
auth2.signOut().then(function () {
console.log('User signed out.');
});
}
</script>
</f:verbatim>
<ui:insert name="body"/>
<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<h:outputScript name="bootstrap/js/bootstrap.min.js"/>
<script src="https://apis.google.com/js/api:client.js" />
</h:body>
</html>
新德里之家酒店
切换导航
-
-
-
登录
var googleUser={}；
var startApp=函数（）{
加载（'auth2'，函数（）{
//检索GoogleAuth库的单例并设置客户端。
auth2=gapi.auth2.init({
客户id:'270287108664-3g7l6e6ah3gr5am9onokua84t3bvdbvf.apps.googleusercontent.com'，
cookiepolicy:“单一主机源”
//除“配置文件”和“电子邮件”之外的请求范围
//范围：“附加范围”
});
attachSignin（document.getElementById（'customBtn'））；
});
};
startApp（）；
功能附加信号（元件）{
console.log（element.id）；
auth2.attachClickHandler（元素，{}，
功能（谷歌用户）{
//document.getElementById（'name'）。text=“已登录：”+
//googleUser.getBasicProfile（）.getId（）；
document.getElementById（“login.j_username”）.value=googleUser.getBasicProfile（）.getEmail（）；
document.getElementById（“login.j_password”）.value=googleUser.getBasicProfile（）.getId（）；
}，函数（错误）{
警报（JSON.stringify（错误，未定义，2））；
//警报（“Opps…发生错误”）；
});
}
函数签出（）{
var auth2=gapi.auth2.getAuthInstance（）；
auth2.signOut（）.then（函数（）{
log（'User signed out'）；
});
}
document.getElementById("login.j_username").value = googleUser.getBasicProfile().getEmail();
document.getElementById("login").elements[1].value = googleUser.getBasicProfile().getEmail();
简言之，问题在于我试图解决表单元素的方式，通过解决表单本身，然后是表单元素（位于基于0的数组中），然后它就可以工作了我找到了自己问题的答案 对于我的错误消息，问题显然在于我试图访问“j_用户名”和“j_密码”元素的方式： TypeError:document.getElementById（…）为空 无论如何，通过更改我的代码：
document.getElementById("login.j_username").value = googleUser.getBasicProfile().getEmail();
document.getElementById("login").elements[1].value = googleUser.getBasicProfile().getEmail();