Automattic / Automattic/node-canvas

How to use loadImage with a GIF?

Open
#1,861 3 comments 0 reactions 0 assignees View on GitHub
Question
Dominant language
JavaScript
Stars
10.7k
Forks
1.2k
Avg merge
4d 8h
Merged PRs (30d)
1

Description

I have `giflib` installed on my mac. I'm not sure how to use GIF with the library, it doesn't log any error, GIF is not being served in the browser.

Steps to Reproduce
```
app.get('/media', function(req, res) {


const { createCanvas, loadImage, giflib } = require('canvas')

const canvas = createCanvas(600, 400)
const ctx = canvas.getContext('2d')

const gifPath = loadImage('https://www.hubspot.com/hubfs/Smiling%20Leo%20Perfect%20GIF.gif')

gifPath.then((image) => {
// do something with image

canvas.toBuffer((err2, buf) => {
if (err2) {
console.log("To Buffer Error>>>>>>", err2)
}
else
{
res.writeHead(200, {'Content-Type': 'image/gif'});
res.end(buf, 'binary');
}

}, 'image/gif', { quality: 0.95 })

}).catch(err => {
console.log('oh no!', err)
})

})
```

## Your Environment
Canvas Version - canvas@2.8.0
Environment - Mac OS Big Sur 11.1

Contributor guide

No contributing guide indexed for this repository

Research direction

No repository file or test is named. Start by running the supplied app.get('/media') reproduction with canvas@2.8.0 and inspect the loadImage and canvas.toBuffer path. Done means the GIF URL is handled as intended and the response is served with verified GIF output, or the supported usage and limitation are documented.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, macos, nodejs
Domain
backend, web-dev
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
25/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.