Need Help with Image Download Functionality Using DALL-E API

I’m encountering an issue with downloading an image from my website. I’ve integrated the DALL-E API to allow users to generate an image, but I’m unsure how to enable them to download it. Additionally, I’ve tried using a download plugin, but it doesn’t seem to work in this scenario. Can anyone provide guidance on how to implement image downloads effectively in this context?
Also attaching screenshots for more clarity.


Solved this the other day with the help of AI and it’s a worthy share. You will need the Toolbox plugin and then on the icon click, you will do a Run Javascript action. Paste in the below and change my crude CAPITAL text to map the image.

fetch('THE URL OF THE IMAGE HERE')
.then(response => response.blob())
.then(blob => {
    const url = window.URL.createObjectURL(blob);
    const a = document.createElement('a');
    a.href = url;
    a.download = 'WHATEVER FILE NAME HERE'; // You can change the filename here
    a.click();
  });

I was using this for getting images directly from a Cloudflare R2 storage and that came with more challenges like CORS issues. I am unsure if OpenAI have restrictive CORS settings but I’m thinking it should probably work. Give it a spin.

Thanks for replying. I am trying to implement the same step as yours but it isn’t working . You can also check in the screenshots as well .
image
image
Also I have used the API key in the URL.

You shouldn’t use an API key here at all. Please delete that image or change your api key immediately to prevent bad actors. It needs to be the image URL that DALLE returns in that first bit. I just made an image with the DALLE api to see what returns.

It gave me a URL like this - https://oaidalleapiprodscus.blob.core.windows.net/private/org-VKVITy6TYlL8UVaLRGZfeRPn/user-JfXHz0h1RMJnl0aDRczsSXk5/img-7H9hsBpNkhw82LNUuFxiZJwn.png?st=2024-05-10T11%3A22%3A39Z&se=2024-05-10T13%3A22%3A39Z&sp=r&sv=2021-08-06&sr=b&rscd=inline&rsct=image/png&skoid=6aaadede-4fb3-4698-a8f6-684d7786b067&sktid=a48cca56-e6da-484e-a814-9c849652bcb3&skt=2024-05-09T18%3A43%3A29Z&ske=2024-05-10T18%3A43%3A29Z&sks=b&skv=2021-08-06&sig=t8CbWzUqvPp6Y3n0XYSLxDtd4wd/04VMfjZzDsCYGIo%3D. This is the URL that you would need to put in the top bit after fetch(‘https://oaidalleapiprodscus.blob.core.windows.net/private/org-VKVITy6TYlL8UVaLRGZfeRPn/user-JfXHz0h1RMJnl0aDRczsSXk5/img-7H9hsBpNkhw82LNUuFxiZJwn.png?st=2024-05-10T11%3A22%3A39Z&se=2024-05-10T13%3A22%3A39Z&sp=r&sv=2021-08-06&sr=b&rscd=inline&rsct=image/png&skoid=6aaadede-4fb3-4698-a8f6-684d7786b067&sktid=a48cca56-e6da-484e-a814-9c849652bcb3&skt=2024-05-09T18%3A43%3A29Z&ske=2024-05-10T18%3A43%3A29Z&sks=b&skv=2021-08-06&sig=t8CbWzUqvPp6Y3n0XYSLxDtd4wd/04VMfjZzDsCYGIo%3D’)

and then the rest.

Thank you, Stuart, for your assistance. Unfortunately, the method didn’t work. I’ll explore other alternatives.

This topic was automatically closed after 70 days. New replies are no longer allowed.