Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[📚] Why is it not documented at all that you can access an image using the path without using getDownloadURL() #8200

Open
markwitt1 opened this issue Dec 22, 2024 · 1 comment

Comments

@markwitt1
Copy link

markwitt1 commented Dec 22, 2024

import { Image, type ImageProps } from "expo-image";
import { memo } from "react";
import storage from "@react-native-firebase/storage";
import { useAuth } from "@/hooks/useAuth";

// Initialize Firebase Storage and get bucket URL once
const STORAGE_BUCKET = storage().app.options.storageBucket;
const STORAGE_BASE_URL = `https://firebasestorage.googleapis.com/v0/b/${STORAGE_BUCKET}/o`;

interface FirebaseImageProps extends Omit<ImageProps, "source"> {
	path: string;
}

function FirebaseImage({ path, recyclingKey, ...props }: FirebaseImageProps) {
	const { idToken } = useAuth();

	const downloadUrl = `${STORAGE_BASE_URL}/${encodeURIComponent(path)}?alt=media`;

	return (
		<Image
			source={{
				uri: downloadUrl,
				cacheKey: `firebase-image-${path}`,
				headers: {
					Authorization: `Bearer ${idToken}`,
				},
			}}
			recyclingKey={recyclingKey || `firebase-image-${path}`}
			placeholderContentFit="cover"
			cachePolicy="memory-disk"
			onError={(e) => {
				console.log("Image loading error:", { path, error: e });
			}}
			{...props}
		/>
	);
}

export default memo(FirebaseImage);

I tried this code out and it works, but it feels weird that this approach is documented nowhere. Is there a reason for this? I am not feedling confident to put this into production

@mikehardy
Copy link
Collaborator

const STORAGE_BASE_URL = https://firebasestorage.googleapis.com/v0/b/${STORAGE_BUCKET}/o;

Behind the scenes the whole Firebase system is a bunch of REST APIs in the cloud, and the native SDKs just wrap those and then we do our best here in react-native-firebase to expose under the firebase-js-sdk API surface area...but at it's heart it's just a bunch of REST APIs, so things are pretty regular.

But what happens next year when you're on a new project and storage finishes it's (hypothetical!) migration from v0 to v1 ? Or they alter their URL (which I think they did recently) from firebasestorage.googleapis.com to something else for some unimportant google-network-management reason that the SDKs would take care of for you?

I would use the documented functions vs hand-crafting the URL personally, as a maintenance issue

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants