我多年来一直试图让它发挥作用,并尝试了许多不同的方法来让它发挥作用。我正在尝试在 Android 应用程序中获取使用 expo 50 创建的捆绑资源,对其进行 base64 编码,以便我可以使用它来创建 PDF。它在开发中运行良好,但在构建 APK 后它无法加载。我无法使用 expo 资产中的资产,因为我相信这是针对 sdk 51 的。我在其他地方找到了一些线程,说要在 asset[0].localUri 中提供的资源标识符前面添加 file:/// 或 file:///android_asset 或 file:///android_res 但这些变体都不起作用,问题不是 asset[0].localUri 未定义,而是我不知道如何使用此资源标识符通过文件系统访问资源。我尝试解压 APK 来查看文件结构,但它不像普通的 Android 应用程序,我看不到任何提及我尝试使用的任何图像,但是该应用程序还使用其他图像,例如启动画面等,即使它们确实有效,我也找不到它们。这是我正在尝试使用的屏幕的最小版本。我很感激任何帮助。
import { View, Text, StyleSheet, Alert, Button } from 'react-native';
import { useAssets } from 'expo-asset';
import * as FileSystem from 'expo-file-system';
import RNHTMLtoPDF from 'react-native-html-to-pdf';
const App = () => {
const [assets, error] = useAssets([require('./assets/images/your-image.png')]);
const [base64Image, setBase64Image] = useState(null);
useEffect(() => {
const loadBase64Image = async () => {
if (assets && assets[0]) {
try {
const asset = assets[0];
const uri = asset.localUri || asset.uri;
if (!uri) {
Alert.alert("Error", "Asset URI is not available.");
return;
}
const base64 = await FileSystem.readAsStringAsync(uri, {
encoding: FileSystem.EncodingType.Base64,
});
setBase64Image(base64);
} catch (e) {
Alert.alert("Error", `Exception in loadBase64Image: ${e.message}`);
}
}
};
loadBase64Image();
}, [assets]);
const generatePDF = async () => {
if (!base64Image) {
Alert.alert("Error", "Base64 image data is not available.");
return;
}
const htmlContent = `
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>PDF Document</title>
</head>
<body>
<h1>Base64 Image PDF Example</h1>
<img src="data:image/png;base64,${base64Image}" alt="Image" />
</body>
</html>
`;
const options = {
html: htmlContent,
fileName: 'test',
directory: 'Documents',
};
try {
const file = await RNHTMLtoPDF.convert(options);
Alert.alert('PDF Generated', `PDF saved to ${file.filePath}`);
} catch (e) {
Alert.alert("Error", `Failed to generate PDF: ${e.message}`);
}
};
return (
<View style={styles.container}>
<Text>Base64 Image PDF Example</Text>
<Button title="Generate PDF" onPress={generatePDF} />
</View>
);
};
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
padding: 20,
},
});
export default App;
您可能想使用 ImageManipulator expo 包。它具有 以 base64 格式保存图像的选项。