Получить изображение с помощью fetch API и сохранить через модуль fs

С помощью этой функции я могу загружать любые файлы, содержащие текст, но я также хочу загружать изображения, такие как .png и .jpg.

Как мне это сделать с помощью выборки?

async function fetchGithubFileContent(url) {
    let res = await fetch(url).then((res) => res.text())
    window.electronAPI.writeFile({ content: res, fileName: "res.js" })
}

async function writeFile({ content, fileName }) {
    fs.writeFile(path.join(__dirname, fileName), content, () => console.info(`successfully saved ${fileName}`))
}

fetchGithubFileContent("https://raw.githubusercontent.com/Tetrax-10/Nord-Spotify/master/src/nord.js")

Если это невозможно с помощью fetch, возможно ли это с помощью axios?

Разберите ответ как большой двоичный объект.

morganney 18.12.2022 15:23

не работает пишет Uncaught (in promise) Error: An object could not be cloned.

Raghavan Vidhyasagar 18.12.2022 15:37
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
2
2
58
2
Перейти к ответу Данный вопрос помечен как решенный

Ответы 2

Я отвечаю на свои собственные вопросы, поскольку я решил это через час.

import { Buffer } from "buffer"

async function writeFile({ content, fileName }) {
    fs.writeFile(path.join(__dirname, fileName), content, () => console.info(`successfully saved ${fileName}`))
}

async function writeImage({ binaryData, fileName }) {
    let formatedBinaryData = binaryData.replace(/^data:image/\w+;base64,/, "")
    let buffer = Buffer.from(formatedBinaryData, "base64")
    await writeFile({ content: buffer, fileName: fileName })
}

async function imageUrlToBase64(url) {
    let response = await fetch(url)
    let blob = await response.blob()
    return new Promise((onSuccess, onError) => {
        try {
            const reader = new FileReader()
            reader.onload = function () {
                onSuccess(this.result)
            }
            reader.readAsDataURL(blob)
        } catch (error) {
            onError(error)
        }
    })
}

async function downloadGithubImage(url) {
    let base64 = await imageUrlToBase64(url)
    let fileName = url.split("/").pop()
    window.electronAPI.writeImage({ binaryData: base64, fileName: fileName })
}

downloadGithubImage("https://raw.githubusercontent.com/Tetrax-10/Spicetify-Themes/master/assets/home.png")
Ответ принят как подходящий

Другой метод — использование потоков узлов (лучший метод).

import https from "https"
const { pipeline } = require("stream/promises")
import path from "path"
import fs from "fs"

async function download(url) {
    return new Promise(async (onSuccess) => {
        https.get(url, async (res) => {
            let fileName = url.split("/").pop()
            const fileWriteStream = fs.createWriteStream(path.join(__dirname, fileName), {
                autoClose: true,
                flags: "w",
            })
            await pipeline(res, fileWriteStream)
            onSuccess("success")
        })
    })
}

await download("https://raw.githubusercontent.com/Tetrax-10/Spicetify-Themes/master/assets/artist-2.png")

Другие вопросы по теме