Axios: छवि को बेस 64 में अनुरोध प्राप्त करने से कैसे बदलें

मुझे लगता है कि यह StackOverflow के लिए एक प्रश्न है।

समाधान खोजने वाले किसी भी व्यक्ति के लिए, मेरे पास निम्न कोड है:

get('/getImg', {
    responseType: 'arraybuffer' 
})
.then(function(result) {
    console.log(_imageEncode(result.data))
})

function _imageEncode (arrayBuffer) {
    let u8 = new Uint8Array(arrayBuffer)
    let b64encoded = btoa([].reduce.call(new Uint8Array(arrayBuffer),function(p,c){return p+String.fromCharCode(c)},''))
    let mimetype="image/jpeg"
    return "data:"+mimetype+";base64,"+b64encoded
}

यह हमारा समाधान था, यह एक आकर्षण की तरह काम करता है

return axios.get('http://example.com/image.png', { responseType: 'arraybuffer' })
      .then((response) => {
        let image = btoa(
          new Uint8Array(response.data)
            .reduce((data, byte) => data + String.fromCharCode(byte), '')
        );
        return `data:${response.headers['content-type'].toLowerCase()};base64,${image}`;
      });

कारण यह काम नहीं करेगा कि axios सब कुछ एक json ऑब्जेक्ट में रखता है। चूँकि आप बाइनरी को एक जोंस ऑब्जेक्ट में नहीं डाल सकते हैं, यह इसे एक स्ट्रिंग में बदल देता है जो बाइनरी को तोड़ देता है।

यह मेरे लिए एकदम सही काम किया:

function getBase64(url) {
  return axios
    .get(url, {
      responseType: 'arraybuffer'
    })
    .then(response => new Buffer(response.data, 'binary').toString('base64'))
}

यदि आप मेरी तरह नोड पर हैं और आप v >= 6 का उपयोग कर रहे हैं, तो एक परिवर्तन हुआ था और आपको Buffer.from या इसी तरह का उपयोग करना चाहिए।

function getBase64(url) {
  return axios
    .get(url, {
      responseType: 'arraybuffer'
    })
    .then(response => Buffer.from(response.data, 'binary').toString('base64'))
}

संदर्भ सुरक्षित-बफर
new Buffer()' was deprecated since v6. Use 'Buffer.alloc()' or 'Buffer.from()' (use 'https://www.npmjs.com/package/safe-buffer' for '<4.5.0') instead

@ शॉन-हिल क्या आपको पता है कि इसे छवि का पहला टोकन क्यों नहीं मिल रहा है? मुझे किसी कारण से data:image/png;base64, भाग दिखाई नहीं दे रहा है, जिससे बेस 64 डेटा अमान्य हो जाता है

मेरे लिए यह काम

function getImage(imageUrl) {
var options = {
    url: `${imageUrl}`,
    encoding: "binary"
};
  return new Promise(function (resolve, reject) {
    request.get(options, function (err, resp, body) {
        if (err) {
            reject(err);
        } else {
            var prefix = "data:" + resp.headers["content-type"] + ";base64,";
            var img = new Buffer(body.toString(), "binary").toString("base64");
            //  var img = new Buffer.from(body.toString(), "binary").toString("base64");
            var dataUri = prefix + img;
            resolve(dataUri);
        }
    })
})
}

function getImage(imageUrl) {
var options = {
    url: `${imageUrl}`,
    encoding: "binary"
};

    request.get(options, function (err, resp, body) {
        if (err) {
            reject(err);
        } else {
            var prefix = "data:" + resp.headers["content-type"] + ";base64,";
            var img = new Buffer(body.toString(), "binary").toString("base64");
           //  var img = new Buffer.from(body.toString(), "binary").toString("base64");
            var dataUri = prefix + img;
        }
    })
}

return axios.get('http://site.com/img.png', { responseType: 'arraybuffer' })
  .then(response => `data:${response.headers['content-type']};base64,${btoa(String.fromCharCode(...new Uint8Array(response.data)))}`);

return axios.get('http://site.com/img.png', { responseType: 'arraybuffer' })
  .then(response => `data:${response.headers['content-type']};base64,${btoa(String.fromCharCode(...new Uint8Array(response.data)))}`);

नोड संस्करण:

    return axios.get(url, { responseType: 'arraybuffer' }).then(res => {
      ;`data:${res.headers['content-type']};base64,${Buffer.from(String.fromCharCode(...new Uint8Array(res.data)), 'binary')
        .toString('base64')}`
    })

@voidpls
आपकी विधि त्रुटि का कारण बनती है!
Uncaught RangeError: Maximum call stack size exceeded

इसका कारण
toa(String.fromCharCode(...new Uint8Array(response.data)))

आप इस तस्वीर को आजमा सकते हैं