Résumé de l'API Express

Qdd 2021-10-13 17:32:43
sum api express


Express C'est un Node.js Web Cadre. Le API Total 5 Catégorie,Respectivement.:

  1. express()
  2. Application
  3. Request
  4. Response
  5. Router

Ci - dessus 5 Catégorie API Utilisation de,En créant express-demo Pour se familiariser.

In express-demo En bas. yarn init -y Créer par défaut package.json,Exécution yarn add express Installation express;Création app.js,Ajouter le code suivant:

const express = require('express')
const app = express()
app.use((req, res, next) => {
res.send('hi')
})
app.listen(5001, () => {
console.log('listen 5001')
})
Copier le Code

Créé express Services,Écouter 5001 Port,Exécution node app.js Démarrer le Service,Importer dans le Navigateur http://localhost:5001/ Comme vous pouvez le voir ci - dessous: image.png

Tu vois? hi Description fonctionnement normal . Les exemples suivants sont tous fournis par postman Demande de construction.

express()


Pour les intergiciels intégrés .express() Créé un Express Application,C'est - à - dire: demo Dans app.

Total 7 - Oui. API,Voici une introduction 3 Les API

  1. express.json()
  2. express.static()
  3. express.Router()

express.json()

Si le demandeur est req.body - Oui. json, Sera complet json Analyser,Retour à la résolution json Middleware for.

L'exemple suivant n'est pas ajouté express.json() Code:

app.use((req, res, next) => {
console.log('req.body')
console.log(req.body)
res.send('hi')
next()
})
Copier le Code

Les demandes sont les suivantes:: image.png

Le terminal est imprimé comme suit: :

image.png

Vous pouvez voir que l'impression est undefined.Lorsque vous ajoutez express.json() Heure,Les codes sont les suivants::

app.use(express.json())
app.use((req, res, next) => {
console.log('req.body')
console.log(req.body)
res.send('hi')
next()
})
Copier le Code

Répéter la même demande , Les résultats d'impression du terminal sont les suivants: :

image.png

express.static(root)

Express Utiliser express.static La fonction Middleware définit l'ordre des répertoires statiques pour trouver les fichiers . Passer un répertoire contenant des fichiers de ressources statiques à express.static Fonction Middleware, Pour commencer à fournir ces documents directement .express.static Faire un serveur statique par défaut ,Paramètres root Est le Répertoire racine où les ressources statiques sont placées , Tant que le chemin d'accès est root Sous la table des matières,Et ce sera root Recherche dans le catalogue, Non, je cherche dehors. .

Créer sous le Répertoire racine yyy Table des matières,In yyy Création index.html.Par root Pour 'yyy' Par exemple,Les codes sont les suivants::

app.use(express.static('yyy'))
app.use((req, res, next) => {
res.send('hi')
})
Copier le Code

À visiter yyy/index.html Il suffit d'entrer dans la barre d'adresse du Navigateur http://localhost:5001/index.html C'est tout.,Parce que http://localhost:5001/ Par défaut http://localhost:5001/index.html , Les demandes reçues sont les suivantes: :

image.png Ce n'est plus ce qu'il était. hi, Si la demande est http://localhost:5001/xxx Les résultats sont les suivants::

image.png

Pour utiliser plusieurs fichiers de répertoires statiques , Plusieurs appels sont nécessaires express.static Fonction Middleware.

Si vous créez un préfixe de chemin virtuel pour un fichier de ressources statiques ,Ça pourrait être dans app.use Spécifié dans, Supposons que vous puissiez accéder à http://localhost:5001/static/index.html Je l'ai. yyy/index.html,Les codes sont les suivants::

app.use('/static', express.static('yyy'))
Copier le Code

Les demandes sont les suivantes:: image.png

express.Router()

Pour créer router Objet,Avec Router API En association avec,Pour une utilisation spécifique, voir Router API Section.

Application


Pour appliquer les paramètres , Comme la configuration du modèle 、Middleware、Monter le routage. Dans cet exemple, app(Application principale).

Total 22 - Oui. API,Voici une introduction 3 Les API

  1. app.set()
  2. app.METHOD()
  3. app.use()

app.set()

app.set(name, value) Oui. value Assigner une valeur à name Pour stocker des données,Peut passer app.get(name) Obtenir une valeur; Il y a aussi des name,Par exemple, case sensitive routing(Sensible à la casse) 、views( Répertoire des fichiers modèles )、view engine( Modèle de moteur de vue )Attendez..

Exemple de cas de routage sensible ,Les codes sont les suivants::

app.set('case sensitive routing', true) // Sensible à la casse de routage 
app.get('/style.css', (req, res, next) => {
res.send('style.css')
})
app.get('/STYLE.css', (req, res, next) => {
res.send('STYLE.css')
})
Copier le Code

Les demandes sont les suivantes:: image.png image.png Je vois. /style.css Et /STYLE.css Les résultats sont différents, Description paramètres en vigueur . Peut également être utilisé app.set Pour configurer les modèles ,En général app.render En association avec, Cet article n'élargit pas les détails , Voir le Guide du site Web Utilisation du moteur Template.

app.METHOD()

C'est - à - dire app.get / app.post / app.delete / app.put Attendre la demande,Par exemple, get Utilisation app.get(path, callback), Les paramètres sont le chemin et les callbacks effectués sous ce chemin, respectivement .

Par exemple, dans /test Sous le chemin get/post/delete/patch Demande de méthode,Les codes sont les suivants::

app.get('/test', (req, res, next) => {
res.send('get /test')
})
app.post('/test', (req, res, next) => {
res.send('post /test')
})
app.delete('/test', (req, res, next) => {
res.send('delete /test')
})
app.patch('/test', (req, res, next) => {
res.send('patch /test')
})
Copier le Code

Les demandes sont les suivantes:: image.png image.png image.png image.png

app.use()

Pour le montage des intergiciels , Ou exécuter la méthode sous le chemin spécifié .Par exemple, Le code ci - dessus peut être écrit comme suit: :

app.use('/test', (req, res, next) => {
if(req.method === 'GET'){
res.send('get /test')
}
if(req.method === 'POST'){
res.send('post /test')
}
if(req.method === 'DELETE'){
res.send('delete /test')
}
if(req.method === 'PATCH'){
res.send('patch /test')
}
next()
})
Copier le Code

Résultats de la demande et app.get / app.post / app.delete / app.patch D'accord., équivalent à app.use En bref,La différence est que app.use Disponible pour n'importe quelle méthode , Sans spécifier une méthode de demande spécifique . Lorsque le chemin n'est pas spécifié ,app.use Disponible pour n'importe quelle requête et chemin , C'est comme demander. /xxx Heure, En réponse hi,Comme suit: image.png

Request


Pour les demandes opérationnelles .app.use((req, res, next) => {}) Dans req Juste au nom de http Demande.

Total 28 - Oui. API,Voici une introduction 2 Les API

  1. req.get()
  2. req.param()

req.get()

Renvoie le champ de l'en - tête de la requête ,Par exemple, req.get('Content-Type'),Les codes sont les suivants::

app.use((req, res, next) => {
console.log(req.get('Content-Type'))
res.send('hi')
})
Copier le Code

Les demandes sont les suivantes:: image.png Le terminal est imprimé comme suit: :

image.png

req.param()

req.param(name) Retour req.params | req.body | req.query Dans name Valeur.De Express 4.11 Commencez à utiliser req.params,req.body,req.query Remplacer req.param.

app.use('/:name', (req, res, next) => {
console.log(req.params)
console.log(req.body)
console.log(req.query)
console.log(req.param('name'))
res.send('hi')
})
Copier le Code

Les demandes sont les suivantes:: image.png Le terminal est imprimé comme suit: :

image.png

Response


Pour une réponse opérationnelle .app.use((req, res, next) => {}) Dans res Juste au nom de http Réponse.

Total 24 - Oui. API,Voici une introduction 3 Les API

  1. res.send()
  2. res.status()
  3. res.format()

res.send()

Envoyer le corps de réponse , Le contenu peut être Buffer、String、Boolean、Array.res.send Est une opération non courante , Tout envoyer en même temps , Il est également réglé automatiquement header.

Les codes sont les suivants::

app.use((req, res, next) => {
res.send('<p>pÉtiquettes</p>')
})
Copier le Code

Les demandes sont les suivantes:: image.png En - tête de réponse: image.png

res.status()

Définir le Code d'état de la réponse,Peut être appelé en chaîne.

Comme le retour404,Les codes sont les suivants::

app.use((req, res, next) => {
res.status(404).send('404 not found')
})
Copier le Code

Les demandes sont les suivantes:: image.png

res.format()

Selon l'en - tête de la demande Accept Type renvoie le contenu correspondant .

Les codes sont les suivants::

app.get('/test', (req, res, next) => {
res.format({
'text/plain': function () {
res.send('hey')
},
'text/html': function () {
res.send('<p>hey</p>')
},
'application/json': function () {
res.send({ message: 'hey' })
},
default: function () {
res.status(406).send('Not Acceptable')
}
})
})
Copier le Code

Les demandes sont les suivantes::

  • Définir l'en - tête de la requête Accept Pour text/plain

image.png

  • Définir l'en - tête de la requête Accept Pour text/html

image.png

  • Définir l'en - tête de la requête Accept Pour application/json

image.png

  • Définir l'en - tête de la requête Accept Pour application/xml, N'appartient à aucun type dans le Code , Envoyer le contenu par défaut

image.png

Router


Pour le routage opérationnel . Peut être considéré comme un mini app,Monté sur app,Précédemment mentionné Router Toujours. express.Router() Ensemble.

Comme un /user Le chemin est une page qui énumère tous les utilisateurs ,/user/:id C'est basé sur id Une information utilisateur spécifique trouvée ,/user/:id/edit C'est basé sur id Modifier une information utilisateur spécifique ,Les codes peuvent être les suivants::

app.get('/user', (req, res, next) => {
res.send('/user')
})
app.get('/user/:id', (req, res, next) => {
res.send('/user/:id')
})
app.get('/user/:id/edit', (req, res, next) => {
res.send('/user/:id/edit')
})
Copier le Code

C'est un peu répétitif. ,Tous. /user Route sous le chemin , Donc nous pouvons monter ces sous - chemins vers /user Juste en dessous,app.js Talon moyen /user Le Code lié au routage a été réécrit comme suit: :

// app.js
app.use('/user', userRouter)
Copier le Code

Créer sous le Répertoire racine routes Dossiers,In routes Ajouter ci - dessous user.js Pour placer le talon /user Le routage en question,Les codes sont les suivants::

const express = require('express')
const router = express.Router()
router.get('/', (req, res, next) => {
res.send('/user')
})
router.get('/:id', (req, res, next) => {
res.send('/user/:id')
})
router.get('/:id/edit', (req, res, next) => {
res.send('/user/:id/edit')
})
module.exports = router
Copier le Code

Exportation simultanée router Import to app.js Moyenne,Les codes sont les suivants::

const userRouter = require('./routes/user')
Copier le Code

Les demandes sont les suivantes:: image.png image.png image.png Comme vous pouvez le voir, /user,/user/1,/user/1/eidt Les retours sont différents .Pour savoir, Les routes sous différents chemins racine peuvent être montées en plusieurs parties différentes app En bas., Facile à écrire et à entretenir .

C'est tout ce qui précède. , Il y a des questions. ,Merci pour la lecture.~

版权声明
本文为[Qdd]所创,转载请带上原文链接,感谢
https://qdmana.com/2021/10/20211013172957894B.html

  1. Error in spring source code compilation: the monoprocessor in reactor.core.publisher is outdated
  2. Buctf [geek Challenge 2019] http
  3. 20 个值得学习的 Vue 开源项目
  4. 20 projets open source à apprendre
  5. Scène et application de la manette des gaz anti - bavardage
  6. Qu'est - ce que j'ai gagné en abandonnant vue pour les six mois de React?
  7. À partir de [Bytecode cache] et de [http cache], intervieweur: « est - ce si mince? »
  8. [niveau intermédiaire et avancé] obligatoire, 30 + questions manuscrites à haute fréquence et réponses détaillées (dix mille caractères longs), voyez comment "vous" ne pouvez pas m'abattre
  9. Mise en œuvre d'un outil d'échafaudage universel pour l'ingénierie Web de 0 à 1
  10. 【中高级前端】必备,30+高频手写题及详细答案(万字长文),看“你”怎么难倒我
  11. In less than two days, the box office exceeded 400 million, and Changjin Lake broke out, breaking seven records in Chinese film history
  12. Tong Liya Jin Chen bumps her hair, Xie Na Zhao Liying bumps her shirt, and she sees EQ from the reaction
  13. react之组件生命周期
  14. L'équipe de vue dévoile un nouvel outil d'échafaudage rapide comme la foudre Create View, qui remplacera la vue CLI à l'avenir, avec seulement 300 lignes de code, apprenez - le!
  15. 20 dessins illustrant le fonctionnement du moteur de rendu du Navigateur
  16. In less than two days, the box office exceeded 400 million, and Changjin Lake broke out, breaking seven records in Chinese film history
  17. 千锋重庆web前端学习之理解CSS位置属性
  18. 什么是语义HTML标记以及如何使用它们?
  19. Si vous vous représentez avec un tableau, c'est le champ de Van Gogh.
  20. 前端面试手写代码
  21. 前端开发框架Vue中Vuex的使用原理分享
  22. vue-echarts初次体验
  23. 分享一些web前端开发好用的网站
  24. 每天读一点webpack-003
  25. react之组件生命周期
  26. Alibaba collection version of mybatis handwritten documents, Java front-end interview questions
  27. SpringBoot Java后端实现okhttp3超时设置
  28. react之組件生命周期
  29. Cycle de vie des composants de React
  30. 使用Reactor将阻塞调用变为异步非阻塞
  31. Baked cake wife sun photos, plain face on camera, beautiful appearance is still a beauty, watching children during the festival is a little helpless
  32. 亚洲知名插画师荒川(arakawa) 仅8件独版NFT作品系列《Can't Out》正式上架Element综合市场
  33. Taiyuan: singing, welcoming the national day, gathering to praise blessings
  34. Arakawa, un illustrateur Asiatique bien connu, n'a mis sur le marché que huit pièces de la collection NFT "can't out" en une seule édition.
  35. Résumé des questions d'entrevue Hadoop (II) - - hdfs
  36. 如何解决“Serverless”系统的冷启动问题
  37. BootstrapBlazor 模板安装
  38. BootstrapBlazor 模板安装
  39. Tong Liya Jin Chen bumps her hair, Xie Na Zhao Liying bumps her shirt, and she sees EQ from the reaction
  40. 使用ESLint+Prettier来统一前端代码风格
  41. 为什么说 Node.js 是实时应用程序开发的绝佳选择
  42. PaddlePaddle:在 Serverless 架构上十几行代码实现 OCR 能力
  43. 使用elementui在完成项目中遇到的未知知识点2
  44. On the mechanism of webpack loader
  45. 云原生体系下 Serverless 弹性探索与实践
  46. vue开发技巧
  47. Une fleur merveilleuse de l'histoire de l'industrie des nouveaux véhicules énergétiques, Zhongtai Jiangnan T11, une voiture vintage que vous n'avez jamais vue
  48. 致敬!再见了!LayUI !
  49. Vue安装和卸载
  50. Implement a flipped character with the transform attribute of CSS
  51. 你的第一个 Docker + React + Express 全栈应用
  52. [apprentissage de l'algorithme] 1486. Fonctionnement exclusif du tableau (Java / C / C + + / python / go / Rust)
  53. Zhang Daxian sends a blessing video on xYG relay, showing positive energy in details
  54. 前端技巧-JS元编程ES6 symbol公开符号
  55. Article de 37 ans seul à l'hôpital!Il boitait, soupçonnait d'être blessé, souriait avec douleur
  56. 前端推荐!10分钟带你了解Konva运行原理
  57. npm ERR! iview-project@3.0.0 init: `webpack --progress --config webpack.dev.config.js
  58. 零基础学习Web前端需要注意什么呢?
  59. The Youth League promotes Yiyang Qianxi new film, and the relationship between the two generation and the generation is good. Li Fei is blessed.
  60. Qu'est - ce qu'il faut remarquer à l'avant - plan Web de l'apprentissage de base zéro?