วิธีติดตั้ง Axios แบบ NPM และ CDN

บทความนี้สอนวิธีติดตั้ง Axios แบบ NPM และ CDN โดย Axios คือ Library ของภาษา JavaScript ที่ใช้สำหรับการส่ง HTTP Request ไปยัง Server ที่ต้องการ โดยปกติจะนำมาใช้ในการเรียกใช้ API ที่ต้องการ เรามาดูวิธีการติดตั้ง และทดลองเขียนโค้ด Axios โดยมีรายละเอียดดังนี้

ตัวอย่าง วิธีติดตั้ง Axios แบบ NPM

1. เข้า command line และเข้าไปใน folder ของ project ที่อาจมีไฟล์ชื่อ package.json (กรณีใช้ JavaScript Framework)

2. รันคำสั่ง npm เพื่อติดตั้ง Axios ตามด้านล่าง

npm install --save axios

ตัวอย่าง วิธีติดตั้ง Axios แบบ CDN

การติดตั้ง Axios แบบ CDN ทำได้โดยการคัดลอก URL ด้านล่างไปวางไว้ในไฟล์ JavaScript ของเว็บไซต์ โดยปกติวิธีนี้จะเป็นการเขียน JavaScript แบบไม่ใช้ Framework

<script src="https://cdnjs.cloudflare.com/ajax/libs/axios/1.6.1/axios.min.js" type="text/javascript"></script>

ตัวอย่าง ทดลองใช้คำสั่ง Axios เพื่อเรียกใช้ API

<script>
axios.get('API_URL')
  .then(res => {
    console.log(res.data);
  })
  .catch(error => {
    console.error('Error:', error);
  });
</script>

จากตัวอย่างใช้คำสั่ง axios.get ส่ง HTTP Request ไปยัง API_URL ที่ต้องการ (ให้เปลี่ยน API_URL เป็นลิงก์ API ที่ใช้งานจริง) ข้อมูลตอบกลับจะส่งมาทาง then res และ error จะส่งมาทาง catch error