Skip to content

Use the Chat GPT API and LineBot messaging API to make the chatting room alive.

Notifications You must be signed in to change notification settings

KuanChunChen/Chat-gpt-with-line-bot-messaging-exmaple

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

3 Commits
 
 
 
 

Repository files navigation

[2023][ChatGPT][Open AI][Kotlin][懶人包教學]一步一步帶你把ChatGPT串進你的LineBot聊天室

前導:和ChatGPT聊聊天吧

1.註冊帳號,點擊Sign Up註冊: ChatGPT 登入頁面



2.建立你的Account



3.開始聊聊天,在下面對話框輸入你要問的問題



4.像是...2023年WBC經典賽冠軍預測



5.或是...怎麼用Kotlin寫一個預測的程式呢?

⬆看起來chatGPT給了一段給身高預測體重的範例,看起來有模有樣

這個那麼厲害的AI我們都知道能夠問他千奇百怪的問題,那要怎麼為你所用呢?我們接著看下去...

試著串接ChatGPT API吧

1.註冊一個賬號並獲取API keys: OpenAI 登入頁面


⬆點擊進入後右上角 頭像點進後會有如上圖樣式,點擊View API keys即可



⬆點擊Create new Security key,這個Key是你之後呼叫API使用要確認你身份的一把Key

2.接著你可以看官方api文件: OpenAI api文件

看文件介紹怎麼串,再照文件上說明去串



不過若是對curl或api請求稍微有經驗了,可以直接找到官方提供的curl範例,去改成你熟悉的語言請求



  
  curl https://api.openai.com/v1/completions \
  -H "Content-Type: application/json" \
  -H "Authorization: Bearer $YOUR_API_KEY" \
  -d '{"model": "text-davinci-003", "prompt": "Say this is a test", "temperature": 0, "max_tokens": 7}'
  
  

⬆ 快速介紹一下上面這段curl的含義
1. 我們要發送request的url是https://api.openai.com/v1/completions
2. 如果要拆成更細可以看成前段https://api.openai.com/ domain name
跟後段API接口 v1/completions
3. 中間-H的部分是Header
Content-Type: application/json主要用途為我們request body的格式要為json
Authorization: Bearer $YOUR_API_KEY 這個則是你要使用OpenAI提供的API你必需要輸入一個驗證API key
也就是我們前面產生的key
4. -d '{....}' 最後面-d是要傳給接口的json格式,{}框框內即要傳的json內容
5. 簡單json key解釋:
model :為chatGPT的模型,官方有提供不同種的模型供串接者使用,
每個都有最大token,或是收費,甚至可靠性不一,可以自己根據文件來測試: GPT-3 model文件

prompt:就是你要問的問題,跟前面你直接輸入到chatGPT網頁版的聊天室一樣,
只是現在變成你自己用程式去發請求
max_tokens: 則是你想要這次請求最多可以幾個tokens限制,
因為官方應該是用tokens數字來收費,
所以可能可以透過max_tokens來限制,
每次的請求,可能是讓有長期規劃使用該api的人可以控制流量吧?

(這邊的tokens只是官方用來計算流量計費的一種方式,並非常見用token來驗證的那種token)

3.至此,你已經取得串接OpenAI接口所需的東西了...

可以開始使用你熟悉的語言來開發API了

串接 OpenAI API 的 Kotlin 程式

val gptAPI = OkHttpHelper.http(ChatGptConfig.httpChatGptServer).create(ChatGptAPI::class.java)
          val promptText = messageText?.replace(MessageCommand.ChatGptAsk.command, "")
          println("promptText:${promptText}")
          val request = ChatGptCompletionRequest().apply {
              prompt = promptText
              model = "text-ada-001"
          }
          gptAPI.chatGptCompletion("Bearer ${ChatGptConfig.openAPIKey}", request = request).enqueue(object :
              Callback<ChatGptCompletionResult> {
              override fun onResponse(
                  call: Call<ChatGptCompletionResult>,
                  response: Response<ChatGptCompletionResult>
              ) {
                  println("onResponse")

              }

              override fun onFailure(call: Call<ChatGptCompletionResult>, t: Throwable) {
                  println("onFailure")
              }

          })

⬆ 這邊我習慣把各種有可能會覆用的code拉出來寫,ChatGptAPI.kt、ChatGptCompletionRequest.kt、ChatGptCompletionResult.kt...等等
中間因為沒有要寫太大的專案,就懶得自己寫thread操作了
先用最簡單用的retrofit內建Callback
裡面已經幫忙處理UI Thread跟sub Thread的切換了

interface ChatGptAPI {


    @Headers("Content-Type: application/json")
    @POST("v1/completions")
    fun chatGptCompletion(
        @Header("Authorization") openAPIKey: String,
        @Body request: ChatGptCompletionRequest
    ): Call<ChatGptCompletionResult>

}

⬆ 這邊主要是用Retrofit把串接接口分離出來

object OkHttpHelper {


    private var gsonBuilder: GsonBuilder = GsonBuilder()

    const val MAX_CACHE_SIZE = 10

    init {
        gsonBuilder
            .setPrettyPrinting()
            .setDateFormat("yyyy-MM-dd'T'HH:mm:ss.SSS'Z'")
    }

    @Synchronized
    fun http(
        hostName: String = "",
        connectTimeout: Long = 20,
        readTimeout: Long = 30,
        writeTimeout: Long = 30,
    ): Retrofit {

        synchronized(OkHttpHelper::class.java) {

            val okHttpClient = build(
                connectTimeout = connectTimeout,
                readTimeout = readTimeout,
                writeTimeout = writeTimeout
            )

            return Retrofit.Builder()
                .baseUrl(hostName)
                .client(okHttpClient.build())
                .addConverterFactory(GsonConverterFactory.create(gsonBuilder.create()))
                .build()
        }
    }
    @JvmOverloads
    fun build(
        showBodyLog: Boolean = true,
        connectTimeout: Long = 20,
        readTimeout: Long = 30,
        writeTimeout: Long = 30,
    ): OkHttpClient.Builder {


        val httpBuilder = OkHttpClient().newBuilder()
            .readTimeout(readTimeout, TimeUnit.SECONDS)
            .connectTimeout(connectTimeout, TimeUnit.SECONDS)
            .writeTimeout(writeTimeout, TimeUnit.SECONDS)
            .retryOnConnectionFailure(true)
            .proxy(Proxy.NO_PROXY)

        val loggingInterceptor = HttpLoggingInterceptor()

        if (showBodyLog) {
            loggingInterceptor.level = HttpLoggingInterceptor.Level.BODY
        } else {
            loggingInterceptor.level = HttpLoggingInterceptor.Level.HEADERS
        }
        httpBuilder.addInterceptor(loggingInterceptor)
        httpBuilder.connectionPool(ConnectionPool(0, 1, TimeUnit.SECONDS))
        return httpBuilder
    }
}

⬆ 這邊就是建立一個http連線的類

4.完成上面你就已經成功串接ChatGpt的API啦~

現在你只需要再在你呼叫ChatGpt API成功的地方
去呼叫LineBot聊天室的API就能把返回的消息傳到你實際在使用的Line聊天室內了

開始建立LineBot帳號

1. 申請Line Bot賬號:首先需要到Line Bot開發者中心申請一個Line Bot賬號,並創建一個新的Line Bot Channel。

點此連結去申請或直接用line帳號登入:Line Business ID


2. 配置Line Bot Channel:創建Line Bot Channel後,需要配置Channel基本信息、Webhook、消息API、Line Login等功能。

註冊完後,進入此畫面,點擊Create創建新的聊天室:


創建後,來到這個頁面,點擊Create a Messaging API Channel 來開通使用line bot的訊息API:


依照下圖,輸入資料



最後輸入完後
記得在條約打勾後創建


3. 創建完後可以分別在Basic Setting 跟 Messaging API頁面看到你的Channel secret 與Channel access token

這邊兩組key是呼叫linebot相關接口需要的key



4.接著就是參考參考LineBot官方API文件,看看怎麼串:LineBot Messaging api文件




5.至此,你已經取得串接LineBot接口所需的東西了...

可以開始使用你熟悉的語言來開發API了

串接 LineBot API 的 Kotlin 程式

```kotlin class ReplyMessageBody{

val replyMessageBody = LineReplayRequest(messages = listMessage, replyToken = replyToken) println("----replyMessageBody:${Gson().toJson(replyMessageBody)}----")

  retrofitClient.lineReplayMessage(
      accessToken = "Bearer ${LineBotConfig.channelAccessToken}",
      request = replyMessageBody
  ).enqueue(object :
      Callback<Any> {
      override fun onResponse(call: Call<Any>, response: Response<Any>) {
          println("onResponse")
      }

      override fun onFailure(call: Call<Any>, t: Throwable) {
          println("onFailure")
      }

  })

}

<p style="text-align:left;">
&#11014; 這裡跟前面ChatGPT串接的過程一樣,也是使用Retrofit來寫
</p>

```kotlin
interface LineAPI {

    @Headers("Content-Type: application/json")
    @POST("v2/bot/message/reply")
    fun lineReplayMessage(
        @Header("Authorization") accessToken: String,
        @Body request: LineReplayRequest
    ): Call<Any>
}

⬆ 拉出來的Line Messaging接口

6.到這邊就簡單串完了..可以開始部署代碼到Server上了

可以用一些雲端Server或在自己本地IP架設Server把寫好的代碼放上去
即可開始你的LineBot串接ChatGpt服務
後面則是反覆測試你上線的功能是否有bug、後續維護都是可以注意的地方 剩下就自行去摸索吧,快來試試看!

最終成果




開發完成後怎麼部署到LineBot內呢?

1.前面都開發完成了,那你只需要把你的code開放接口跟部署到Server中提供Webhook URL給Lint Deverloper 後台就能行了

這裡就是回到前面去過的Line Deverloper
進到Messaging API這個頁面
把你開放的接口輸入進來就行了





⬆更新你的url到Line後台

⬆輸入完後,可以確認你的Server是不是通的

⬆點Verify後的結果顯示,若是錯誤則會反饋error code

2.這邊我用Kotlin的Ktor來開發自己的後端,像是...

⬆開一個/line_callback接口

3.我推薦一個免費用的線上Server:ngrok

因為這個使用門檻低,很適合新手
只需要照著官網文件
幾乎無痛就幫你把本地port轉換成一個對外的Url
相當方便



⬆登入後,看到ngrok的dashboard,這時只需要照上方步驟
1.下載zip安裝
2.在commend line (Linux/mac) / dos(windows) 中複製輸入上方指令
3.最後選一個port轉成對外port即可

4.在用ngrok轉換port後,會看到以下畫面





5.再次回到Line Developer後台,輸入url即可完全串好



About

Use the Chat GPT API and LineBot messaging API to make the chatting room alive.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published