Base64 String to pdf JavaScript React Native 然后下载

Question

我有一个 base64 字符串如下：

我希望将此 base64 字符串（或任何 base64 字符串）转换为 pdf，然后在 React Native 中下载。我正在为此使用博览会。我找遍了所有地方，找不到答案。

Answer 1

如果你只想在 react-native.The react-native-pdf 包中显示 pdf，可以像这样 job.Use 源对象。

const source = {uri:"data:application/pdf;base64,JVBERi0xLjcKJc..."};

如果你想下载base64转pdf文件，也很简单

var RNFetchBlob = require('react-native-fetch-blob').default;

const DocumentDir = RNFetchBlob.fs.dirs.DocumentDir;
let pdfLocation = DocumentDir + '/' + 'test.pdf';
RNFetchBlob.fs.writeFile(pdfLocation, pdf_base64Str, 'base64');

export async function downloadFile(url){
    let binary = await getPdfBinary(url);
    const base64Str = base64_encode(binary);
    const DocumentDir = RNFetchBlob.fs.dirs.DocumentDir;
    let pdfLocation = DocumentDir + '/' + 'test.pdf';
    RNFetchBlob.fs.writeFile(pdfLocation, base64Str, 'base64');
}

抱歉，我没有注意到您正在使用 expo。因为我从来没有在世博会上写过关于文件系统部分的代码。经过多次尝试，终于成功了。但仅限 android。我认为您可能希望将 pdf 文件保存到外部存储路径，以便用户可以在文件应用程序中看到它。但是对于 ios 来说，很难达到。一种可能的方法是使用共享对话框。如果你只想将pdf文件保存到应用程序中的文档文件夹中（用户看不到），FileSystem.writeAsStringAsync就足够了！希望对你有帮助！

import * as  FileSystem from 'expo-file-system';
import { Platform } from 'react-native';

async function getPdfBinary(url) {
    return new Promise((resolve, reject) => {
        var xhr = new XMLHttpRequest();
        xhr.open("GET", url, true);
        xhr.responseType = "arraybuffer"; // get the binary 
        xhr.setRequestHeader('content-type', 'application/json');
        xhr.onload = function (event) {
            var arrayBuffer = xhr.response;
            var byteArray = new Uint8Array(arrayBuffer);
            var len = byteArray.byteLength;
            var binary = ""
            for (var i = 0; i < len; i++) {
                binary += String.fromCharCode(byteArray[i]);
            }
            resolve(binary);
        }
        xhr.send();
    })
}

function base64_encode(str) {
    var c1, c2, c3;
    var base64EncodeChars = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/";
    var i = 0,
        len = str.length,
        string = '';

    while (i < len) {
        c1 = str.charCodeAt(i++) & 0xff;
        if (i == len) {
            string += base64EncodeChars.charAt(c1 >> 2);
            string += base64EncodeChars.charAt((c1 & 0x3) << 4);
            string += "==";
            break;
        }
        c2 = str.charCodeAt(i++);
        if (i == len) {
            string += base64EncodeChars.charAt(c1 >> 2);
            string += base64EncodeChars.charAt(((c1 & 0x3) << 4) | ((c2 & 0xF0) >> 4));
            string += base64EncodeChars.charAt((c2 & 0xF) << 2);
            string += "=";
            break;
        }
        c3 = str.charCodeAt(i++);
        string += base64EncodeChars.charAt(c1 >> 2);
        string += base64EncodeChars.charAt(((c1 & 0x3) << 4) | ((c2 & 0xF0) >> 4));
        string += base64EncodeChars.charAt(((c2 & 0xF) << 2) | ((c3 & 0xC0) >> 6));
        string += base64EncodeChars.charAt(c3 & 0x3F)
    }
    return string
}


const downloadForAos = async (pdfBase64Str) => {
    const folder = FileSystem.StorageAccessFramework.getUriForDirectoryInRoot("test");
    const permissions = await FileSystem.StorageAccessFramework.requestDirectoryPermissionsAsync(folder);
    if (!permissions.granted) return;

    let filePath = await FileSystem.StorageAccessFramework.createFileAsync(permissions.directoryUri, "test.pdf", "application/pdf");
    // let filePath = "content://com.android.externalstorage.documents/tree/primary%3Atest/document/primary%3Atest%2Ftest.txt";
    console.log(pdfBase64Str, "====");
    try {
        await FileSystem.StorageAccessFramework.writeAsStringAsync(filePath, pdfBase64Str, { encoding: FileSystem.EncodingType.Base64 });
        alert("download success!")
    } catch (err) {
        console.log(err);
    }
}

const downloadForIos = async () => {
    alert("try do it by yourself")
}

export async function downloadPdf(url) {
    let binary = await getPdfBinary(url);
    console.log(binary, "=====")
    const base64Str = base64_encode(binary);
    if (Platform.OS === "ios") {
        downloadForIos(base64Str);
    } else {
        downloadForAos(base64Str);
    }
}

Base64 String to pdf JavaScript React Native 然后下载

Base64 String to pdf JavaScript React Native then download

pdf

base64

react-native