Node.js全栈:从一个简单的例子开始

  • 第一章:从一个简单的例子开始
  • 第二章:看官方文档的艺术
  • 第三章:浏览器显示一个网页

首先,在VSCode编辑器中打开一个没有任何文件的空目录,然后创建一个package.json文件。

为了方便大家复制,我把文件内容放到下面:

{"name": "MeApi","version": "1.0.0","description": "我的接口框架","type": "module","main": "index.js","scripts": {"dev": "node index.js"}
}

这是Node.js项目的基本文件,你可以把我们写一个Node.js项目比作请客吃饭,那么package.json就是物品清单的意思。

在这里,我们给项目起名为MeApi。版本号是1.0.0。文件描述就是我的接口框架。语法采用的是module模式。入口文件为index.js。只有个一个dev脚本,作用就是通过nodejs执行index.js文件。

本课程以Web全栈开发的思路为主干,如果以上内容你有不清楚的部分(比如type除了module还有什么?入口属性main的作用是什么?脚本如何执行?等等),请在问答群艾特我进行问答。

package.json文件创建好之后,我们继续创建index.js文件。

非常极简的一个例子,几行代码就把一个Web服务创建好了,这就是我们Web服务的基座,后面的一切都是围绕着它来完善、装饰、点缀。

首先呢,需要从Node.js内置的http模块中导出createServer方法,然后用这方法,来创建一个Web服务实例并赋值给server常量。最后再选择一个你喜欢的端口数字,监听来自这个端口收到的消息。当请求到达的时候,就发送*你好,世界!*给请求端。

再次声明,且后续章节不再复述。

如果你对什么是端口?端口一共有多少个?等这类跟本课程主干方向有些偏离的发散性问题比较好奇的话,请在问答群里艾特我。这是所有本课程高级档的基本权益,同时也避免本课程文字过于分散影响阅读和学习。

那么我们在命令行,执行npm run dev命令,就可以启动web服务了。

可以看到dev命令的值node index.js正是我们命令行执行的指令,其实直接在命令行输入node index.js也是一样的。

执行完毕后,会看到在命令行有一个闪动的光标(如1处所示),这表示Web服务启动了,并且正在监听端口消息中。

然后打开浏览器,输入http://127.0.0.1:8000并回车,就能看到返回的内容了。

等等,怎么返回的是看不懂的文字,我们的*你好,世界!*呢?!

如果你学习过html的话,一定知道这是再正常不过的编码问题,那么在Node.js中如何解决这个问题呢?

只需要在返回数据之前,设置好返回数据的头部参数Content-Type的编码charset为utf-8就行了。

至此,一个极简的Web服务框架体验就完成了。

还记得我前面说的*这就是我们Web服务的基座,后面的一切都是围绕着它来完善、装饰、点缀。*吗?

没错,如果我们要返回html页面,返回图片,返回css,返回js,只需要设置好返回文件的类型就可以了。这里的*{‘Content-Type’:‘text/plain;charset=utf-8’}中的text/plain*,就表示返回一个普通的文本内容。

千万不要光看不写哦,请动手试试吧,如果还有疑问,请到问答群艾特我,下个章节,我们不见不散~

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/bicheng/11756.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

vue elementui select多选下拉库组件鼠标移出隐藏下拉框

elementui select 多选下拉库组件 鼠标移出 隐藏下拉框 template: <el-selectmultipleclearablefilterablecollapse-tags:popper-append-to-body"false"placeholder"请选择"v-model"value"class"searchFormItemWidth"style"…

Pytorch的torch.nn.functional.cross_entropy的ignore_index细解

作用 ignore_index用于忽略ground-truth中某些不需要参与计算的类。假设有两类{0:背景&#xff0c;1&#xff1a;前景}&#xff0c;若想在计算交叉熵时忽略背景(0)类&#xff0c;则可令ignore_index0&#xff08;同理忽略前景计算可设ignore_index1&#xff09;。 代码示例 i…

使用Flask的send_file方法实现文件下载功能

文章目录 什么是send_file方法&#xff1f;如何在Flask应用中使用send_file方法&#xff1f;示例拓展处理文件不存在的情况设置下载文件的名称实现文件下载的权限控制 结论 在Web开发中&#xff0c;经常需要实现文件下载功能&#xff0c;而Python的Flask框架提供了方便的send_f…

华为手机恢复出厂设置后怎么还原数据?该如何预防数据丢失?

华为手机恢复出厂设置是将手机恢复到出厂时的初始状态&#xff0c;同时会删除所有用户数据和个人设置。如果不做任何预防措施&#xff0c;在恢复出厂设置后&#xff0c;您将丢失手机上的所有数据。那华为手机恢复出厂设置后怎么还原数据呢&#xff1f;以下是关于如何在华为手机…

新的语言学习系统: 记忆镶嵌

摘要 记忆镶嵌是由多个关联记忆网络协同工作来完成感兴趣的预测任务。与transformer类似,记忆镶嵌具有组合能力和上下文学习能力。与transformer不同,记忆镶嵌以相对透明的方式实现这些能力。该研究在玩具示例上展示了这些能力,并且还表明记忆镶嵌在中等规模语言建模任务上的表…

头歌(EduCoder):数据挖掘算法原理与实践 -- 决策树

【头歌】机器学习实训代码 第一关&#xff1a;决策树算法思想 1、下列说法正确的是&#xff1f;&#xff08; AB &#xff09; A、训练决策树的过程就是构建决策树的过程B、ID3算法是根据信息增益来构建决策树C、C4.5算法是根据基尼系数来构建决策树D、决策树模型的可理解性不…

MySQL性能优化实战

目录 一、安装说明 1.1 RPM 安装包和 Tar 安装包的区别&#xff1f; 1.2 安装后需要配置哪些内容&#xff1f; 1.3 my.cnf 文件初始需要配置哪些内容&#xff1f; 1.4 MySQL 的版本选择 1.5 MySQL 之外的选择 二、MySQL引擎选择和表设计上的优化 2.1 Myisam 和 InnoDB …

YOLOv9全网最新改进系列::YOLOv9完美融合双卷积核(DualConv)来构建轻量级深度神经网络,目标检测模型有效涨点神器!!!

YOLOv9全网最新改进系列&#xff1a;&#xff1a;YOLOv9完美融合双卷积核&#xff08;DualConv&#xff09;来构建轻量级深度神经网络,目标检测模型有效涨点神器&#xff01;&#xff01;&#xff01; YOLOv9原文链接戳这里&#xff0c;原文全文翻译请关注B站Ai学术叫叫首er …

AJAX笔记及工作流程[复习]

简介 浏览器与服务器之间&#xff0c;采用 HTTP 协议通信。用户在浏览器地址栏键入一个网址&#xff0c;或者通过网页表单向服务器提交内容&#xff0c;这时浏览器就会向服务器发出 HTTP 请求。 1999年&#xff0c;微软公司发布 IE 浏览器5.0版&#xff0c;第一次引入新功能&…

Docker 的 Busybox 操作系统镜像

BusyBox是一个遵循GPL协议、以自由软件形式发行的应用程序。 Busybox在单一的可执行文件中提供了精简的Unix工具集&#xff0c;可运行于多款POSIX环境的操作系统&#xff0c;例如Linux&#xff08;包括Android&#xff09;、Hurd、FreeBSD等等。 由于BusyBox可执行文件的文件…

在uniapp中custombar的使用

API对接平台一键对接ChatGPT3.5/4.0&#xff0c;Claude3&#xff0c;文心一言等AI模型&#xff0c;无需翻墙&#xff0c;国外信用卡&#x1f449;AI模型聚合API-海鲸AI 在 UniApp 中&#xff0c;自定义 TabBar 是指替换默认的 Tab 栏以实现更多个性化的设计。自定义 TabBar 可以…

石墨烯材料商汉烯科技授权世强硬创,代理产品具备高导热/导电特点

近日&#xff0c;武汉汉烯科技有限公司&#xff08;下称“汉烯科技”&#xff0c;英文&#xff1a;HANXI TECH&#xff09;与世强先进&#xff08;深圳&#xff09;科技股份有限公司&#xff08;下称“世强先进”&#xff09;达成授权代理合作&#xff0c;面向锂电新能源、电子…

M - 有效算法

Attachments - 2024 National Invitational of CCPC (Zhengzhou), 2024 CCPC Henan Provincial Collegiate Programming Contest - Codeforces 将公式转换&#xff1a; ∣ a i − x ∣ ≤ k b i | a_i - x | \le k \times b_i ∣ai​−x∣≤kbi​ − k b i a i ≤ x ≤ k …

【基础技能】Windows常用快捷键

最近做知识管理&#xff0c;梳理了下个人技能&#xff0c;存在好多基础技能都是一知半解&#xff0c;用的时候都是现搜现查&#xff0c;没有形成一个完整的知识体系&#xff0c;导致一些基础不牢靠&#xff0c;需要再次筑基&#xff01; 于是就翻阅了微软的官网&#xff0c;撸…

51单片机GPS+sim800c GSM定位短信LCD1602液晶显示 原理图+PCB+源码

目录 1、实物图 2、原理图 ​3、PCB​编辑 4、程序 资料下载地址&#xff1a;51单片机GPSsim800c GSM定位短信LCD1602液晶显示 原理图PCB源码 1、实物图 2、原理图 3、PCB 4、程序 #include "common.h" #include "uart.h" #include "gps.h&…

开放签电子签章系统(企业版)V2.0.2版本详细更新内容

近期&#xff0c;我们悉心收集了过去三个月用户的真实反馈&#xff0c;深度剖析每一个细节和每一处体验。然后停下新增功能的工作&#xff0c;完成这版迭代&#xff0c;近期的新增功能进度会慢下来&#xff0c;主要还以优化使用体验为主。 本次详细更新内容如下&#xff1a; …

机器学习概念:几种常见的距离参数概念和应用

目录 欧几里德距离的概念 曼哈顿距离&#xff08;Manhattan Distance&#xff09; 切比雪夫距离&#xff08;Chebyshev distance&#xff09; 闵可夫斯基距离&#xff08;Minkowski distance&#xff09; 余弦相似度&#xff08;Cosine Similarity&#xff09; 欧几里德距离…

【Web后端】实现文件上传

表单必须使用post提交 ,enctype 必须是multipart/form-data在Servlet上填加注解 MultipartConfiglocation &#xff1a;默认情况下将存储文件的目录&#xff0c;默认值为“”。maxFileSize &#xff1a;允许上传文件的最大大小&#xff0c;其值以字节为单位。 默认值为-1L表示无…

简单易懂的HashMap使用指南:从入门到精通

哈喽&#xff0c;各位小伙伴们&#xff0c;你们好呀&#xff0c;我是喵手。运营社区&#xff1a;C站/掘金/腾讯云&#xff1b;欢迎大家常来逛逛 今天我要给大家分享一些自己日常学习到的一些知识点&#xff0c;并以文字的形式跟大家一起交流&#xff0c;互相学习&#xff0c;一…

如何查看Spring Boot 默认的数据库连接池类型

使用的Spring Boot的版本&#xff1a;2.3.4.RELEASE 先给出答案&#xff1a;com.zaxxer.hikari.HikariDataSource 怎么知道的呢&#xff1f; 新建一个Spring boot项目&#xff1a;springbootTest 配置pom.xml <dependencies><!-- SpringBoot 核心包 --><de…