Source Code Examples

Introduction

Integrating OpenAI's ChatGPT with a Spring Boot application allows you to leverage powerful natural language processing capabilities. This tutorial will guide you through setting up a Spring Boot project and configuring it to interact with OpenAI's GPT models to generate responses. By the end of this tutorial, you'll have a functional application that can interact with ChatGPT.

1. Setting Up the Project

Step 1: Create a New Spring Boot Project

Use Spring Initializr to create a new Spring Boot project. Include dependencies for Spring Web and Spring AI.

Using Spring Initializr:

Go to start.spring.io
Select:
- Project: Maven Project
- Language: Java
- Spring Boot: 3.0.0 (or latest)
- Dependencies: Spring Web
Generate the project and unzip it.

Step 2: Add Spring AI Dependency

Add the spring-ai-openai-spring-boot-starter dependency to your pom.xml:

<dependency>
    <groupId>org.springframework.ai</groupId>
    <artifactId>spring-ai-openai-spring-boot-starter</artifactId>
    <version>1.0.0</version>
</dependency>

2. Configuring the Spring Boot Starter

Step 1: Add API Key to Configuration

Create a application.properties or application.yml file in your src/main/resources directory and add your OpenAI API key.

For application.properties:

openai.api.key=your_openai_api_key

For application.yml:

openai:
  api:
    key: your_openai_api_key

Step 2: Create a Configuration Class

Create a configuration class to set up the OpenAI client.

package com.example.demo.config;

import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.ai.openai.OpenAiClient;

@Configuration
public class OpenAiConfig {

    @Bean
    public OpenAiClient openAiClient() {
        return new OpenAiClient();
    }
}

3. Implementing the ChatGPT Integration

Example: Text Generation

Create a service to handle text completions using the ChatGPT API.

Service:

package com.example.demo.service;

import org.springframework.ai.openai.OpenAiClient;
import org.springframework.ai.openai.model.CompletionRequest;
import org.springframework.ai.openai.model.CompletionResponse;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;

@Service
public class ChatGPTService {

    @Autowired
    private OpenAiClient openAiClient;

    public String generateResponse(String prompt) {
        CompletionRequest request = new CompletionRequest();
        request.setPrompt(prompt);
        request.setMaxTokens(150);

        CompletionResponse response = openAiClient.createCompletion(request);
        return response.getChoices().get(0).getText();
    }
}

Controller:

package com.example.demo.controller;

import com.example.demo.service.ChatGPTService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.RestController;

@RestController
public class ChatGPTController {

    @Autowired
    private ChatGPTService chatGPTService;

    @GetMapping("/generateResponse")
    public String generateResponse(@RequestParam String prompt) {
        return chatGPTService.generateResponse(prompt);
    }
}

4. Creating a Simple Frontend

For demonstration purposes, we will create a simple HTML page that allows users to interact with ChatGPT.

Step 1: Create an HTML File

Create an index.html file in the src/main/resources/static directory.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>ChatGPT Integration</title>
</head>
<body>
    <h1>ChatGPT Integration</h1>
    <div>
        <textarea id="prompt" rows="4" cols="50" placeholder="Type your message here..."></textarea><br>
        <button onclick="generateResponse()">Send</button>
    </div>
    <div id="response"></div>

    <script>
        function generateResponse() {
            const prompt = document.getElementById('prompt').value;
            fetch(`/generateResponse?prompt=${encodeURIComponent(prompt)}`)
                .then(response => response.text())
                .then(data => {
                    document.getElementById('response').innerText = data;
                });
        }
    </script>
</body>
</html>

5. Testing the Integration

Step 1: Run the Application

Run your Spring Boot application. Ensure the application starts without errors.

Step 2: Access the ChatGPT Interface

Open your browser and navigate to http://localhost:8080. You should see the simple chat interface. Type a message and click "Send" to interact with ChatGPT.

Conclusion

This tutorial demonstrated how to set up and integrate OpenAI's ChatGPT with a Spring Boot application. You learned how to create a service and controller for generating responses using ChatGPT, and how to create a simple frontend to interact with the AI model. This setup provides a foundation for building more complex and feature-rich AI applications. Explore further customization and enhancements to leverage the full potential of ChatGPT in your Spring Boot projects.

Spring AI