How to attach image to slash command response discord.js v13

Viewed 2289

I'm making a bot that has slash commands and I want to attach a file, no message, only an image file. I tried doing this, but it ends up giving me an empty message error.

const attachment = new MessageAttachment("image.bmp");
client.api.interactions(interaction.id, interaction.token).callback.post({
    data: {
        type: 4,
        data: {
            files: [attachment]
        }
    }
})

So my question is, how do I attach an image with this JSON format discord interaction?

UPDATE: I currently have this, which still doesn't work, but gives me this.

const file = new MessageAttachment (
                "image.bmp"
            );

client.api.interactions(interaction.id, interaction.token).callback.post({
                data: {
                    type: 4,
                    data: {
                        content: "hello",
                        "embeds": [
                            {
                            "title": `This is a cool embed`,
                            image: {
                                url: 'attachment://image.bmp',
                            },
                            "type": "rich",
                            "description": "",
                            "color": 0x00FFFF
                            }
                        ]
                    },
                }
            })
1 Answers

With Discord.js V13, use a combination of await interaction.deferReply(); to allow the command more time to work, then you can use await interaction.editRepy({ files: [attatchment] }); to update the deferReply(); with your attatchment. An example slash command would look something like this in a slash command handler:

const file = new MessageAttachment("image.bmp"); // Tho I'm not sure Discord supports bitmap files :/

client.api.interactions(interaction.id, interaction.token).callback.post({
               data: {
                   type: 4,
                   data: {
                       content: "hello",
                       embeds: [
                           {
                           title: `This is a cool embed`,
                           image: {
                               url: file.url,
                           },
                           color: 0x00FFFF
                           }
                       ]
                   },
               }
           })

// Old answer:
/* const { SlashCommandBuilder } = require('@discordjs/builders');
const { MessageAttachment } = require('discord.js')

module.exports = {
   data: new SlashCommandBuilder()
       .setName('attachment')
       .setDescription('Upload a file')
       .addAttachmentOption(option => option.setName('attachment').setDescription('Upload an attachment')),

   async execute(interaction) {
       let attachment = await interaction.options.getAttachment('attachment');

       await interaction.deferReply(); // Deffer Reply so we have more time

       console.log(attachment.url) // You can see URL, which is what we will use later
       console.log(attachment.contentType) // See the file type

       attachment = await new MessageAttachment(attachment.url, 'image.png'); // Converting URL to image as well as naming the file/assigning the file type

       await interaction.editReply( // Sending the image
           {
               files: [attachment]
           }
       )
   },
}; */

Hope this helps! :D

Related