WhiskeySockets / Baileys

Lightweight full-featured typescript/javascript WhatsApp Web API
https://baileys.whiskeysockets.io/
MIT License
3.92k stars 1.34k forks source link

[BUG] Stickers not Rendering on WhatsApp Mobile #521

Closed CSFelix closed 10 months ago

CSFelix commented 11 months ago

Describe the bug

When sending stickers, they are sent normally to WhatsApp Web (image 1), but they do not render on WhatsApp Mobile App (image 2)

image


image


To Reproduce

Steps to reproduce the behavior:

  1. Create a new connection;
  2. Send an image as a sticker, regardless of whether it is in buffer or stream format, the problem happens in both situations.

Code to Send Image as Sticker (Buffer Method)

let options: AnyMessageContent;
options = {
  sticker: fs.readFileSync(media.path),
  isAnimated: false
};

await client.sendMessage(
  <JID>,
  { ...options }
);

Code to Send Image as Sticker (Stream Method)

let options: AnyMessageContent;
options = {
  sticker: { stream: fs.createReadStream(media.path) },
  isAnimated: false
};

await client.sendMessage(
  <JID>,
  { ...options }
);

Expected behavior

The stickers should have been normally rendered on both platforms: Web and Mobile App.


Environment (please complete the following information):

It is running on localhost (Windows 11);
const { version, isLatest } = await fetchLatestBaileysVersion();

client = makeWASocket({
  version,
  logger: loggerBaileys,
  printQRInTerminal: false,
  auth: state as AuthenticationState,
  generateHighQualityLinkPreview: false,
  shouldIgnoreJid: jid => isJidBroadcast(jid),
  browser: ["BestZap", "Chrome", "10.15.7"],
  syncFullHistory: true,
  patchMessageBeforeSending: message => {
     const requiresPatch = !!(
       message.buttonsMessage || message.listMessage
     );
     if (requiresPatch) {
       message = {
         viewOnceMessage: {
           message: {
             messageContextInfo: {
               deviceListMetadataVersion: 2,
               deviceListMetadata: {}
             },
             ...message
           }
         }
       };
     }
     return message;
   }
});
No, only my personal WhatsApp is connected on Baileys
No proxy
fauzanfebrian commented 10 months ago

i face this issue too, is there a way to fix it?

CSFelix commented 10 months ago

i face this issue too, is there a way to fix it?

I'm afraid but I did not get to work around this yet 😞

fauzanfebrian commented 10 months ago

i face this issue too, is there a way to fix it?

I'm afraid but I did not get to work around this yet 😞

i fix it with this npm package wa-sticker-formatter because whatsapp need its metadata so that package will attach the metadata to the buffer

CSFelix commented 10 months ago

i face this issue too, is there a way to fix it?

I'm afraid but I did not get to work around this yet 😞

i fix it with this npm package wa-sticker-formatter because whatsapp need its metadata so that package will attach the metadata to the buffer

I did not work for me 😞. The stickers look ok on WhatsApp Web, but the problem remains on WhatsApp App for Mobiles.

Did you just installed the package or made modifications in the code?

fauzanfebrian commented 10 months ago

i face this issue too, is there a way to fix it?

I'm afraid but I did not get to work around this yet 😞

i fix it with this npm package wa-sticker-formatter because whatsapp need its metadata so that package will attach the metadata to the buffer

I did not work for me 😞. The stickers look ok on WhatsApp Web, but the problem remains on WhatsApp App for Mobiles.

Did you just installed the package or made modifications in the code?

you should convert the buffer with that package, did you?

if you want to look how do i implement it just go to my repo.

CSFelix commented 10 months ago

i face this issue too, is there a way to fix it?

I'm afraid but I did not get to work around this yet 😞

i fix it with this npm package wa-sticker-formatter because whatsapp need its metadata so that package will attach the metadata to the buffer

I did not work for me 😞. The stickers look ok on WhatsApp Web, but the problem remains on WhatsApp App for Mobiles. Did you just installed the package or made modifications in the code?

you should convert the buffer with that package, did you?

if you want to look how do i implement it just go to my repo.

It worked, thank you very much!!!!!!!!!!

CSFelix commented 10 months ago

For the readers, this is the version of my code that works

import Sticker, { StickerTypes } from "wa-sticker-formatter";

const stickerFile = fs.readFileSync(media.path); // media is an Express.Multer.File
const stickerBuffer = Buffer.from(stickerFile);

const sticker = new Sticker(stickerBuffer, {
  quality: 50,
  type: StickerTypes.CROPPED,
  author: "",
  pack: ""
});

const stickerMedia = await sticker.toBuffer();

options = {
  sticker: stickerMedia,
  fileName: media.originalname,
  isAnimated: false
};

const sentMessage = await wbot.sendMessage(
 <JID>,
 { ...options }
);