代码之家  ›  专栏  ›  技术社区  ›  Raghunadh

React Native:Clerk身份验证错误:不是有效的base64编码字符串长度

  •  0
  • Raghunadh  · 技术社区  · 1 年前

    我不知道为什么我在打开我的react原生expo应用程序时会出现这个错误,它吐出了一个错误,比如: 错误:不是有效的base64编码字符串长度

    此错误位于: 在ClerkProvider中(由RootLayout创建) 在RootLayout中。。。

    我设置办事员的_layout.js:

    import React, { useEffect } from "react";
    import { SplashScreen, Stack, useRouter, useSegments } from "expo-router";
    import { useFonts } from "expo-font";
    import { ClerkProvider, useAuth } from "@clerk/clerk-expo";
    import * as SecureStore from "expo-secure-store";
    import Toast from "react-native-toast-message";
    import { TouchableOpacity } from "react-native";
    import { Ionicons } from "@expo/vector-icons";
    SplashScreen.preventAutoHideAsync();
    const RootLayout = () => {
      const [fontsLoaded, error] = useFonts({
        "Poppins-Black": require("../assets/fonts/Poppins-Black.ttf"),
        "Poppins-Bold": require("../assets/fonts/Poppins-Bold.ttf"),
        "Poppins-ExtraBold": require("../assets/fonts/Poppins-ExtraBold.ttf"),
        "Poppins-ExtraLight": require("../assets/fonts/Poppins-ExtraLight.ttf"),
        "Poppins-Light": require("../assets/fonts/Poppins-Light.ttf"),
        "Poppins-Medium": require("../assets/fonts/Poppins-Medium.ttf"),
        "Poppins-Regular": require("../assets/fonts/Poppins-Regular.ttf"),
        "Poppins-SemiBold": require("../assets/fonts/Poppins-SemiBold.ttf"),
        "Poppins-Thin": require("../assets/fonts/Poppins-Thin.ttf"),
      });
      useEffect(() => {
        if (error) throw error;
    
        if (fontsLoaded) {
          SplashScreen.hideAsync();
        }
      }, [fontsLoaded, error]);
    
      if (!fontsLoaded && !error) {
        return null;
      }
      const tokenCache = {
        async getToken(key) {
          try {
            return SecureStore.getItemAsync(key);
          } catch (err) {
            return null;
          }
        },
        async saveToken(key, value) {
          try {
            return SecureStore.setItemAsync(key, value);
          } catch (err) {
            return;
          }
        },
      };
      const EXPO_PUBLIC_CLERK_PUBLISHABLE_KEY =
        process.env.EXPO_PUBLIC_CLERK_PUBLISHABLE_KEY;
      const InitialLayout = () => {
        const { isLoaded, isSignedIn } = useAuth();
        const segments = useSegments();
        const router = useRouter();
    
        useEffect(() => {
          console.log("IsSignedIn", isSignedIn);
    
          if (isLoaded && !isSignedIn) {
            router.push("/(modals)/login");
          }
        }, [isLoaded]);
        return (
          <Stack>
            <Stack.Screen name="index" options={{ headerShown: false }} />
            <Stack.Screen name="(tabs)" options={{ headerShown: false }} />
            <Stack.Screen
              name="(modals)/login"
              options={{
                presentation: "modal",
                title: "Log in or Sign up",
                headerTitleAlign: "center",
                headerTitleStyle: {
                  fontFamily: "Poppins-Bold",
                },
    
                headerLeft: () => (
                  <TouchableOpacity
                    onPress={() => {
                      router.back();
                    }}
                  >
                    <Ionicons name="close-outline" size={28} />
                  </TouchableOpacity>
                ),
              }}
            />
            <Stack.Screen
              name="(modals)/search"
              options={{
                presentation: "modal",
                title: "Search input goes here...",
                headerTitleAlign: "center",
                headerTitleStyle: {
                  fontFamily: "Poppins-Bold",
                },
                headerLeft: () => (
                  <TouchableOpacity
                    onPress={() => {
                      router.back();
                    }}
                  >
                    <Ionicons name="close-outline" size={28} />
                  </TouchableOpacity>
                ),
              }}
            />
          </Stack>
        );
      };
      return (
        <ClerkProvider
          publishableKey={EXPO_PUBLIC_CLERK_PUBLISHABLE_KEY}
          tokenCache={tokenCache}
        >
          <InitialLayout />
          <Toast />
        </ClerkProvider>
      );
    };
    
    export default RootLayout;
     
    

    我的包.json:

    {
      "name": "hair-oil-app",
      "version": "1.0.0",
      "main": "expo-router/entry",
      "scripts": {
        "start": "expo start",
        "android": "expo start --android",
        "ios": "expo start --ios",
        "web": "expo start --web"
      },
      "dependencies": {
        "@clerk/clerk-expo": "^1.0.0",
        "@types/react": "~18.2.45",
        "axios": "^1.7.2",
        "date-fns": "^3.6.0",
        "expo": "^51.0.7",
        "expo-constants": "^16.0.1",
        "expo-linking": "^6.3.1",
        "expo-router": "^3.5.14",
        "expo-secure-store": "^13.0.1",
        "expo-status-bar": "^1.12.1",
        "mongoose": "^8.3.2",
        "nativewind": "^2.0.11",
        "prop-types": "^15.8.1",
        "react": "18.2.0",
        "react-dom": "18.2.0",
        "react-native": "^0.74.1",
        "react-native-element-dropdown": "^2.12.0",
        "react-native-gesture-handler": "^2.16.2",
        "react-native-loading-spinner-overlay": "^3.0.1",
        "react-native-pager-view": "^6.3.0",
        "react-native-ratings": "^8.1.0",
        "react-native-reanimated": "^3.10.1",
        "react-native-safe-area-context": "^4.10.1",
        "react-native-screens": "^3.31.1",
        "react-native-snap-carousel": "^3.9.1",
        "react-native-star-rating-widget": "^1.7.3",
        "react-native-toast-message": "^2.2.0",
        "react-native-web": "~0.19.6",
        "tailwind-rn": "^4.2.0",
        "zustand": "^4.5.2"
      },
      "devDependencies": {
        "@babel/core": "^7.20.0",
        "tailwindcss": "^3.3.2"
      },
      "private": true
    }
    

    既然我是新手,如果你觉得这很愚蠢,请留下来,谢谢你。

    我想摆脱这个愚蠢的错误,因为我从一周开始就在处理它。请

    1 回复  |  直到 1 年前
        1
  •  0
  •   dev_ire    1 年前

    你的问题并不愚蠢,你试过新版的办事员吗?它奏效了