JSFiddle - React, Tailwind, and code Playground

by velo_ninja

HTML

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>OpenAI API Example</title>
</head>
<body>
    <script>
        const openaiApiKey = 'your_openai_api_key'; // Replace with your actual OpenAI API key

        fetch('https://api.openai.com/v1/images/edit', {
            method: 'POST',
            headers: {
                'Authorization': `Bearer ${openaiApiKey}`,
            },
            body: JSON.stringify({
                model: 'dall-e-2',
                image: 'data:image/png;base64,YourBase64ImageString', // Replace with your base64-encoded image string
                mask: 'data:image/png;base64,YourBase64MaskString', // Replace with your base64-encoded mask string
                prompt: 'A sunlit indoor lounge area with a pool containing a flamingo',
                n: 1,
                size: '1024x1024',
            })
        })
        .then(response => response.json())
        .then(data => {
            const imageUrl = data.data[0].url;
            console.log('Image URL:', imageUrl);
        })
        .catch(error => {
            console.error('Error making request to OpenAI API:', error);
        });
    </script>
</body>
</html>

JavaScript

//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
//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

//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
//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





//model: 'gpt-3.5-turbo',
                //messages: [{ role: 'user', content: 'Say this is a test!' }],
                //temperature: 0.7