Mac
1 month ago
12 changed files with 1022 additions and 595 deletions
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,89 @@ |
|||||||
|
import React, { useState, useEffect } from "react"; |
||||||
|
import { View, StyleSheet, ActivityIndicator } from "react-native"; |
||||||
|
import { WebView } from "react-native-webview"; |
||||||
|
import { useNavigation } from "@react-navigation/native"; |
||||||
|
import { loginApi } from "../../services/api/login"; |
||||||
|
import { useAuth } from "../../contexts/AuthContext"; |
||||||
|
|
||||||
|
export const GoogleScreen = () => { |
||||||
|
const navigation = useNavigation(); |
||||||
|
const { login } = useAuth(); |
||||||
|
const [loading, setLoading] = useState(true); |
||||||
|
const [loginUrl, setLoginUrl] = useState<string | null>(null); |
||||||
|
|
||||||
|
useEffect(() => { |
||||||
|
const fetchLoginUrl = async () => { |
||||||
|
try { |
||||||
|
const response = await loginApi.google(); |
||||||
|
if (response.data.url) { |
||||||
|
setLoginUrl(response.data.url); |
||||||
|
} |
||||||
|
} catch (error) { |
||||||
|
console.error('Failed to fetch login URL:', error); |
||||||
|
} |
||||||
|
}; |
||||||
|
|
||||||
|
fetchLoginUrl(); |
||||||
|
}, []); |
||||||
|
|
||||||
|
const handleNavigationStateChange = async (navState: any) => {
|
||||||
|
console.log(navState.url); |
||||||
|
|
||||||
|
// 检查URL是否包含重定向URI
|
||||||
|
if (navState.url.includes('localhost:8000')) {
|
||||||
|
try { |
||||||
|
await login(); |
||||||
|
navigation.navigate('MainTabs' as never); |
||||||
|
} catch (error) { |
||||||
|
console.error('Login failed:', error); |
||||||
|
} |
||||||
|
} |
||||||
|
}; |
||||||
|
|
||||||
|
if (!loginUrl) { |
||||||
|
return ( |
||||||
|
<View style={styles.loadingContainer}> |
||||||
|
<ActivityIndicator size="large" color="#4285F4" /> |
||||||
|
</View> |
||||||
|
); |
||||||
|
} |
||||||
|
|
||||||
|
return ( |
||||||
|
<View style={styles.container}> |
||||||
|
<WebView |
||||||
|
source={{ uri: loginUrl }} |
||||||
|
style={styles.webview} |
||||||
|
onNavigationStateChange={handleNavigationStateChange} |
||||||
|
onLoadStart={() => setLoading(true)} |
||||||
|
onLoadEnd={() => setLoading(false)} |
||||||
|
javaScriptEnabled={true} |
||||||
|
domStorageEnabled={true} |
||||||
|
startInLoadingState={true} |
||||||
|
scalesPageToFit={true} |
||||||
|
originWhitelist={['*']} |
||||||
|
userAgent="Mozilla/5.0 (Linux; Android 10; Pixel 3) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/84.0.4147.125 Mobile Safari/537.36" |
||||||
|
onShouldStartLoadWithRequest={(request) => { |
||||||
|
console.log(request); |
||||||
|
|
||||||
|
// 允许所有请求
|
||||||
|
return true; |
||||||
|
}} |
||||||
|
/> |
||||||
|
</View> |
||||||
|
); |
||||||
|
}; |
||||||
|
|
||||||
|
const styles = StyleSheet.create({ |
||||||
|
container: { |
||||||
|
flex: 1, |
||||||
|
}, |
||||||
|
loadingContainer: { |
||||||
|
flex: 1, |
||||||
|
justifyContent: 'center', |
||||||
|
alignItems: 'center', |
||||||
|
backgroundColor: 'white', |
||||||
|
}, |
||||||
|
webview: { |
||||||
|
flex: 1, |
||||||
|
}, |
||||||
|
}); |
||||||
@ -0,0 +1,8 @@ |
|||||||
|
import axios from "axios"; |
||||||
|
|
||||||
|
|
||||||
|
export const loginApi = { |
||||||
|
google:() => { |
||||||
|
return axios.get<{url:string}>('http://124.70.102.7:8000/api/auth/google') |
||||||
|
} |
||||||
|
}; |
||||||
|
After Width: | Height: | Size: 8.4 KiB |
Loading…
Reference in new issue