Support quick sign-in.

This commit is contained in:
Yang Luo
2021-10-09 21:15:57 +08:00
committed by RobotHuang
parent 4f2668cd90
commit 568372d077
4 changed files with 82 additions and 7 deletions

View File

@ -341,8 +341,15 @@ func (c *ApiController) Login() {
} }
} }
} else { } else {
c.ResponseError(fmt.Sprintf("unknown authentication type (not password or provider), form = %s", util.StructToJson(form))) if c.GetSessionUsername() != "" {
return // user already signed in to Casdoor, so let the user click the avatar button to do the quick sign-in
application := object.GetApplication(fmt.Sprintf("admin/%s", form.Application))
user := c.getCurrentUser()
resp = c.HandleLoggedIn(application, user, &form)
} else {
c.ResponseError(fmt.Sprintf("unknown authentication type (not password or provider), form = %s", util.StructToJson(form)))
return
}
} }
c.Data["json"] = resp c.Data["json"] = resp

View File

@ -529,11 +529,11 @@ class App extends Component {
if (this.isDoorPages()) { if (this.isDoorPages()) {
return ( return (
<Switch> <Switch>
<Route exact path="/signup" render={(props) => this.renderHomeIfLoggedIn(<SignupPage {...props} />)}/> <Route exact path="/signup" render={(props) => this.renderHomeIfLoggedIn(<SignupPage account={this.state.account} {...props} />)}/>
<Route exact path="/signup/:applicationName" render={(props) => this.renderHomeIfLoggedIn(<SignupPage {...props} onUpdateAccount={(account) => {this.onUpdateAccount(account)}} />)}/> <Route exact path="/signup/:applicationName" render={(props) => this.renderHomeIfLoggedIn(<SignupPage account={this.state.account} {...props} onUpdateAccount={(account) => {this.onUpdateAccount(account)}} />)}/>
<Route exact path="/login" render={(props) => this.renderHomeIfLoggedIn(<SelfLoginPage {...props} />)}/> <Route exact path="/login" render={(props) => this.renderHomeIfLoggedIn(<SelfLoginPage account={this.state.account} {...props} />)}/>
<Route exact path="/signup/oauth/authorize" render={(props) => <LoginPage type={"code"} mode={"signup"} {...props} onUpdateAccount={(account) => {this.onUpdateAccount(account)}} />}/> <Route exact path="/signup/oauth/authorize" render={(props) => <LoginPage account={this.state.account} type={"code"} mode={"signup"} {...props} onUpdateAccount={(account) => {this.onUpdateAccount(account)}} />}/>
<Route exact path="/login/oauth/authorize" render={(props) => <LoginPage type={"code"} mode={"signin"} {...props} onUpdateAccount={(account) => {this.onUpdateAccount(account)}} />}/> <Route exact path="/login/oauth/authorize" render={(props) => <LoginPage account={this.state.account} type={"code"} mode={"signin"} {...props} onUpdateAccount={(account) => {this.onUpdateAccount(account)}} />}/>
<Route exact path="/callback" component={AuthCallback}/> <Route exact path="/callback" component={AuthCallback}/>
<Route exact path="/forget" render={(props) => this.renderHomeIfLoggedIn(<SelfForgetPage {...props} />)}/> <Route exact path="/forget" render={(props) => this.renderHomeIfLoggedIn(<SelfForgetPage {...props} />)}/>
<Route exact path="/forget/:applicationName" render={(props) => this.renderHomeIfLoggedIn(<ForgetPage {...props} />)}/> <Route exact path="/forget/:applicationName" render={(props) => this.renderHomeIfLoggedIn(<ForgetPage {...props} />)}/>

View File

@ -21,6 +21,7 @@ import * as ApplicationBackend from "../backend/ApplicationBackend";
import * as Provider from "./Provider"; import * as Provider from "./Provider";
import * as Util from "./Util"; import * as Util from "./Util";
import * as Setting from "../Setting"; import * as Setting from "../Setting";
import SelfLoginButton from "./SelfLoginButton";
import {GithubLoginButton, GoogleLoginButton} from "react-social-login-buttons"; import {GithubLoginButton, GoogleLoginButton} from "react-social-login-buttons";
import FacebookLoginButton from "./FacebookLoginButton"; import FacebookLoginButton from "./FacebookLoginButton";
import QqLoginButton from "./QqLoginButton"; import QqLoginButton from "./QqLoginButton";
@ -380,6 +381,31 @@ class LoginPage extends React.Component {
} }
} }
renderSignedInBox() {
if (this.props.account === undefined || this.props.account === null) {
return null;
}
return (
<div>
<div style={{fontSize: 16, textAlign: "left"}}>
{i18next.t("login:Continue with")}&nbsp;:
</div>
<br/>
<SelfLoginButton account={this.props.account} onClick={() => {
let values = {};
values["application"] = this.state.application.name;
this.onFinish(values);
}} />
<br/>
<br/>
<div style={{fontSize: 16, textAlign: "left"}}>
{i18next.t("login:Or sign in with another account")}&nbsp;:
</div>
</div>
)
}
render() { render() {
const application = this.getApplicationObj(); const application = this.getApplicationObj();
if (application === null) { if (application === null) {
@ -409,6 +435,9 @@ class LoginPage extends React.Component {
{/*{*/} {/*{*/}
{/* this.state.clientId !== null ? "Redirect" : null*/} {/* this.state.clientId !== null ? "Redirect" : null*/}
{/*}*/} {/*}*/}
{
this.renderSignedInBox()
}
{ {
this.renderForm(application) this.renderForm(application)
} }

View File

@ -0,0 +1,39 @@
// Copyright 2021 The casbin Authors. All Rights Reserved.
//
// Licensed under the Apache License, Version 2.0 (the "License");
// you may not use this file except in compliance with the License.
// You may obtain a copy of the License at
//
// http://www.apache.org/licenses/LICENSE-2.0
//
// Unless required by applicable law or agreed to in writing, software
// distributed under the License is distributed on an "AS IS" BASIS,
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
// See the License for the specific language governing permissions and
// limitations under the License.
import React from "react";
import {createButton} from "react-social-login-buttons";
class SelfLoginButton extends React.Component {
generateIcon() {
const avatar = this.props.account.avatar;
return () => {
return <img width={36} height={36} src={avatar} alt="Sign in with Google"/>;
};
}
render() {
const config = {
icon: this.generateIcon(),
iconFormat: name => `fa fa-${name}`,
style: {background: "#ffffff", color: "#000000"},
activeStyle: {background: "#eff0ee"},
};
const SelfLoginButton = createButton(config);
return <SelfLoginButton text={`${this.props.account.name} (${this.props.account.displayName})`} onClick={() => this.props.onClick()} align={"center"} />
}
}
export default SelfLoginButton;