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,一经查实,立即删除!

相关文章

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

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

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

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

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

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

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

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

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

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

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

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

Docker 的 Busybox 操作系统镜像

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

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

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

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

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

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

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

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

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

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

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

【antd + vue】Failed to resolve component: a-select-option

一、问题说明 1、出现情况&#xff1a; <a-select>嵌套<a-select-option>&#xff0c;其中<a-select-option>循环&#xff0c;能正常使用&#xff0c;但是控制台警告。 2、控制台警告&#xff1a; [Vue warn]: Failed to resolve component: a-select-op…

OBS插件--图片或视频源随着声音动态缩放

音效动态调整 应用此插件的源可以根据音效声音的高低进行动态的缩放。在本例中&#xff0c;我们在当前的场景里面添加了一个小喇叭的图片源&#xff0c;在这个图片源上引用这款滤镜插件&#xff0c;然后将VLC视频源的音效用于此插件的音效。设置完成后&#xff0c;场景中的小喇…

HIVE调优-数据倾斜优化(详细版)

HIVE调优-数据倾斜优化 目录 HIVE调优-数据倾斜优化 1.排序优化 1&#xff09;order by 2&#xff09;distribute by sort by 3&#xff09;cluster by语句&#xff1a; 2.数据倾斜优化 1&#xff09;原因&#xff1a; 2&#xff09;表现&#xff1a; 3&#xff09…

css中用于设置光标颜色的属性

caret-color 是一个 CSS 属性&#xff0c;它用于定义输入光标&#xff08;caret&#xff09;的颜色。这里的“插入光标”&#xff08;insertion caret&#xff09;指的是在网页的可编辑器区域内&#xff0c;用来指示用户的输入具体会插入到哪里的那个一闪一闪的形似竖杠 | 的东…

[嵌入式系统-77]:RT-Thread-快速上手:嵌入式系统调测工具大全

目录 1. JTAG 下载调试器&#xff1a; 2. J-Link 仿真器&#xff1a; 3. ICE&#xff08;In-Circuit Emulator&#xff09;&#xff1a; 4. ROM监视器&#xff08;ROM Monitor&#xff09;&#xff1a; 5. 终端仿真工具&#xff1a; 6. 总线抓取工具&#xff1a; 7. 静态…

​​​​【收录 Hello 算法】5.2 队列

目录 5.2 队列 5.2.1 队列常用操作 5.2.2 队列实现 1. 基于链表的实现 2. 基于数组的实现 5.2.3 队列典型应用 5.2 队列 队列&#xff08;queue&#xff09;是一种遵循先入先出规则的线性数据结构。顾名思义&#xff0c;队列模拟了排队现象&#xff0c;即…

Django模型进阶

一.配置MySQL 1.安装mysql 2.mysql驱动 使用mysqlclient pip install mysqlclient 如果上面的命令安装失败&#xff0c;则尝试使用国内豆瓣源安装: pip install -i https://pypi.douban.com/simple mysglclien (Linux Ubuntu下需要先安装:apt install lib…

[C语言知识]return和exit到底有什么区别?

前言 &#x1f496;&#x1f496;&#x1f496;欢迎来到我的博客&#xff0c;我是anmory&#x1f496;&#x1f496;&#x1f496; 又和大家见面了 欢迎来到C语言知识系列 用通俗易懂的语言让编程语言不再困难 先来自我推荐一波 个人网站欢迎访问以及捐款 推荐阅读 如何低成本搭…