update for sso

This commit is contained in:
2021-07-28 17:28:25 +05:30
parent 8aad24600a
commit f1f4d10368
55 changed files with 211 additions and 86 deletions

View File

@ -17,6 +17,7 @@ const Login = React.lazy(() => import('./views/pages/login/Login'));
const Register = React.lazy(() => import('./views/pages/register/Register'));
const Page404 = React.lazy(() => import('./views/pages/page404/Page404'));
const Page500 = React.lazy(() => import('./views/pages/page500/Page500'));
const Sso = React.lazy(() => import('./views/sso/index'));
class App extends Component {
@ -25,6 +26,7 @@ class App extends Component {
<BrowserRouter>
<React.Suspense fallback={loading}>
<Switch>
<Route exact path="/sso" name="SSO Login" render={props => <Sso {...props}/>} />
<Route exact path="/login" name="Login Page" render={props => <Login {...props}/>} />
<Route exact path="/register" name="Register Page" render={props => <Register {...props}/>} />
<Route exact path="/404" name="Page 404" render={props => <Page404 {...props}/>} />

View File

@ -1,4 +1,5 @@
import React, { Suspense } from 'react'
import Cookies from 'js-cookie';
import {
Redirect,
Route,
@ -8,7 +9,7 @@ import { CContainer, CFade } from '@coreui/react'
// routes config
import routes from '../routes'
const loading = (
<div className="pt-3 text-center">
<div className="sk-spinner sk-spinner-pulse"></div>
@ -16,6 +17,13 @@ const loading = (
)
const TheContent = () => {
function get_token_from_storage_or_cookie() {
const shib = Cookies.get('_shibsession_64656661756c7468747470733a2f2f66736273736f2e73756d6173656e2e6e65742f73686962626f6c657468')
console.log(shib);
return null;
}
return (
<main className="c-main">
<CContainer fluid>
@ -28,11 +36,23 @@ const TheContent = () => {
path={route.path}
exact={route.exact}
name={route.name}
render={props => (
<CFade>
render={props =>
get_token_from_storage_or_cookie("tokenName") !== null
? (
<route.component {...props} />
</CFade>
)} />
) : (
<Redirect to={{ pathname: "/sso" }} />
)
}
// render={props => (
// <CFade>
// <route.component {...props} />
// </CFade>
// )}
/>
)
})}
<Redirect from="/" to="/dashboard" />

View File

@ -60,6 +60,10 @@ const TheHeader = () => {
</CHeaderNavItem>
</CHeaderNav>
<CHeaderNav className="px-3">
<TheHeaderDropdown/>
</CHeaderNav>
<CSubheader className="px-3 justify-content-between">
<CBreadcrumbRouter
className="border-0 c-subheader-nav m-0 px-0 px-md-3"

View File

@ -10,6 +10,12 @@ import {
import CIcon from '@coreui/icons-react'
const TheHeaderDropdown = () => {
function launchsso() {
console.log("launch sso");
window.open("https://fsbsso.sumasen.net/Shibboleth.sso/Login", "_self");
}
return (
<CDropdown
inNav
@ -18,11 +24,7 @@ const TheHeaderDropdown = () => {
>
<CDropdownToggle className="c-header-nav-link" caret={false}>
<div className="c-avatar">
<CImg
src={'avatars/6.jpg'}
className="c-avatar-img"
alt="admin@bootstrapmaster.com"
/>
Account
</div>
</CDropdownToggle>
<CDropdownMenu className="pt-0" placement="bottom-end">
@ -34,10 +36,9 @@ const TheHeaderDropdown = () => {
>
<strong>Account</strong>
</CDropdownItem>
<CDropdownItem>
<CDropdownItem onClick={launchsso}>
<CIcon name="cil-bell" className="mfe-2" />
Updates
<CBadge color="info" className="mfs-auto">42</CBadge>
SSO Login
</CDropdownItem>
</CDropdownMenu>
</CDropdown>

View File

@ -24,6 +24,12 @@ const _nav = [{
to: '/uploader',
icon: 'cil-drop',
},
{
_tag: 'CSidebarNavItem',
name: 'secret',
to: '/secret',
icon: 'cil-drop',
},
// {
// _tag: 'CSidebarNavTitle',
// _children: ['Components']

View File

@ -3,6 +3,8 @@ import React from 'react';
const Dashboard = React.lazy(() => import('./views/dashboard/Dashboard'));
const BoxDisplacemen = React.lazy(() => import('./views/BoxDisplacemen/index'));
const Uploader = React.lazy(() => import('./views/Uploader/index'));
const Secret = React.lazy(() => import('./views/secret/index'));
const Sso = React.lazy(() => import('./views/sso/index'));
const routes = [
@ -10,6 +12,7 @@ const routes = [
{ path: '/dashboard', name: 'ダッシュボード', component: Dashboard },
{ path: '/reports', exact: true, name: 'レポート', component: BoxDisplacemen },
{ path: '/uploader', exact: true, name: 'アップロード', component: Uploader },
{ path: '/secret', exact: true, name: 'アップロード', component: Secret },
];
export default routes;

11
src/views/secret/index.js Normal file
View File

@ -0,0 +1,11 @@
import React from 'react'
function Secret() {
return (
<div>
This is a protected page
</div>
)
}
export default Secret

62
src/views/sso/index.js Normal file
View File

@ -0,0 +1,62 @@
import React from 'react'
import { Link } from 'react-router-dom'
import {
CButton,
CCard,
CCardBody,
CCardGroup,
CCol,
CContainer,
CForm,
CInput,
CInputGroup,
CInputGroupPrepend,
CInputGroupText,
CRow
} from '@coreui/react'
import CIcon from '@coreui/icons-react'
function Sso() {
function launchsso() {
console.log("launch sso");
window.open("https://fsbsso.sumasen.net/Shibboleth.sso/Login", "_self");
}
return (
<div className="c-app c-default-layout flex-row align-items-center">
<CContainer>
<CRow className="justify-content-center">
<CCol md="8">
<CCardGroup>
<CCard className="p-4">
<CCardBody>
<CForm>
<h1>Login</h1>
<p className="text-muted">Click here to Sign In with SSO</p>
<CRow>
<CCol>
<CButton color="primary" className="px-4" onClick={launchsso}>Login with SSO</CButton>
</CCol>
</CRow>
</CForm>
</CCardBody>
</CCard>
<CCard className="text-white bg-primary py-5 d-md-down-none" style={{ width: '44%' }}>
<CCardBody className="text-center">
<div>
<h2>How to Login</h2>
<p>This uses SSO Login, by clicking the link will redirect to SSO login page</p>
</div>
</CCardBody>
</CCard>
</CCardGroup>
</CCol>
</CRow>
</CContainer>
</div>
)
}
export default Sso