Rumah > hujung hadapan web > tutorial js > API CRUD asas dengan ekspres

API CRUD asas dengan ekspres

Linda Hamilton
Lepaskan: 2025-01-04 22:38:43
asal
430 orang telah melayarinya

kandungan

  • Pengenalan
  • Penciptaan dan permulaan projek
  • Buat pelayan mudah dan laluan GET
  • Pengendali Laluan dan Permintaan
  • Permintaan dan Maklum Balas
  • Nantikan perubahan
  • Buat POST, DAPATKAN, KEMASKINI dan PADAM laluan
  • Klien API
  • Permintaan isi, param, pertanyaan, pengepala, ...
  • Memanipulasi data memori
  • Kesimpulan

pengenalan

Basic CRUD API with express

JavaScript Essentials: Bahagian 7

Michael Otu ・ 2 Nov '24

#javascript #api #pemula #nod

Basic CRUD API with express

Apakah itu API

Michael Otu ・ 24 Feb '24

#javascript #tulisan taip #nod #api

Basic CRUD API with express

Apakah itu REST API

Michael Otu ・ 1 Mac '24

#javascript #tulisan taip #nod #api

Basic CRUD API with express

JavaScript Essentials: Bahagian 6 (Mastermind dalam Javascript)

Michael Otu ・ 28 Okt '24

#javascript #pemula #api #nod

Basic CRUD API with express

Apakah itu Nodejs

Michael Otu ・ 31 Jul '24

#javascript #tulisan taip #nod #api

Basic CRUD API with express

Permintaan dan Maklum Balas

Michael Otu ・ 14 Mac '24

#javascript #nod #pengaturcaraan #tutorial

Basic CRUD API with express

Apakah itu JSON

Michael Otu ・ 9 Mac '24

#javascript #tulisan taip #nod #api

Dalam JavaScript Essentials: Bahagian 7, saya membayangkan bahawa kami akan melihat ke dalam membangunkan API ([0] [1]) dan di sinilah kami bermula. Kami akan merasakan apa yang diperlukan untuk membangunkan API mudah untuk menjejaki perbelanjaan.

Penerangan Projek

Untuk penjejak perbelanjaan ini, kami perlu menjejaki item yang dibeli, jumlah dan tarikh item itu dibeli. Perbelanjaan akan kelihatan seperti ini:

{
    "name": "Legion Tower 7i Gen 8 (Intel) Gaming Desktop",
    "amount": 2099.99,
    "date": "2024-31-12"
}
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk

Pada ketika ini, memandangkan pangkalan data sebenar belum lagi ditambah, kita boleh menggunakan senarai (susunan tatasusunan) untuk menyimpan data yang akan kita cipta. Dalam petikan ini, kami akan meneliti setiap konsep utama yang mengelilingi penciptaan API dan menambah beberapa cara untuk menambah baik apl ini kemudian.

Ketahui bahawa kami akan membina di atas projek ini, jadi, pastikan ia bersih dan terokai, uji kaji, gelisah, dsb sebaik mungkin.

Penciptaan dan permulaan projek

Seperti biasa, kami memerlukan persekitaran kerja yang segar untuk setiap projek, jadi kami akan bermula dengan mencipta dan memulakan projek Node JS. Jika anda tidak pasti, lihat JavaScript Essentials: Bahagian 6 (Mastermind dalam Javascript).

Sekarang kita perlu mencipta folder induk untuk API kita dengan melakukan:

# create a folder for the project at the path of your choice
mkdir expense-tracker-simple-api

# open the project with vscode
# code expense-tracker-simple-api
code -r expense-tracker-simple-api

# open the built-in terminal and init node
npm init -y
# this should create the package.json file

# create the entry file, index.js
echo "console.log(\"expense-tracker-simple-api\");" > index.js

# run the index.js file
node index.js
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk

Apa yang kami lakukan dengan skrip ini adalah secara langsung.

  • Kami mencipta folder untuk projek kami
  • Kami membuka folder dalam vscode
  • Kami memulakan projek nodejs
  • Kami menambahkan log konsol ke dalam fail index.js. Ini mencipta fail dan menambah beberapa kandungan
  • Kami melaksanakan fail index.js

Alternatifnya ialah pergi ke mana sahaja anda mahu mencipta folder ini dan menciptanya di sana kemudian buka folder dalam projek vscode dan init nod - lihat, JavaScript Essentials: Bahagian 6 (Mastermind dalam Javascript).

Pada ketika ini, kita perlu memasang pakej nodejs yang dipanggil ekspres. Express ialah perpustakaan yang akan membantu kami mencipta API kami.

Kita boleh memasang pakej ini dengan menjalankan, npm i express. Ini harus mengubah suai fail package.json dan mencipta fail package-lock.json dan folder node_modules. Rujuk petikan, Apakah itu Nodejs, untuk pemahaman dan maklumat lanjut mengenai cara menggunakan npm untuk memasang pakej.

Buat pelayan mudah dan laluan GET

Dalam fail index.js kami, kami boleh menambah kod ini.

console.log("expense-tracker-simple-api");

// import the express lib
const express = require("express");

// create an express application
const app = express();

// create a GET request on the base endpoint
app.get("/", (req, res) => res.send("Hello world"));

// create a server that listens to requests on port 3000
app.listen(3000, () =>
  console.log(`Api running on ${"http://localhost:3000"}`)
);
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk

Apa yang kami lakukan ialah mencipta aplikasi ekspres, gunakan aplikasi untuk membuat permintaan GET untuk menghantar mesej dan biarkan aplikasi mendengar permintaan yang datang dari port 3000.

const app = express();
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk

Mencipta aplikasi ekspres (? iaitu cara membuat aplikasi ekspres)

app.get("/", (req, res) => res.send("Hello world"));
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk

Kami menggunakan contoh aplikasi ekspres untuk membuat permintaan GET. app mempunyai beberapa kaedah dan sifat yang termasuk kaedah HTTP. Lihat kaedah kecuali tentang http di sini.

{
    "name": "Legion Tower 7i Gen 8 (Intel) Gaming Desktop",
    "amount": 2099.99,
    "date": "2024-31-12"
}
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk

Kami menggunakan aplikasi ekspres untuk mendengar pada port dan menggunakan fungsi anak panah untuk memberitahu kami, memberitahu pembangun, bahawa aplikasi kami sedang berjalan. Untuk pelabuhan, kami boleh mengubahnya ke pelabuhan lain pilihan kami. Walau bagaimanapun, beberapa port khas telah pun dimaksudkan atau digunakan untuk beberapa tugas tertentu dan ia terkenal dalam komuniti dan sebagai pelayan sedemikian sebagai lalai apabila aplikasi atau program tersebut dijalankan pada PC kami. Lihat ini - 0 1 2

Nota: Terdapat beberapa yang tidak boleh digunakan kerana sistem anda disertakan bersamanya dan terdapat beberapa yang disertakan dengan aplikasi yang kami pasang seperti beberapa pelayan dan pangkalan data dan lain-lain. Jangan risau, apabila kami menggunakan port yang sudah digunakan, aplikasi kami akan memberitahu kami. Apa yang perlu kita lakukan ialah tambah satu atau tolak satu. Tiada peluh.

Pengendali Laluan dan Permintaan

Untuk membuat permintaan GET, gunakan app.get(...), untuk POST gunakan app.post(...) dan seterusnya. Untuk setiap laluan yang ingin kami buat, app.SomeMethod(...), akan mengambil laluan atau laluan, menunjukkan sumber mana yang klien pengguna inginkan atau tindakan yang mereka mahu laksanakan. Sebagai sebahagian daripada laluan, ia boleh mengambil sekurang-kurangnya satu pengendali permintaan. Ini bermakna kita boleh mempunyai aplikasi.SomeMethod(path, handder1, handler2, ..., handlern);.

Untuk permintaan GET di atas, laluan atau laluan ialah / (rentetan) dan pengendali permintaan tunggal yang kami ada ialah (req, res) => res.send("Hello world"), fungsi pengendali (panggilan balik atau fungsi anak panah mudah). Pengendali permintaan boleh menjadi perisian tengah dan pengawal.

Permintaan dan Respons

Pengendali permintaan biasanya mengambil dua argumen, permintaan dan respons yang masing-masing dipendekkan sebagai req dan res (anda tidak perlu memanggilnya begitu tetapi yang pertama sentiasa permintaan dan yang kedua ialah respons). Permintaan itu menyimpan data (atau beberapa maklumat) tentang siapa yang membuat permintaan dan perkara yang mereka mahukan. Respons adalah cara untuk memberikan maklum balas kepada pengguna yang membuat permintaan. Dalam kes ini, kami menghantar "Hello world" apabila pelanggan membuat permintaan GET ke laluan /.

Di sini anda dapati bahawa pelanggan dan pengguna boleh ditukar ganti, dalam erti kata peranti yang membuat permintaan HTTP kepada pelayan api kami dan bukan pengguna, seperti dalam akaun pengguna.

Biasanya, pengendali permintaan akan mengambil hujah ketiga yang akan menunjuk kepada pengendali seterusnya selepas pengendali sebelumnya melakukan tugasnya. Kami memanggil ini seterusnya. Ia kelihatan lebih kurang seperti:

# create a folder for the project at the path of your choice
mkdir expense-tracker-simple-api

# open the project with vscode
# code expense-tracker-simple-api
code -r expense-tracker-simple-api

# open the built-in terminal and init node
npm init -y
# this should create the package.json file

# create the entry file, index.js
echo "console.log(\"expense-tracker-simple-api\");" > index.js

# run the index.js file
node index.js
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk

Argumen seterusnya berguna, ia menunjuk kepada pengendali permintaan dan kadangkala ia memerlukan hujah, ralat. Kami akan melaksanakan pengendali ralat untuk mengendalikan ralat yang tidak kami tangani atau ralat yang kami "luluskan" kepada pengendali permintaan seterusnya.

Sekarang mari batalkan proses nodej yang sedang berjalan (dalam terminal), menggunakan kawalan c. Kemudian jalankan semula. Kali ini dengan kandungan yang dikemas kini daripada bahagian Buat pelayan mudah dan laluan GET, kita seharusnya melihat output dalam konsol (terminal) yang serupa dengan,

{
    "name": "Legion Tower 7i Gen 8 (Intel) Gaming Desktop",
    "amount": 2099.99,
    "date": "2024-31-12"
}
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk

Buka http://localhost:3000 dalam penyemak imbas. Apa yang anda nampak? Teks bertulis, Hello dunia ?

Perhatikan perubahan

Rom tidak dibina dalam satu hari bak kata pepatah. Perkara yang sama berlaku untuk pembangunan perisian. Mungkin di sini yang kami maksudkan ialah kami akan menambah lebih banyak ciri secara beransur-ansur semasa kami membangunkan dan dalam proses berterusan ini, ia menjadi menjengkelkan untuk memulakan dan menghentikan pelayan sepanjang masa.

Teruskan, tambah satu lagi permintaan GET (laluan) dengan laluan /hello dan pengendali permintaan yang menyatakan sesuatu yang anda ingin katakan. Bergembiralah.

Anda perlu memulakan semula pelayan (proses nodej yang sedang berjalan) dan lawati, http://localhost:3000/hello dalam penyemak imbas untuk melihat respons dari titik akhir itu.

Ini, DAPATKAN http://localhost:3000/hello, ialah titik akhir. Anda berkongsi ini dengan pengguna api. Dalam kalangan kami, kami sebut laluan, kerana kami tidak perlu mengetahui keseluruhan URL (termasuk protokol - http, domain - localhost, port - 3000, dan laluan - /hello). Laluan ialah LALUAN KAEDAH, lebih kurang, DAPATKAN /hello.

Pada macOS atau Windows, kami boleh melakukan nod --watch index.js atau kami boleh melihat perubahan bukan sahaja dalam fail entri kami tetapi dalam keseluruhan laluan folder oleh, node --watch-path=./ index. js untuk melihat perubahan dalam laluan fail dan juga fail itu sendiri.

Pada masa ini, ini ialah kandungan fail package.json saya:

# create a folder for the project at the path of your choice
mkdir expense-tracker-simple-api

# open the project with vscode
# code expense-tracker-simple-api
code -r expense-tracker-simple-api

# open the built-in terminal and init node
npm init -y
# this should create the package.json file

# create the entry file, index.js
echo "console.log(\"expense-tracker-simple-api\");" > index.js

# run the index.js file
node index.js
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk

Kita boleh menambah skrip yang dipanggil dev di bawah bahagian skrip.

console.log("expense-tracker-simple-api");

// import the express lib
const express = require("express");

// create an express application
const app = express();

// create a GET request on the base endpoint
app.get("/", (req, res) => res.send("Hello world"));

// create a server that listens to requests on port 3000
app.listen(3000, () =>
  console.log(`Api running on ${"http://localhost:3000"}`)
);
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk

Kami boleh menghentikan pelayan yang sedang berjalan dengan kawalan c dan kini melaksanakan npm run dev. Ini akan memantau perubahan yang disimpan dalam fail kami dan memuatkan semula pelayan.

Jadi jika ini tidak berkesan untuk anda, kami ada alternatif. Kami akan memasang nodemone, npm i nodemon -g. Kami akan menggunakannya di mana-mana sebagai alat utiliti supaya kami tidak perlu memasangnya sebagai sebahagian daripada pakej kami. Kita boleh melihat perubahan dengan melaksanakan, nodemon index.js. Terdapat kes di mana ini tidak akan berfungsi dan apabila tidak, dom nodemon --exec node index.js

Kami boleh mengubah suai skrip dev kami untuk menggunakan nodemon dengan,

const app = express();
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk

Pada ketika ini, anda boleh mengubah suai fail .js anda secara bebas dan apabila disimpan, pelayan akan dimulakan semula untuk memuatkan semula perubahan beban yang digunakan.

Buat POST, DAPATKAN, KEMASKINI, PADAM laluan

Kami telah pun membuat permintaan GET. Dalam bahagian ini, kami akan melihat maksud setiap kaedah secara ringkas kerana kami telah membincangkannya dengan panjang lebar dalam Permintaan dan Respons.

Dalam aplikasi ini, kami hanya menyediakan satu jenis sumber kepada pelanggan kami, iaitu perbelanjaan. Dengan mengandaikan kami menyediakan beberapa sumber, maka kami akan mengumpulkan permintaan di bawah setiap sumber.

Jadi, katakan kita mempunyai pengguna dan perbelanjaan, kita mempunyai GET, POST, PUT, DELETE, dll untuk kedua-dua pengguna dan perbelanjaan.

Buat masa ini, kami akan menggunakan laluan /expenditures untuk mewakili sumber perbelanjaan.

  • DAPAT: Ini bermakna kami akan membuat laluan untuk menyenaraikan, mendapatkan semua, mengambil semua, dll rekod yang kami ada tentang perbelanjaan. Kami boleh mempunyai permintaan GET yang mengambil salah satu rekod. Kami telah mencipta GET yang serupa

  • POST: Kaedah siaran sering digunakan untuk mencipta sumber

  • PUT: Kaedah put digunakan untuk mengemas kini rekursus

  • PADAM: Kaedah padam digunakan untuk memadam sumber

Kini kita boleh menambah baris kod berikut pada fail index.js tetapi di atas app.listen(3000,...).

{
    "name": "Legion Tower 7i Gen 8 (Intel) Gaming Desktop",
    "amount": 2099.99,
    "date": "2024-31-12"
}
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk

Apabila anda menyimpan fail anda, adakah anda melihat log dalam terminal? Uji laluan GET untuk perbelanjaan dalam penyemak imbas.

Kami hanya boleh menjalankan permintaan GET dalam penyemak imbas. Kami akan membincangkan pelanggan api seterusnya.

Pelanggan API

Klien API dalam konteks ini ialah alat, program atau aplikasi yang digunakan untuk berinteraksi (menggunakan, menyepadukan atau menguji) API. Paling biasa digunakan ialah Posmen, Insomnia, curl, dll...

Dalam vscode dan bersama beberapa IDE lain, terdapat sambungan yang menyediakan sambungan kepada klien api. vscode mempunyai beberapa sambungan ini untuk perkara itu. Walau bagaimanapun, kami akan mempertimbangkan klien api yang dikenali sebagai REST Client. Untuk kes penggunaan kami, lebih mudah untuk menggunakan Rest Client supaya jangan risau. Kami dilindungi.

Nota: posmen atau pelanggan api lain pilihan anda boleh digunakan

Cara menggunakan REST Client

  • Mula-mula, pasang, REST Client.
  • Kami sedang membuat permintaan HTTP oleh itu kami boleh membuat fail dengan sambungan .http atau .rest - touch expense-tracker-api.http
  • Dalam expense-tracker-api.http kami boleh menentukan permintaan kami
  • Untuk membuat permintaan GET, tambahkan yang berikut pada fail .http
{
    "name": "Legion Tower 7i Gen 8 (Intel) Gaming Desktop",
    "amount": 2099.99,
    "date": "2024-31-12"
}
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
  • Titik tamat dilalui seperti yang dilihat di atas. Untuk siaran, letak atau padamkan permintaan untuk mengemas kini titik akhir. Ingat perbezaan antara titik akhir dan laluan?
  • Untuk permintaan yang memerlukan data dihantar ke api, kami boleh menghantar data sebagai sebahagian daripada laluan sebagai parameter atau pertanyaan rentetan, atau kami boleh menghantarnya dalam badan.
# create a folder for the project at the path of your choice
mkdir expense-tracker-simple-api

# open the project with vscode
# code expense-tracker-simple-api
code -r expense-tracker-simple-api

# open the built-in terminal and init node
npm init -y
# this should create the package.json file

# create the entry file, index.js
echo "console.log(\"expense-tracker-simple-api\");" > index.js

# run the index.js file
node index.js
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
  • Jenis Kandungan: application/json ialah nilai kunci pengepala. Ini bermakna begitulah cara anda menghantar pengepala menggunakan klien rehat.
  • Untuk badan permintaan, kami menghantarnya sebagai objek json - baris baharu dijangka antara pengepala dan badan walaupun
  • Setiap permintaan boleh dipisahkan dengan tiga paun atau tanda abu, ###. Teks boleh ditambah pada penghujung ### untuk menjadikannya kelihatan seolah-olah ia adalah tajuk.
console.log("expense-tracker-simple-api");

// import the express lib
const express = require("express");

// create an express application
const app = express();

// create a GET request on the base endpoint
app.get("/", (req, res) => res.send("Hello world"));

// create a server that listens to requests on port 3000
app.listen(3000, () =>
  console.log(`Api running on ${"http://localhost:3000"}`)
);
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk

Sebagai latihan, buat permintaan untuk titik akhir perbelanjaan. Rujuk apabila anda mengalami sebarang kesulitan. Banyak lagi yang perlu kita lakukan.

Permintaan isi, param, pertanyaan, pengepala

Pada ketika ini, saya tidak perlu menekankan bahawa kami akan menggunakan JSON untuk berkomunikasi dengan api kami menggunakan klien API.

Seperti yang dinyatakan sebelum ini, kami boleh menghantar data ke api kami menggunakan kandungan, pengepala atau URL permintaan kami. Kami telah melihat cara menghantar data melalui badan permintaan dan pengepala (Kami akan melihat untuk menghantar beberapa data tertentu pada masa lain). Semak permintaan POST yang dibuat. Perkara yang belum kami lihat ialah cara menghantar data sebagai sebahagian daripada URL.

Katakanlah kita ingin membaca perbelanjaan yang mempunyai id 4, kita boleh menghantar parameter tambah (sebagai sebahagian daripada URL) sebagai, /perbelanjaan/2. Untuk permintaan yang akan mengendalikan keperluan ini, kami lakukan, /expenditures/:id, di mana :id merujuk kepada id perbelanjaan. Dengan mengandaikan ia adalah sesuatu yang lain selain id, katakan nama, kemudian kita lakukan :name. Express akan memproses ini dan menyediakan kami cara untuk mengekstrak nilai ini tanpa peluh.

Sekarang, untuk rentetan pertanyaan, idea itu serupa dengan parameter permintaan namun, ia datang selepas soalan, diikuti dengan key1=value1&key2=value2...&keyN=valueN, di mana kuncinya ialah pengecam nilai yang anda nak lulus. Contoh yang sangat langsung ialah URL REST-Client, https://marketplace.visualstudio.com/items?itemName=humao.rest-client. Tanda soal menandakan permulaan rentetan pertanyaan dan apa sahaja yang mengikutinya memetakan kunci kepada nilai. Cth: ?itemName=humao.rest-client.

Ia akan menjadi masa yang baik untuk menguji semua titik akhir api anda dan pengalaman bermain dengannya.

Badan Permintaan

Sekarang kita akan memproses permintaan yang menghantar data menggunakan badan permintaan - Titik akhir POST.

{
    "name": "Legion Tower 7i Gen 8 (Intel) Gaming Desktop",
    "amount": 2099.99,
    "date": "2024-31-12"
}
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk

Objek permintaan mempunyai sifat, badan, dan pada sifat ini, adalah nilai yang kami luluskan dalam badan permintaan permintaan kami - req.body.

Ini adalah permintaan yang akan dijalankan.

# create a folder for the project at the path of your choice
mkdir expense-tracker-simple-api

# open the project with vscode
# code expense-tracker-simple-api
code -r expense-tracker-simple-api

# open the built-in terminal and init node
npm init -y
# this should create the package.json file

# create the entry file, index.js
echo "console.log(\"expense-tracker-simple-api\");" > index.js

# run the index.js file
node index.js
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk

Ini ialah pelaksanaan titik akhir kami yang hanya akan log badan permintaan ke konsol.

console.log("expense-tracker-simple-api");

// import the express lib
const express = require("express");

// create an express application
const app = express();

// create a GET request on the base endpoint
app.get("/", (req, res) => res.send("Hello world"));

// create a server that listens to requests on port 3000
app.listen(3000, () =>
  console.log(`Api running on ${"http://localhost:3000"}`)
);
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk

Apa yang berlaku? Kami mempunyai respons biasa tetapi... undefined telah dilog masuk dalam konsol. Nah, ini bermakna semuanya baik-baik saja, tetapi pelayan api kami tidak tahu bahawa ia harus menghuraikan yang masuk sebagai json. Ingat json?

Mari tambah satu baris ini di bawah aplikasi const = express(); yang sepatutnya menyelesaikan menghuraikan data masuk sebagai json.

const app = express();
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk

Sekarang, mari kita uji titik akhir POST sekali lagi. Apa yang anda dapat kali ini? Adakah anda mendapat sesuatu yang serupa dengan ini?

app.get("/", (req, res) => res.send("Hello world"));
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk

Kini anda tahu cara mendapatkan data daripada badan. Sekarang sebagai senaman, hancurkan badan dan hantar objek dalam tindak balas. Jadi, bukannya mengelognya, kembalikannya sebagai respons.

Parameter permintaan

Kami akan membuat titik akhir GET baharu untuk membaca perbelanjaan mengikut id.

Ini akan menjadi permintaan API kami:

app.listen(3000, () =>
  console.log(`Api running on ${"http://localhost:3000"}`)
);
Salin selepas log masuk
Salin selepas log masuk

Objek permintaan mempunyai sifat, params dan pada sifat ini, adalah nilai yang kami luluskan dalam param permintaan permintaan kami - req.params.

Kini pelaksanaannya akan serupa dengan apa yang telah kami lakukan setakat ini tetapi sedikit berbeza.

app.get("/", (req, res, next) => ...);
Salin selepas log masuk
Salin selepas log masuk

Kami juga boleh mengakses id secara terus. Saya harap anda perasan bahawa kunci atau nama :id yang diluluskan sebagai sebahagian daripada laluan sepadan dengan kunci dalam objek yang dilog. Cuba namakan semula kekunci params dalam laluan dan lihat output dilog.

Minta pertanyaan (rentetan pertanyaan)

Untuk rentetan pertanyaan, terdapat sifat pada objek permintaan, pertanyaan, yang mendedahkan rentetan pertanyaan yang diluluskan.

Untuk menunjukkan ini akan menghantar rentetan pertanyaan untuk menapis rekod untuk dikembalikan. Titik akhir ini sepatutnya cukup.

expense-tracker-simple-api
Api running on http://localhost:3000
Salin selepas log masuk
Salin selepas log masuk

Kini pelaksanaannya akan menjadi sesuatu yang serupa dengan:

{
  "name": "expense-tracker-simple-api",
  "version": "1.0.0",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "description": "",
  "dependencies": {
    "express": "^4.21.2"
  }
}
Salin selepas log masuk
Salin selepas log masuk

Sekarang jalankan api anda dan semak log anda. Eksperimen dengan ini.

Memanipulasi data memori

Pada ketika ini, kami belum menyambung ke pangkalan data jadi kami perlu memanipulasi data daripada ingatan. Apa yang kami ingin lakukan ialah mencipta tatasusunan, menambah tatasusunan, mengemas kini elemen di dalamnya dan mengalih keluar elemen. Nampaknya boleh dilaksanakan kerana itulah yang akan kami lakukan.

Kami akan melakukan beberapa pengubahsuaian pada beberapa kod yang ditulis sebelum ini, sila ubah anda juga. Petikan akhir akan dikongsi pada penghujungnya.

Mulakan data dalam ingatan

Mari kita buat tatasusunan perbelanjaan (data palsu) di bawah const express = require("express");

{
    "name": "Legion Tower 7i Gen 8 (Intel) Gaming Desktop",
    "amount": 2099.99,
    "date": "2024-31-12"
}
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk

Senaraikan perbelanjaan

Titik akhir semasa hanya mengembalikan mesej menggunakan res.send(message) tetapi perkara yang ingin kami pulangkan ialah json. Walaupun .send juga boleh mengambil objek atau json, kami akan menggunakan res.json(obj).

Saya tidak menyebut tetapi kod status lalai yang dikembalikan ialah 200. Adakah anda perasan? Kecuali yang lain berlaku atau terdapat masalah dengan permintaan, kod status tetap sama. Terdapat bahagian di bawah kod status, lihat sekilas.

Kami boleh mengubah kod status dengan menghantar kod status yang dikehendaki dalam res.status(desireStatusCode).json(obj). Saya akan mengekalkan 200 kod status sepanjang masa.

Pastikan pelayan masih berjalan

Kami boleh lulus senarai perbelanjaan terus.

# create a folder for the project at the path of your choice
mkdir expense-tracker-simple-api

# open the project with vscode
# code expense-tracker-simple-api
code -r expense-tracker-simple-api

# open the built-in terminal and init node
npm init -y
# this should create the package.json file

# create the entry file, index.js
echo "console.log(\"expense-tracker-simple-api\");" > index.js

# run the index.js file
node index.js
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk

Apakah jawapan yang diterima? Semak kod status serta muatan respons.

Daripada pengalaman dan juga untuk mengelakkan kekaburan, saya lebih suka mengembalikan kod status 200 secara lalai dan mempunyai sama ada sifat kejayaan, mesej atau sifat data untuk mengembalikan mesej atau sumber yang diminta. Secara lalai, apabila status palsu, mesej akan dihantar lain, mesej atau data mungkin dihantar.

console.log("expense-tracker-simple-api");

// import the express lib
const express = require("express");

// create an express application
const app = express();

// create a GET request on the base endpoint
app.get("/", (req, res) => res.send("Hello world"));

// create a server that listens to requests on port 3000
app.listen(3000, () =>
  console.log(`Api running on ${"http://localhost:3000"}`)
);
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk

Kita perlu memaparkan id (indeks setiap baris)

const app = express();
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk

Gunakan penapisan dengan

app.get("/", (req, res) => res.send("Hello world"));
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk

Mengapa penapis dilakukan selepas pemetaan?

Baca perbelanjaan

app.listen(3000, () =>
  console.log(`Api running on ${"http://localhost:3000"}`)
);
Salin selepas log masuk
Salin selepas log masuk

Adakah pelaksanaan ini memberi petunjuk kepada anda tentang, Mengapa penapis dilakukan selepas pemetaan? ?

Buat perbelanjaan

app.get("/", (req, res, next) => ...);
Salin selepas log masuk
Salin selepas log masuk

Kemas kini perbelanjaan

expense-tracker-simple-api
Api running on http://localhost:3000
Salin selepas log masuk
Salin selepas log masuk

Padamkan perbelanjaan

{
  "name": "expense-tracker-simple-api",
  "version": "1.0.0",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "description": "",
  "dependencies": {
    "express": "^4.21.2"
  }
}
Salin selepas log masuk
Salin selepas log masuk

Kesimpulan

Kami telah merangkumi punca kebanyakan pembangunan API. Projek ini adalah asas kerana ia datang. Bersantai dan lihat sekali lagi. Ada lagi yang perlu diteliti seperti

  • pengesahan
  • pengesahan dan kebenaran
  • perisian tengah
  • pengendalian ralat
  • SQL
  • penyepaduan pangkalan data

Projek latihan

crud api = buat, senaraikan, baca, kemas kini dan padam. Itulah cara anda menghadapi masalah ini.

Senarai Tugasan

  • objek todo: { id: int, tugas: rentetan, status: boolean }
  • crud api
  • tambah titik akhir untuk menandakan semua tugasan sebagai selesai, kejayaan adalah benar atau tidak selesai

Kalkulator⁠

  • anda perlu membuat keputusan, sama ada anda akan membuat titik akhir untuk semua operasi (tambah, tolak, pendaraban, bahagi)
  • atau anda akan mencipta satu titik akhir dengan fungsi berbeza yang sepadan dengan setiap operasi. Pengguna seharusnya boleh melepasi operator dan dua operan

Penukar Mata Wang⁠
Anda sedang menukar daripada satu mata wang kepada mata wang yang lain. Lakukan sebanyak mata wang yang anda boleh (3 sudah memadai)

  • Penukar Unit⁠ ⁠- Apl Nota⁠ ⁠- Blog Peribadi⁠ ⁠- Apl Kuiz⁠

Coretan

Ketahui bahawa lebihan telah dikeluarkan.

{
    "name": "Legion Tower 7i Gen 8 (Intel) Gaming Desktop",
    "amount": 2099.99,
    "date": "2024-31-12"
}
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk

Permintaan API

# create a folder for the project at the path of your choice
mkdir expense-tracker-simple-api

# open the project with vscode
# code expense-tracker-simple-api
code -r expense-tracker-simple-api

# open the built-in terminal and init node
npm init -y
# this should create the package.json file

# create the entry file, index.js
echo "console.log(\"expense-tracker-simple-api\");" > index.js

# run the index.js file
node index.js
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk
Salin selepas log masuk

Atas ialah kandungan terperinci API CRUD asas dengan ekspres. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:dev.to
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel terbaru oleh pengarang
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan