Hi, In this blog post, I'll show you how to create an image generation app using PHP and the OpenAI DALL-E 2 API. I'll show you how to set up the API and use it to generate images. This tutorial will give you everything you need to start creating your own image-generation app with PHP and DALL-E 2. We will use the Orhanerday OpenAI PHP client library for this project.
Get OpenAI API key
Read the complete instructions from the previous tutorial to get an OpenAI API key. You can also watch a video demonstration of this process.
Installing OpenAI PHP Library
Here, we will use the OpenAI PHP client library for API request handling. There are two ways to add a PHP library to your project. Both methods are already discussed in the previous OpenAI PHP tutorial.
API Request in PHP
Now, we have added the OpenAI PHP client library to our project. Let's make an API request to get a response from the DALL-E 2 model. Create an object by initializing the `OpenAI` class giving the API Key as a parameter. Also, get the `prompt` parameter value that we will send through HTTP request from JS using the POST method.
Instructions for Response Preparation
Create an associative array with some properties and their values that we will send to the model for response preparation. The purpose for each property is given below:
Prompt: This is your input query about which DALL-E 2 model will generate images for you. Write more comprehensive queries to get better results.
N: Number of images you want to get in response. Value of `n` goes from 1 to 10.
Size: It is the size of the response images. You can use 256x256, 512x512, or 1024x1024. Greater image size consumes more resources and will result in higher costs.
Response_format: We can get response image data in two formats, URL or base64. For URL, the value is `url` and for base64, the value is `b64_json`. Base64 consumes more resources than URL.
Use the `image` method of the OpenAI object with the array of all properties as a parameter to send the request. It will return the response on completion. We will extract the images from the response in javascript.
Now, when we will make a POST request to this PHP file with a prompt parameter from javascript, it will give us a response.
Javascript File for Project
Make a JS file for sending requests to PHP for image generation. Assign a function to the `onclick` event of the button. So the function will execute when the user clicks on the button. Make sure, the user has entered some query in the input field otherwise the model will return an error.
Create an object `FormData` to append the input query in the `prompt` parameter as given below. We will send this object to our PHP file.
Ajax Request
Make another object `XMLHttpRequest` for HTTP requests. Use `open()` method of the created object and pass three parameters. Give the PHP file path as the second parameter that will run on the HTTP request. The `send()` method will be used to send a request along with the data, as given below.
On Getting Response
Assign a function to the `onload` method of the HTTP object. So, this function will execute when response fetching is completed. Make the image container clear first, if you want. Then parse the JSON response and get the `data` key in the response. This key has all the images in an array. We need to iterate through the array to get each image. For that use `forEach` loop. We will get image data inside `forEach` function. If the response has image URL's then you can directly. But if it isbase64 string then add `data:image/jpeg;base64,` before the string. Create an image tag and give the image as a source and then append images in the image container. Images will be displayed on the web page.
Final Thoughts
In this post, we have created a simple image-generation app using the DALL-E 2 model of OpenAI in PHP. You have learned, how you can use OpenAI API and use of PHP client library. You can create more advanced applications with the help of OpenAI. It also provides image editing and text generation models. OpenAI is an advanced natural language processing system that is helping millions of users in many ways. You can also create an app on a new use case with the help of OpenAI.
