Add auth folder.

controllers/auth.go

@@ -41,7 +41,7 @@ var githubOauthConfig = &oauth2.Config{
 	Endpoint:     githubEndpoint,
 }
 
-func (c *ApiController) AuthGithub() {
+func (c *ApiController) AuthLogin() {
 	providerName := c.Input().Get("provider")
 	code := c.Input().Get("code")
 	state := c.Input().Get("state")

routers/router.go

@@ -37,7 +37,7 @@ func initAPI() {
 	beego.Router("/api/login", &controllers.ApiController{}, "POST:Login")
 	beego.Router("/api/logout", &controllers.ApiController{}, "POST:Logout")
 	beego.Router("/api/get-account", &controllers.ApiController{}, "GET:GetAccount")
-	beego.Router("/api/auth/github", &controllers.ApiController{}, "GET:AuthGithub")
+	beego.Router("/api/auth/login", &controllers.ApiController{}, "GET:AuthLogin")
 
 	beego.Router("/api/get-organizations", &controllers.ApiController{}, "GET:GetOrganizations")
 	beego.Router("/api/get-organization", &controllers.ApiController{}, "GET:GetOrganization")

web/src/App.js

@@ -27,12 +27,12 @@ import ProviderListPage from "./ProviderListPage";
 import ProviderEditPage from "./ProviderEditPage";
 import ApplicationListPage from "./ApplicationListPage";
 import ApplicationEditPage from "./ApplicationEditPage";
-import Face from "./Face";
 import AccountPage from "./account/AccountPage";
 import LoginPage from "./account/LoginPage";
 import HomePage from "./basic/HomePage";
 import CustomGithubCorner from "./CustomGithubCorner";
-import AuthCallback from "./common/AuthCallback";
+import Face from "./auth/Face";
+import AuthCallback from "./auth/AuthCallback";
 
 const { Header, Footer } = Layout;
 
@@ -46,7 +46,6 @@ class App extends Component {
     };
 
     Setting.initServerUrl();
-    Setting.initClientUrl();
   }
 
   componentWillMount() {

web/src/ApplicationEditPage.js

@@ -19,7 +19,7 @@ import * as ApplicationBackend from "./backend/ApplicationBackend";
 import * as Setting from "./Setting";
 import * as ProviderBackend from "./backend/ProviderBackend";
 import * as OrganizationBackend from "./backend/OrganizationBackend";
-import Face from "./Face";
+import Face from "./auth/Face";
 
 const { Option } = Select;
 

web/src/ProviderListPage.js

@@ -18,7 +18,7 @@ import {Button, Col, Popconfirm, Row, Table} from 'antd';
 import moment from "moment";
 import * as Setting from "./Setting";
 import * as ProviderBackend from "./backend/ProviderBackend";
-import * as Auth from "./common/Auth";
+import * as Auth from "./auth/Auth";
 
 class ProviderListPage extends React.Component {
   constructor(props) {

web/src/Setting.js

@@ -26,15 +26,6 @@ export function initServerUrl() {
   }
 }
 
-export function initClientUrl() {
-  const hostname = window.location.hostname;
-  if (hostname === "localhost") {
-    ClientUrl = `http://${hostname}:7001`;
-  } else {
-    ClientUrl = `https://${hostname}`;
-  }
-}
-
 export function parseJson(s) {
   if (s === "") {
     return null;

web/src/account/LoginPage.js

@@ -13,7 +13,7 @@
 // limitations under the License.
 
 import React from 'react';
-import Face from "../Face";
+import Face from "../auth/Face";
 
 class LoginPage extends React.Component {
   render() {

web/src/auth/Auth.js

@@ -12,8 +12,6 @@
 // See the License for the specific language governing permissions and
 // limitations under the License.
 
-import * as Setting from "../Setting";
-
 export const GoogleAuthScope  = "profile+email"
 export const GoogleAuthUri = "https://accounts.google.com/signin/oauth";
 export const GoogleAuthLogo = "https://cdn.jsdelivr.net/gh/casbin/static/img/social_google.png";
@@ -41,8 +39,17 @@ export function getAuthLogo(provider) {
   }
 }
 
+export function getClientUrl() {
+  const hostname = window.location.hostname;
+  if (hostname === "localhost") {
+    return `http://${hostname}:7001`;
+  } else {
+    return `https://${hostname}`;
+  }
+}
+
 export function getAuthUrl(provider, method) {
-  const redirectUri = `${Setting.ClientUrl}/callback/${provider.type}/${provider.name}/${method}`;
+  const redirectUri = `${getClientUrl()}/callback/${provider.type}/${provider.name}/${method}`;
   if (provider.type === "google") {
     return `${GoogleAuthUri}?client_id=${provider.clientId}&redirect_uri=${redirectUri}&scope=${GoogleAuthScope}&response_type=code&state=${AuthState}`;
   } else if (provider.type === "github") {

web/src/auth/AuthCallback.js

@@ -13,9 +13,10 @@
 // limitations under the License.
 
 import React from "react";
+import {message, Spin} from "antd";
 import {withRouter} from "react-router-dom";
-import * as Setting from "../Setting";
 import * as AccountBackend from "../backend/AccountBackend";
+import {getClientUrl} from "./Auth";
 
 class AuthCallback extends React.Component {
   constructor(props) {
@@ -34,29 +35,35 @@ class AuthCallback extends React.Component {
     };
   }
 
-  getAuthenticatedInfo() {
+  componentWillMount() {
+    this.authLogin();
+  }
+
+  showMessage(type, text) {
+    if (type === "success") {
+      message.success(text);
+    } else if (type === "error") {
+      message.error(text);
+    }
+  }
+
+  authLogin() {
     let redirectUrl;
-    redirectUrl = `${Setting.ClientUrl}/callback/${this.state.providerType}/${this.state.providerName}/${this.state.addition}`;
+    redirectUrl = `${getClientUrl()}/callback/${this.state.providerType}/${this.state.providerName}/${this.state.addition}`;
     AccountBackend.authLogin(this.state.providerName, this.state.code, this.state.state, redirectUrl, this.state.addition)
       .then((res) => {
         if (res.status === "ok") {
           window.location.href = '/';
         } else {
-          Setting.showMessage("error", res?.msg);
+          this.showMessage("error", res?.msg);
         }
       });
   }
 
-  componentDidMount() {
-    this.getAuthenticatedInfo();
-  }
-
   render() {
     return (
-      <div>
-        <h3>
-          Logging in ...
-        </h3>
+      <div style={{textAlign: "center"}}>
+        <Spin size="large" tip="Signing in..." style={{paddingTop: "10%"}} />
       </div>
     )
   }

web/src/auth/Face.js

@@ -15,10 +15,10 @@
 import React from "react";
 import {Button, Checkbox, Col, Form, Input, Row} from "antd";
 import {LockOutlined, UserOutlined} from "@ant-design/icons";
-import * as ApplicationBackend from "./backend/ApplicationBackend";
-import * as AccountBackend from "./backend/AccountBackend";
-import * as Setting from "./Setting";
-import * as Auth from "./common/Auth";
+import * as ApplicationBackend from "../backend/ApplicationBackend";
+import * as AccountBackend from "../backend/AccountBackend";
+import * as Setting from "../Setting";
+import * as Auth from "./Auth";
 
 class Face extends React.Component {
   constructor(props) {

web/src/backend/AccountBackend.js

@@ -14,13 +14,6 @@
 
 import * as Setting from "../Setting";
 
-export function getUser(username) {
-  return fetch(`${Setting.ServerUrl}/api/get-user?username=${username}`, {
-    method: 'GET',
-    credentials: 'include'
-  }).then(res => res.json());
-}
-
 export function getAccount() {
   return fetch(`${Setting.ServerUrl}/api/get-account`, {
     method: 'GET',
@@ -52,8 +45,7 @@ export function logout() {
 }
 
 export function authLogin(providerName, code, state, redirectUrl, addition) {
-  console.log(redirectUrl)
-  return fetch(`${Setting.ServerUrl}/api/auth/github?provider=${providerName}&code=${code}&state=${state}&redirect_url=${redirectUrl}&addition=${addition}`, {
+  return fetch(`${Setting.ServerUrl}/api/auth/login?provider=${providerName}&code=${code}&state=${state}&redirect_url=${redirectUrl}&addition=${addition}`, {
     method: 'GET',
     credentials: 'include',
   }).then(res => res.json());