Cara Mengintegrasikan ChatGPT API Dengan Nodejs/React - CRUDPRO
Home  ›  nodejs

Cara Mengintegrasikan ChatGPT API Dengan Nodejs/React

Written By Monday, March 27, 2023
Cara Mengintegrasikan ChatGPT API Dengan Nodejs/React

Hari ini saya akan mencoba mengintegrasikan chatGPT API dengan Aplikasi Node/React saya. Saat dunia semakin bergantung pada kecerdasan buatan dan pembelajaran mesin, mengintegrasikan teknologi ini ke dalam aplikasi Anda menjadi lebih penting dari sebelumnya. Dengan API ChatGPT, Anda dapat menambahkan kemampuan pemrosesan bahasa alami ke aplikasi Node Anda, memungkinkannya untuk memahami dan merespons bahasa manusia. Dalam tutorial ini, saya akan memandu Anda melalui langkah-langkah yang diperlukan untuk menyiapkan dan menggunakan API ChatGPT dengan Node, memberi Anda alat yang ampuh untuk membangun aplikasi yang cerdas dan responsif. Apakah Anda seorang pengembang berpengalaman atau baru memulai dengan Node, panduan ini akan memberi Anda informasi yang Anda butuhkan untuk memanfaatkan kekuatan API ChatGPT. Jadi, mari kita mulai!

Mendapatkan API Key untuk ChatGPT API:

Menggunakan ChatGPT API dengan node sangat sederhana dan mudah. Pertama-tama Anda akan memerlukan akun di ChatGPT. Klik link di bawah ini:

https://platform.openai.com/docs/introduction

Ini akan mengarahkan Anda ke halaman dokumentasi, di mana di pojok kanan atas Anda dapat melihat tombol masuk dan daftar. Login jika Anda sudah memiliki akun jika tidak, daftar dan buat akun baru.

Setelah masuk ke akun Anda, Anda akan diarahkan kembali ke layar dokumentasi.

Why we need chat GPT account?
To use ChatGPT API with your application you need API Keys. To get API-key you need ChatGPT account.

Sekarang ikuti langkah-langkah ini untuk mendapatkan Kunci API:

  1. Klik Avatar di pojok kanan atas, itu akan membuka dropdown.
  2. Anda akan melihat opsi "Lihat Kunci API" di dropdown, klik di atasnya. Ini akan mengarahkan Anda ke halaman Kunci API.
  3. Klik "buat kunci rahasia baru" yang ditempatkan di suatu tempat di tengah halaman.
  4. Modal dengan Kunci API akan terbuka, salin dan tempel di tempat yang aman.
  5. Anda hanya dapat melihat kunci rahasia satu kali, Anda tidak dapat melihatnya lagi, namun jika kunci salah tempat, Anda dapat mencabut kunci lama dan membuat yang baru. 
CATATAN: API ChatGPT berbayar. Namun,
tersedia tingkat gratis yang membatasi jumlah permintaan dan ukuran respons yang akan dihasilkan dari ChatGPT.

Sekarang saya memiliki Kunci API, saya dapat bergerak untuk mengintegrasikan API ChatGPT dengan aplikasi saya.

Membuat aplikasi Node sederhana:

Saya akan menggunakan experss js untuk membuat API POST sederhana. Instal paket berikut untuk membuat aplikasi ekspres sederhana:

  • express
  • body-parser
  • dotenv 
Kenapa kita membutuhkan dotenv?
Tidak aman untuk langsung menggunakan kunci API dalam kode,
karena mereka akan didorong ke repositori jarak jauh Anda dan bisa bocor.
Akibatnya, jika ada yang mendapatkan kunci API Anda dan mulai menggunakannya, akun Anda akan dikenakan biaya untuk penggunaannya.

Sekarang ini akan membantu Anda dalam membuat server ekspres sederhana. Anda dapat menguji lingkungan Anda dengan menyalin kode yang diberikan di bawah ini dalam file index.js (buat kode jika belum tersedia):

const express = require("express");
const app = express();
const bodyParser = require('body-parser');
require('dotenv').config();

app.use(bodyParser.json());

app.get('/',(req, res) => {
  return res.status(200).json({"message": "Hello world"});
  }).catch(err => {
    return res.status(400).json({message: err.message});
  });
});

app.listen(3000, () => {
  console.log('Server running on http://localhost:3000/');
});

dan menjalankan perintah 'node index.js' di direktori root proyek Anda.

Mengintegrasikan dan mengonfigurasi ChatGPT API :

Akhirnya saya memiliki semuanya dan sekarang saya dapat bergerak menuju integrasi chatGPT dengan aplikasi Node saya.

Instal pustaka openai dari npm, atau jalankan saja perintah ini di terminal.

npm i openai

Setelah library terinstal, membutuhkan dua modul yaitu OpenAIApi dan Konfigurasi, dan konfigurasikan chatGPT dengan menggunakan API-Key yang saya salin di awal blog ini, seperti ini:

const {OpenAIApi, Configuration} = require('openai');
const configuration = new Configuration({
  apiKey: process.env.API_KEY,
});

Buat file .env di direktori rute Anda dan rekatkan Kunci API Anda di file itu seperti ini:

API_KEY=sk-XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXmuhwj

Sekarang ChatGPT terintegrasi dalam aplikasi Node Anda dan siap digunakan dalam permintaan POST apa pun. Mari buat permintaan POST sederhana yang mengambil pertanyaan dari pengguna dan mengirim jawaban sebagai tanggapan.

Membuat API berbasis ChatGPT Anda:

Buat instance ChatGPT dengan menggunakan variabel konfigurasi yang saya buat di atas.

const openai = new OpenAIApi(configuration);

ChatGPT menawarkan banyak layanan seperti membuat teks, membuat gambar, mengedit chat, dll. Anda dapat menemukan semua layanan yang tersedia di tautan ini:

https://platform.openai.com/docs/api-reference

saya akan menggunakan layanan Penyelesaian ChatGPT. Untuk menggunakan layanan penyelesaian, panggil fungsi createCompletion menggunakan variabel openai seperti ini:

const completion = openai.createCompletion({
    model:model,
    prompt:prompt,
    max_tokens: max_tokens,
    temperature: 0.5
}

Mari kita gali fungsi ini.

model: Model yang ingin Anda gunakan untuk membuat pelengkapan. Anda bisa mendapatkan daftar model yang tersedia dari sini.

prompt: Ini adalah pertanyaan/permintaan yang akan diteruskan ke model chatGPT dan respons akan dihasilkan sesuai dengan itu.

max_tokens: Ini adalah ukuran dari respon. Di tingkat gratis chatGPT API, max-token tidak boleh melebihi 2008, namun nilai ini dapat bervariasi dan Anda dapat memverifikasi dari situs web chatGPT.

Temperature: Ini adalah nilai hingga respons yang dibuat ulang akan dicampur. Jika disetel ke 0, responsnya akan tetap sama tidak peduli berapa kali Anda membuatnya kembali kecuali Anda mengubah perintahnya.

Api POST terakhir yang menggunakan fungsi chatGPT createCompletion dan menghasilkan respons untuk pertanyaan yang diberikan akan terlihat seperti ini:

app.post('/text-generator',(req, res) => {
  const {model, prompt, max_tokens} = req.body;
  console.log(req.body);
  const openai = new OpenAIApi(configuration);
  console.log(process.env.API_KEY);
  openai.createCompletion({
    model:model,
    prompt:prompt,
    max_tokens: max_tokens,
    temperature: 0.5
  }).then((response) => {
    console.log("Response:", response.data.choices[0].text);
    return res.status(200).json({"message": response.data.choices[0].text});
  }).catch(err => {
    return res.status(400).json({message: err.message});
  });
});

Berikut cuplikan kode lengkap yang akan membuat server ekspres sederhana dan POST API untuk respons chatGPT:

const express = require("express");
const app = express();
const bodyParser = require('body-parser');
require('dotenv').config();

const {OpenAIApi, Configuration} = require('openai');
const configuration = new Configuration({
  apiKey: process.env.API_KEY,
});

app.use(bodyParser.json());

app.post('/text-generator',(req, res) => {
  const {model, prompt, max_tokens} = req.body;
  console.log(req.body);
  const openai = new OpenAIApi(configuration);
  console.log(process.env.API_KEY);
  openai.createCompletion({
    model:model,
    prompt:prompt,
    max_tokens: max_tokens,
    temperature: 0.5
  }).then((response) => {
    console.log("Response:", response.data.choices[0].text);
    return res.status(200).json({"message": response.data.choices[0].text});
  }).catch(err => {
    return res.status(400).json({message: err.message});
  });
});

app.listen(3001, () => {
  console.log('Server running on http://localhost:3001/');
});

Menjalankan node index untuk menjalankan server dan uji API Anda di postman dengan mengirimkan objek json ini sebagai body:

{
   "model":"text-divinci-003",
   "prompt":"what is chatgpt",
   "max_tokens":850
}
CATATAN: Fungsi yang sama dapat digunakan secara langsung di aplikasi React, Angular, dan Vue,
namun tidak disarankan karena, dengan menggunakan API di frontend, API-Key Anda akan diekspos dalam permintaan API.

ChatGPT adalah layanan yang tangguh dan dapat membuat keajaiban di dunia. saya melewati hari demi hari, saya bergerak semakin dekat ke otomatisasi akhir dengan sedikit usaha. Pada catatan ini, mari kita simpulkan blog ini, saya telah membahas setiap kemungkinan skenario di blog ini dan menguji sendiri kodenya. Saya menjelaskan satu per satu dan semua yang diperlukan untuk memahami integrasi dan fungsi ChatGPT API dengan aplikasi mereka.

Jika blog ini bermanfaat atau membantu Anda menyelesaikan masalah Anda, bagikan dengan teman-teman Anda, tinggalkan pertanyaan di kolom komentar ya :)