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