JavaScript中处理API返回二进制数据及Base64转换的教程

async function generateImageAndGetBinaryData(accessToken, query) {
    const model = "nai-diffusion-3"; // 示例模型
    const apiUrl = "https://api.novelai.net/ai/generate-image";

    try {
        const response = await fetch(apiUrl, {
            method: "POST",
            headers: {
                'Content-Type': 'application/json',
                'Authorization': `Bearer ${accessToken}`,
                'Accept': "*/*" // 接受所有类型响应
            },
            body: JSON.stringify({
                "input": `masterpiece, best quality, ${query}`,
                "model": model,
                "action": "generate",
                "parameters": {
                    "width": 768,
                    "height": 512,
                    "scale": 11,
                    "sampler": "k_dpmpp_2m",
                    "steps": 28,
                    "seed": Math.floor(Math.random() * 10000000000), // 随机种子
                    "n_samples": 1,
                    "ucPreset": 0,
                    "qualityToggle": true,
                    "sm": false,
                    "sm_dyn": false,
                    "dynamic_thresholding": false,
                    "controlnet_strength": 1,
                    "legacy": false,
                    "add_original_image": false,
                    "negative_prompt": "lowres, bad anatomy, bad hands, text, error, missing fingers, extra digit, fewer digits, cropped, worst quality, low quality, normal quality, jpeg artifacts, signature, watermark, username, blurry"
                }
            })
        });

        if (!response.ok) {
            const errorText = await response.text();
            throw new Error(`API error: ${response.status} - ${errorText}`);
        }

        // 关键一步：使用 response.arrayBuffer() 获取原始二进制数据
        const arrayBuffer = await response.arrayBuffer();
        console.log("Received ArrayBuffer:", arrayBuffer);
        return arrayBuffer;

    } catch (error) {
        console.error("Error generating image:", error);
        throw error;
    }
}

// 示例调用 (假设accessToken和query已定义)
// generateImageAndGetBinaryData(myAccessToken, "a beautiful landscape")
//     .then(buffer => {
//         // 在这里处理 arrayBuffer，例如转换为Base64或保存为文件
//     })
//     .catch(err => console.error(err));

/**
 * 将 ArrayBuffer 转换为 Base64 编码的字符串。
 * @param {ArrayBuffer} buffer 要转换的 ArrayBuffer。
 * @returns {string} Base64 编码的字符串。
 */
function arrayBufferToBase64(buffer) {
    let binary = '';
    const bytes = new Uint8Array(buffer);
    const len = bytes.byteLength;
    for (let i = 0; i < len; i += 1) {
        binary += String.fromCharCode(bytes[i]);
    }
    return btoa(binary); // btoa() 函数用于将二进制字符串编码为 Base64
}

// ... (fetch 请求部分保持不变) ...
    ).then(async (response) => {
        if (!response.ok) {
            const errorText = await response.text();
            throw new Error(`API error: ${response.status} - ${errorText}`);
        }
        // 获取 ArrayBuffer
        const arrayBuffer = await response.arrayBuffer();
        // 将 ArrayBuffer 转换为 Base64 字符串
        const base64Data = arrayBufferToBase64(arrayBuffer);

        // 在此处处理 base64Data，例如发送给客户端或保存
        console.log("Received Base64 data (first 100 chars):", base64Data.substring(0, 100) + "...");

        // 如果是在服务器端（如Koa/Express）处理，可以设置响应体
        // ctx.status = response.status;
        // ctx.body = base64Data;

        return base64Data;
    }).catch(error => {
        console.error("Failed to fetch or process image data:", error);
        throw error;
    });