fix: Add distinctions between access_token and refresh_token (#1280)

* fix: redirect to login page

* fix: front end router

* fix: front end router

* fix: signup page router

* fix: redirect to login page

object/token_jwt.go

@@ -24,9 +24,10 @@ import (
 
 type Claims struct {
 	*User
-	Nonce string `json:"nonce,omitempty"`
-	Tag   string `json:"tag,omitempty"`
-	Scope string `json:"scope,omitempty"`
+	TokenType string `json:"tokenType,omitempty"`
+	Nonce     string `json:"nonce,omitempty"`
+	Tag       string `json:"tag,omitempty"`
+	Scope     string `json:"scope,omitempty"`
 	jwt.RegisteredClaims
 }
 
@@ -37,8 +38,9 @@ type UserShort struct {
 
 type ClaimsShort struct {
 	*UserShort
-	Nonce string `json:"nonce,omitempty"`
-	Scope string `json:"scope,omitempty"`
+	TokenType string `json:"tokenType,omitempty"`
+	Nonce     string `json:"nonce,omitempty"`
+	Scope     string `json:"scope,omitempty"`
 	jwt.RegisteredClaims
 }
 
@@ -53,6 +55,7 @@ func getShortUser(user *User) *UserShort {
 func getShortClaims(claims Claims) ClaimsShort {
 	res := ClaimsShort{
 		UserShort:        getShortUser(claims.User),
+		TokenType:        claims.TokenType,
 		Nonce:            claims.Nonce,
 		Scope:            claims.Scope,
 		RegisteredClaims: claims.RegisteredClaims,
@@ -72,8 +75,9 @@ func generateJwtToken(application *Application, user *User, nonce string, scope
 	jti := fmt.Sprintf("%s/%s", application.Owner, name)
 
 	claims := Claims{
-		User:  user,
-		Nonce: nonce,
+		User:      user,
+		TokenType: "access-token",
+		Nonce:     nonce,
 		// FIXME: A workaround for custom claim by reusing `tag` in user info
 		Tag:   user.Tag,
 		Scope: scope,
@@ -97,10 +101,12 @@ func generateJwtToken(application *Application, user *User, nonce string, scope
 
 		token = jwt.NewWithClaims(jwt.SigningMethodRS256, claimsShort)
 		claimsShort.ExpiresAt = jwt.NewNumericDate(refreshExpireTime)
+		claimsShort.TokenType = "refresh-token"
 		refreshToken = jwt.NewWithClaims(jwt.SigningMethodRS256, claimsShort)
 	} else {
 		token = jwt.NewWithClaims(jwt.SigningMethodRS256, claims)
 		claims.ExpiresAt = jwt.NewNumericDate(refreshExpireTime)
+		claims.TokenType = "refresh-token"
 		refreshToken = jwt.NewWithClaims(jwt.SigningMethodRS256, claims)
 	}
 

web/src/AdapterEditPage.js

@@ -59,7 +59,7 @@ class AdapterEditPage extends React.Component {
   }
 
   getOrganizations() {
-    OrganizationBackend.getOrganizations(this.state.organizationName)
+    OrganizationBackend.getOrganizations("admin")
       .then((res) => {
         this.setState({
           organizations: (res.msg === undefined) ? res : [],
@@ -195,7 +195,7 @@ class AdapterEditPage extends React.Component {
             {Setting.getLabel(i18next.t("general:Organization"), i18next.t("general:Organization - Tooltip"))} :
           </Col>
           <Col span={22} >
-            <Select virtual={false} style={{width: "100%"}} value={this.state.adapter.organization} onChange={(value => {this.updateadapterField("organization", value);})}>
+            <Select virtual={false} style={{width: "100%"}} value={this.state.adapter.organization} onChange={(value => {this.updateAdapterField("organization", value);})}>
               {
                 this.state.organizations.map((organization, index) => <Option key={index} value={organization.name}>{organization.name}</Option>)
               }

web/src/App.less

@@ -123,7 +123,7 @@
 
 .login-form {
   text-align: center;
-  padding: 10px;
+  padding: 30px;
 }
 
 .login-content {

web/src/RoleEditPage.js

@@ -173,7 +173,7 @@ class RoleEditPage extends React.Component {
               this.updateRoleField("domains", value);
             })}>
               {
-                this.state.role.domains.map((domain, index) => <Option key={index} value={domain}>{domain}</Option>)
+                this.state.role.domains?.map((domain, index) => <Option key={index} value={domain}>{domain}</Option>)
               }
             </Select>
           </Col>

web/src/Setting.js

@@ -13,7 +13,7 @@
 // limitations under the License.
 
 import React from "react";
-import {Link, useHistory} from "react-router-dom";
+import {Link} from "react-router-dom";
 import {Tag, Tooltip, message} from "antd";
 import {QuestionCircleTwoTone} from "@ant-design/icons";
 import {isMobile as isMobileDevice} from "react-device-detect";
@@ -752,7 +752,7 @@ export function getLoginLink(application) {
   } else if (authConfig.appName === application.name) {
     url = "/login";
   } else if (application.signinUrl === "") {
-    url = path.join(application.homepageUrl, "login");
+    url = path.join(application.homepageUrl, "/login");
   } else {
     url = application.signinUrl;
   }
@@ -764,9 +764,8 @@ export function renderLoginLink(application, text) {
   return renderLink(url, text, null);
 }
 
-export function redirectToLoginPage(application) {
+export function redirectToLoginPage(application, history) {
   const loginLink = getLoginLink(application);
-  const history = useHistory();
   history.push(loginLink);
 }
 

web/src/auth/ForgetPage.js

@@ -23,6 +23,7 @@ import {CountDownInput} from "../common/CountDownInput";
 import * as UserBackend from "../backend/UserBackend";
 import {CheckCircleOutlined, KeyOutlined, LockOutlined, SolutionOutlined, UserOutlined} from "@ant-design/icons";
 import CustomGithubCorner from "../CustomGithubCorner";
+import {withRouter} from "react-router-dom";
 
 const {Step} = Steps;
 const {Option} = Select;
@@ -166,7 +167,7 @@ class ForgetPage extends React.Component {
     values.userOwner = this.state.application?.organizationObj.name;
     UserBackend.setPassword(values.userOwner, values.username, "", values?.newPassword).then(res => {
       if (res.status === "ok") {
-        Setting.redirectToLoginPage(this.state.application);
+        Setting.redirectToLoginPage(this.state.application, this.props.history);
       } else {
         Setting.showMessage("error", i18next.t(`signup:${res.msg}`));
       }
@@ -550,4 +551,4 @@ class ForgetPage extends React.Component {
   }
 }
 
-export default ForgetPage;
+export default withRouter(ForgetPage);

web/src/auth/LoginPage.js

@@ -30,6 +30,7 @@ import {CountDownInput} from "../common/CountDownInput";
 import SelectLanguageBox from "../SelectLanguageBox";
 import {withTranslation} from "react-i18next";
 import {CaptchaModal} from "../common/CaptchaModal";
+import {withRouter} from "react-router-dom";
 
 const {TabPane} = Tabs;
 
@@ -339,7 +340,7 @@ class LoginPage extends React.Component {
           title="Sign Up Error"
           subTitle={"The application does not allow to sign up new account"}
           extra={[
-            <Button type="primary" key="signin" onClick={() => Setting.redirectToLoginPage(application)}>
+            <Button type="primary" key="signin" onClick={() => Setting.redirectToLoginPage(application, this.props.history)}>
               {
                 i18next.t("login:Sign In")
               }
@@ -784,7 +785,6 @@ class LoginPage extends React.Component {
         <div className="login-content" style={{margin: this.parseOffset(application.formOffset)}}>
           {Setting.inIframe() ? null : <div dangerouslySetInnerHTML={{__html: application.formCss}} />}
           <div className="login-panel">
-            <SelectLanguageBox id="language-box-corner" style={{top: "50px"}} />
             <div className="side-image" style={{display: application.formOffset !== 4 ? "none" : null}}>
               <div dangerouslySetInnerHTML={{__html: application.formSideHtml}} />
             </div>
@@ -800,6 +800,7 @@ class LoginPage extends React.Component {
                   {/* {*/}
                   {/*  this.state.clientId !== null ? "Redirect" : null*/}
                   {/* }*/}
+                  <SelectLanguageBox id="language-box-corner" style={{top: "55px", right: "5px", position: "absolute"}} />
                   {
                     this.renderSignedInBox()
                   }
@@ -816,4 +817,4 @@ class LoginPage extends React.Component {
   }
 }
 
-export default withTranslation()(LoginPage);
+export default withTranslation()(withRouter(LoginPage));

web/src/auth/PromptPage.js

@@ -22,6 +22,7 @@ import i18next from "i18next";
 import AffiliationSelect from "../common/AffiliationSelect";
 import OAuthWidget from "../common/OAuthWidget";
 import SelectRegionBox from "../SelectRegionBox";
+import {withRouter} from "react-router-dom";
 
 class PromptPage extends React.Component {
   constructor(props) {
@@ -190,7 +191,7 @@ class PromptPage extends React.Component {
           if (redirectUrl !== "" && redirectUrl !== null) {
             Setting.goToLink(redirectUrl);
           } else {
-            Setting.redirectToLoginPage(this.getApplicationObj());
+            Setting.redirectToLoginPage(this.getApplicationObj(), this.props.history);
           }
         } else {
           Setting.showMessage("error", `Failed to log out: ${res.msg}`);
@@ -234,7 +235,7 @@ class PromptPage extends React.Component {
           title="Sign Up Error"
           subTitle={"You are unexpected to see this prompt page"}
           extra={[
-            <Button type="primary" key="signin" onClick={() => Setting.redirectToLoginPage(application)}>
+            <Button type="primary" key="signin" onClick={() => Setting.redirectToLoginPage(application, this.props.history)}>
               {
                 i18next.t("login:Sign In")
               }
@@ -272,4 +273,4 @@ class PromptPage extends React.Component {
   }
 }
 
-export default PromptPage;
+export default withRouter(PromptPage);

web/src/auth/SignupPage.js

@@ -26,6 +26,7 @@ import {CountDownInput} from "../common/CountDownInput";
 import SelectRegionBox from "../SelectRegionBox";
 import CustomGithubCorner from "../CustomGithubCorner";
 import SelectLanguageBox from "../SelectLanguageBox";
+import {withRouter} from "react-router-dom";
 
 const formItemLayout = {
   labelCol: {
@@ -541,7 +542,7 @@ class SignupPage extends React.Component {
           title="Sign Up Error"
           subTitle={"The application does not allow to sign up new account"}
           extra={[
-            <Button type="primary" key="signin" onClick={() => Setting.redirectToLoginPage(application)}>
+            <Button type="primary" key="signin" onClick={() => Setting.redirectToLoginPage(application, this.props.history)}>
               {
                 i18next.t("login:Sign In")
               }
@@ -562,7 +563,7 @@ class SignupPage extends React.Component {
           application: application.name,
           organization: application.organization,
         }}
-        style={{width: !Setting.isMobile() ? "400px" : "250px"}}
+        style={{width: !Setting.isMobile() ? "400px" : "300px"}}
         size="large"
       >
         <Form.Item
@@ -600,7 +601,7 @@ class SignupPage extends React.Component {
             if (linkInStorage !== null && linkInStorage !== "") {
               Setting.goToLink(linkInStorage);
             } else {
-              Setting.redirectToLoginPage(application);
+              Setting.redirectToLoginPage(application, this.props.history);
             }
           }}>
             {i18next.t("signup:sign in now")}
@@ -633,7 +634,6 @@ class SignupPage extends React.Component {
         <div className="login-content" style={{margin: this.parseOffset(application.formOffset)}}>
           {Setting.inIframe() ? null : <div dangerouslySetInnerHTML={{__html: application.formCss}} />}
           <div className="login-panel" >
-            <SelectLanguageBox id="language-box-corner" style={{top: "50px"}} />
             <div className="side-image" style={{display: application.formOffset !== 4 ? "none" : null}}>
               <div dangerouslySetInnerHTML={{__html: application.formSideHtml}} />
             </div>
@@ -645,6 +645,7 @@ class SignupPage extends React.Component {
                 {
                   Setting.renderLogo(application)
                 }
+                <SelectLanguageBox id="language-box-corner" style={{top: "55px", right: "5px", position: "absolute"}} />
                 {
                   this.renderForm(application)
                 }
@@ -660,4 +661,4 @@ class SignupPage extends React.Component {
   }
 }
 
-export default SignupPage;
+export default withRouter(SignupPage);