Problem with AI logo builder program

[SaeedP]

Hello,

In these lines of code, I have tried to create a logo builder program using DeepAI API. It seems that the program works, but the received image is not clear.

@page "/LogoBuilder"
@layout EmptyLayout

@inherits LayoutComponentBase

<div>
    <h3>LogoBuilder</h3>

    <SaeedMenu />



    <form>
        <div class="form-group">
            <label for="logoText">Enter your logo text:</label>
            <!-- Use @bind to bind the value of the input field to a property in our code-behind file -->
            <input type="text" class="form-control" id="logoText" @bind="@LogoText" />
        </div>

        <!-- Bind the click event of the "Generate Logo" button to a method in our code-behind file -->
        <button type="button" class="btn btn-primary" @onclick="@GenerateLogo">Generate Logo</button>
    </form>

    <!-- Display the generated logo image -->
    <div>
        @if (LogoImageUrl != null)
        {
            <img src="@LogoImageUrl" alt="Generated logo image" />
        }
    </div>
</div>

@code {

    // Define a property to store the user's input text
    private string LogoText { get; set; }
    // Define a property to store the URL of the generated logo image
    private string LogoImageUrl { get; set; }



    // Define a method to generate the logo using Deep AI
    private async Task GenerateLogo()
    {
        // Construct the request URL with the user's input text
        ////var apiUrl = $"https://api.deepai.org/api/text2img?text={LogoText}";

        var apiUrl = $"https://api.deepai.org/api/logo-generator?text={LogoText}";

        // Create a new HttpClient instance
        var httpClient = new HttpClient();

        // Add the Deep AI API key to the request headers
        httpClient.DefaultRequestHeaders.Add("api-key", "My_API_key");

        // Send a GET request to the Deep AI API with the user's input text
        var response = await httpClient.GetAsync(apiUrl);

        // Read the response content as a byte array
        var imageBytes = await response.Content.ReadAsByteArrayAsync();


        // Convert the byte array to a Base64-encoded string
        var base64String = Convert.ToBase64String(imageBytes);

        // Construct the data URL for the generated logo image
        LogoImageUrl = $"data:image/png;base64,{base64String}";
    }


}

Here is the result:

 

[Skydiver]

Are you sure that the response is really a PNG byte stream?

 

[SaeedP]

Are you sure that the response is really a PNG byte stream?

I am not entirely certain as this is my first time utilizing this API.

 

[Skydiver]

The response looks to be a JSON string...

$ curl \
>     -F 'text=YOUR_TEXT_URL' \
>     -H 'api-key:quickstart-QUdJIGlzIGNvbWluZy4uLi4K' \
>     https://api.deepai.org/api/logo-generator



{
    "id": "b3481151-8c24-40cb-851d-ecf73d949adc",
    "output_url": "https://api.deepai.org/job-view-file/b3481151-8c24-40cb-851d-ecf73d949adc/outputs/output.jpg"
}

when running the documentation example:

Logo Generator

Generate a logo concept image.

deepai.org

 

[Skydiver]

I am not entirely certain as this is my first time utilizing this API.

Considering that I don't even use that API, but I managed to find the documentation without having to get an API key, it would probably help if you look into the documentation first in the future.