เรียกใช้ Claude API ด้วย JavaScript อย่างไร? พร้อมตัวอย่างสำหรับโปรเจกต์

เรียกใช้ Claude API ด้วย JavaScript ได้ผ่าน SDK ทางการของ Anthropic โดยติดตั้งแพ็กเกจ กำหนด API Key ในตัวแปรสภาพแวดล้อม แล้วส่งข้อความผ่าน Messages API ตัวอย่างนี้ใช้ Node.js และเก็บคีย์ไว้ฝั่งเซิร์ฟเวอร์ ผู้ใช้ ComSiam สามารถนำไปทดลองก่อนเชื่อมเข้ากับแอปจริง

เตรียมโปรเจกต์ JavaScript

① ตรวจว่ามี Node.js แล้ว
SDK ของ Anthropic รองรับ Node.js รุ่นที่ยังได้รับการดูแล ตรวจเวอร์ชันที่ติดตั้งด้วยคำสั่ง:

node --version

② สร้างโฟลเดอร์โปรเจกต์และติดตั้ง SDK

mkdir claude-api-demo
cd claude-api-demo
npm init -y
npm install @anthropic-ai/sdk

③ ตั้งค่า API Key เป็นตัวแปรสภาพแวดล้อม
บน macOS หรือ Linux กำหนดค่าใน Terminal ด้วย:

export ANTHROPIC_API_KEY="ใส่คีย์ของคุณ"

บน Windows PowerShell ใช้:

$env:ANTHROPIC_API_KEY="ใส่คีย์ของคุณ"

ตัวอย่างนี้ตั้งค่าคีย์เฉพาะหน้าต่าง Terminal ปัจจุบัน หากใช้ไฟล์ .env ต้องตั้งค่าให้โปรแกรมโหลดตัวแปรอย่างถูกต้อง และเพิ่มไฟล์ .env ใน .gitignore ก่อน Commit

ตัวอย่างเรียก Claude API ด้วย Node.js

สร้างไฟล์ชื่อ ask-claude.mjs แล้วใส่โค้ด:

import Anthropic from "@anthropic-ai/sdk";

if (!process.env.ANTHROPIC_API_KEY) {
  throw new Error("กรุณาตั้งค่า ANTHROPIC_API_KEY ก่อนรันโปรแกรม");
}

const client = new Anthropic();

const message = await client.messages.create({
  model: "claude-sonnet-5-5",
  max_tokens: 512,
  messages: [
    {
      role: "user",
      content: "ช่วยอธิบาย API ให้เข้าใจง่ายใน 3 ประโยค"
    }
  ]
});

for (const block of message.content) {
  if (block.type === "text") {
    console.log(block.text);
  }
}

รันโปรแกรมด้วย:

node ask-claude.mjs

client.messages.create() ส่งคำขอไปยัง Messages API ส่วน model ระบุโมเดลที่ต้องการ และ max_tokens กำหนดเพดานความยาวคำตอบ ชื่อโมเดลในตัวอย่างอาจเปลี่ยนได้ ให้ตรวจชื่อที่บัญชีและ API รองรับก่อนใช้งานจริง

ข้อควรระวังในการใช้ API Key

SDK ทางการปิดการใช้งานจากเบราว์เซอร์ไว้เป็นค่าเริ่มต้น เพื่อป้องกันการเปิดเผยข้อมูลลับ จึงควรเรียก Claude API จากฝั่งเซิร์ฟเวอร์ของแอป ไม่ฝังคีย์ไว้ในโค้ดหน้าเว็บหรือส่งไปยังผู้ใช้

ผู้ใช้ ComSiam ควรตรวจว่าไม่มี API Key อยู่ในไฟล์ที่ Commit หรือแชร์ต่อ หากคีย์รั่วไหล ให้เพิกถอนคีย์นั้นใน Console และสร้างคีย์ใหม่

ถ้าโปรแกรมเรียก API ไม่สำเร็จ

  • ตรวจว่าตั้ง ANTHROPIC_API_KEY ในหน้าต่าง Terminal เดียวกับที่ใช้รันโปรแกรม
  • ตรวจชื่อโมเดลและสิทธิ์ใช้งานของบัญชี
  • ตรวจการตั้งค่าเครดิตหรือการเรียกเก็บเงินใน Console
  • อ่านข้อความ Error เพื่อแยกปัญหาการยืนยันตัวตน การเชื่อมต่อ หรือขีดจำกัดการใช้งาน

สรุป

เริ่มเรียก Claude API ด้วย JavaScript โดยติดตั้งแพ็กเกจ @anthropic-ai/sdk เก็บ API Key เป็นตัวแปรสภาพแวดล้อม และส่งข้อความด้วย client.messages.create() ตัวอย่างนี้ใช้ Node.js ฝั่งเซิร์ฟเวอร์และพิมพ์เฉพาะบล็อกข้อความจากคำตอบ ผู้ใช้ ComSiam ควรตรวจชื่อโมเดลปัจจุบันและรักษา API Key เป็นความลับก่อนนำไปต่อยอด