gnusraun

Egov chat GPT 적용하기 본문

Backend/Egov

Egov chat GPT 적용하기

gnusraun 2023. 5. 19. 14:08
728x90

chat GPT를 사용하기 위해 open ai 사이트에서 API key를 발급하여 웹 서비스에 적용해 보자

대략 3개월 까지는 무료인거 같다.

 

1. open ai API key 발급

chat gpt 사용하기 위해서는 open ai API key를 발급해야 사용 할 수 있다.

 

https://platform.openai.com/account/api-keys

 

OpenAI API

An API for accessing new AI models developed by OpenAI

platform.openai.com

 

회원가입 > 로그인 > 맨 오른쪽 상단 본인 계정 클릭 > View API keys > Create new secret key > create secet key

Open AI 로그인 후 화면

create secret 이후 반드시 키 값은 따로 저장해야 한다. 한번 생성된 키는 다시 확인하는게 불가능하다.

API key 발급 화면

만약 key 발급 후 왼쪽 메뉴에서 Usage 클릭 후 Expires 오늘 날짜 이전일 경우 아쉽게도 무료 사용은 불가능하다.

API key 만료일 확인

 

 

2. Java 코드 작성하기

JsonObject, JsonArray 사용을 위해 json-simple 라이브러리 추가

:: pom.xml

<!-- https://mvnrepository.com/artifact/com.googlecode.json-simple/json-simple -->
<!-- json simple -->
<dependency>
    <groupId>com.googlecode.json-simple</groupId>
    <artifactId>json-simple</artifactId>
    <version>1.1</version>
</dependency>

 

 

:: OpenAI.java

API_KEY에 발급 받은 데이터 넣기

파라미터는 질문 내용을 문자로 지정하면 된다.

package egovframework.example.cmmn.api;

import java.io.BufferedReader;
import java.io.InputStreamReader;
import java.io.OutputStream;
import java.net.HttpURLConnection;
import java.net.URL;

public class OpenAI {

	// API key (발급 받은 key 넣기)
	private static String API_KEY = "";
	// open AI 주소
	private static String OPEN_AI_URL = "https://api.openai.com/v1/completions";
	// token 최대값 (입력과 출력된 문자의 수를 token수로 변환하여 그 수 만큼 답변해줌)
	private static int TOKEN_MAX_LEN = 1000;
	
	// JSON을 이용하여 응답 받기
	public static String callChatGPT(String prompt) {
		
		try {
			URL url = new URL(OPEN_AI_URL);
			HttpURLConnection httpURLConnection = (HttpURLConnection) url.openConnection();
			httpURLConnection.setRequestMethod("POST");
			httpURLConnection.setRequestProperty("Content-Type", "application/json; utf-8");
			httpURLConnection.setRequestProperty("Authorization", "Bearer " + API_KEY);		
			httpURLConnection.setDoOutput(true);
			
			// prompt 질문 내용
			String input = "{\"model\": \"text-davinci-003\", \"prompt\": \"" + prompt + "\",\"max_tokens\" : " + TOKEN_MAX_LEN + "}";
			
			try (OutputStream os = httpURLConnection.getOutputStream()) {
				byte[] inputBytes = input.getBytes("utf-8");
				os.write(inputBytes, 0, inputBytes.length);
			}
			
			int resCode = httpURLConnection.getResponseCode();
			
			try (BufferedReader br = new BufferedReader(new InputStreamReader(httpURLConnection.getInputStream(), "utf-8"))) {
				StringBuilder res = new StringBuilder();
				String resLine = null;
				
				while ((resLine = br.readLine()) != null) {
					res.append(resLine.trim());
				}
				
				return (res.toString());
			}
		} catch (Exception e) {
			e.printStackTrace();
		}
		
		return "";
	}
	
}

 

 

:: Controller

ModelAndView를 이용하여 데이터 값 반환

/**
 * open AI 응답하기
 * @param map
 * @return
 */
@RequestMapping(value="/openAI.do")
@ResponseBody
public ModelAndView openAI(@RequestParam Map<String, Object> map) throws Exception {

    ModelAndView mv = new ModelAndView("jsonView");
    JSONParser jsonParser = new JSONParser();

    String prompt = String.valueOf(map.get("prompt"));

    // ChatGPT call
    String res = OpenAI.callChatGPT(prompt);
    Object obj = jsonParser.parse(res);
    JSONObject jsonObject = (JSONObject) obj;

    mv.addObject("jsonObject", jsonObject);

    return mv;

}

 

 

:: Jsp

검색 버튼에 해당 메소드를 클릭 이벤트로 지정

data는 propmt key로 검색한 문자를 담아 전달 이후 #chatArea <textarea> 태그에 결과값 표출했다.

** 무료버전이어서 그런지 응답시간은 대략 4~8초 정도 소요 되는거 같다. 

<input type="text" id="chatText" />
<textarea id="chatArea"></textarea>
<button type="button" onclick="chatGPTsend();">검색</button>

// chatGPT 전송
function chatGPTsend() {
	$.ajax({
	    url: "/openAI.do",
	    type: 'POST',
	    data: { "prompt": $("#chatText").val() }
	    success: function(res) {
	   		var data = res.jsonObject;
	   		if(data['choices']){
				$("#chatArea").val(data['choices'][0].text);
	   		}
	    },
	    error: function(xhr, status, error) {
	        console.error(xhr.responseText);
	    }
	});
}

 

 

:: 결과 화면

검색 화면 로딩 중
결과 화면

 

 

출처 - https://djlee118.tistory.com/806

728x90

'Backend > Egov' 카테고리의 다른 글

Egov Jsoup (Crawling)  (0) 2023.06.04
Egov Websocket Messenger  (0) 2023.05.31
Egov maven install JRE rather than a JDK?  (0) 2023.05.19
Egov jsonView를 이용하여 ajax 사용하기  (0) 2023.05.19
Egov 파일 업로드/다운로드  (0) 2023.05.17