Add SSO
This commit is contained in:
@@ -33,6 +33,22 @@ function App() {
|
||||
const currentTheme = getTheme(theme);
|
||||
|
||||
useEffect(() => {
|
||||
// Проверяем callback от OpenID Connect
|
||||
const urlParams = new URLSearchParams(window.location.search);
|
||||
const callbackToken = urlParams.get('token');
|
||||
const callbackUsername = urlParams.get('username');
|
||||
|
||||
if (callbackToken && callbackUsername) {
|
||||
// Сохраняем токен и обновляем состояние
|
||||
localStorage.setItem('token', callbackToken);
|
||||
setToken(callbackToken);
|
||||
setUser({ username: callbackUsername });
|
||||
|
||||
// Очищаем URL
|
||||
window.history.replaceState({}, document.title, window.location.pathname);
|
||||
return;
|
||||
}
|
||||
|
||||
if (token) {
|
||||
loadUser();
|
||||
loadServers();
|
||||
|
||||
@@ -1,6 +1,8 @@
|
||||
import { useState } from 'react';
|
||||
import { useState, useEffect } from 'react';
|
||||
import { Server, Eye, EyeOff } from 'lucide-react';
|
||||
import { getTheme } from '../themes';
|
||||
import { API_URL } from '../config';
|
||||
import axios from 'axios';
|
||||
|
||||
export default function Auth({ onLogin }) {
|
||||
const [isLogin, setIsLogin] = useState(true);
|
||||
@@ -10,9 +12,27 @@ export default function Auth({ onLogin }) {
|
||||
const [loading, setLoading] = useState(false);
|
||||
const [error, setError] = useState('');
|
||||
const [theme] = useState(localStorage.getItem('theme') || 'dark');
|
||||
const [oidcProviders, setOidcProviders] = useState({});
|
||||
|
||||
const currentTheme = getTheme(theme);
|
||||
|
||||
useEffect(() => {
|
||||
loadOidcProviders();
|
||||
}, []);
|
||||
|
||||
const loadOidcProviders = async () => {
|
||||
try {
|
||||
const { data } = await axios.get(`${API_URL}/api/auth/oidc/providers`);
|
||||
setOidcProviders(data);
|
||||
} catch (error) {
|
||||
console.error('Ошибка загрузки OIDC провайдеров:', error);
|
||||
}
|
||||
};
|
||||
|
||||
const handleOidcLogin = (provider) => {
|
||||
window.location.href = `${API_URL}/api/auth/oidc/${provider}/login`;
|
||||
};
|
||||
|
||||
const handleSubmit = async (e) => {
|
||||
e.preventDefault();
|
||||
setError('');
|
||||
@@ -129,11 +149,40 @@ export default function Auth({ onLogin }) {
|
||||
</button>
|
||||
</form>
|
||||
|
||||
{/* OpenID Connect Providers */}
|
||||
{Object.keys(oidcProviders).length > 0 && (
|
||||
<div className="mt-6">
|
||||
<div className="relative">
|
||||
<div className="absolute inset-0 flex items-center">
|
||||
<div className={`w-full border-t ${currentTheme.border}`} />
|
||||
</div>
|
||||
<div className="relative flex justify-center text-sm">
|
||||
<span className={`${currentTheme.secondary} px-2 ${currentTheme.textSecondary}`}>
|
||||
Или войдите через
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="mt-6 grid gap-3">
|
||||
{Object.entries(oidcProviders).map(([providerId, provider]) => (
|
||||
<button
|
||||
key={providerId}
|
||||
onClick={() => handleOidcLogin(providerId)}
|
||||
className={`w-full flex justify-center items-center px-4 py-3 border border-transparent rounded-xl text-sm font-medium text-white ${provider.color} transition-colors duration-200 shadow-sm hover:shadow-md`}
|
||||
>
|
||||
<span className="mr-2 text-lg">{provider.icon}</span>
|
||||
Войти через {provider.name}
|
||||
</button>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* Default Credentials */}
|
||||
{isLogin && (
|
||||
<div className={`mt-6 text-center text-sm ${currentTheme.textSecondary}`}>
|
||||
<p>Учётные данные по умолчанию:</p>
|
||||
<p className={`${currentTheme.text} font-mono mt-1`}>none / none</p>
|
||||
<p className={`${currentTheme.text} font-mono mt-1`}>Sofa12345 / arkonsad123</p>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user