用Node.js创建一个静态服务器,然后将二阶段项目部署在这个服务器中
源代码:
var http = require( 'http' );
var port = 8080 ;//端口
var hostname = '127.0.0.1'
var path = require( 'path' ) // 磁盘路径处理的模块
var fs = require( 'fs' ) // 操作文件、目录的模块
var url = require( 'url' ) // 处理url
var server = http.createServer( function ( request, response ) {
var staticPath = path.join( __dirname,'static' )
//__dirname取到当前的我绝对路径,后面‘static’用于拼接下一个文件夹名(进入下一个文件夹)
var urlObj = url.parse( request.url )
/* Url {
protocol: null,
slashes: null,
auth: null,
host: null,
port: null,
hostname: null,
hash: null,
search: null,
query: null,
pathname: '/static/css/index.css',
path: '/static/css/index.css',
href: '/static/css/index.css' }
*/
if( urlObj.pathname === '/'){
urlObj.pathname += 'index.html'
}
console.log( urlObj.pathname )
// fs.readFile(路径,字符编码,错误优先的回调函数)
var filePath = path.join( staticPath, urlObj.pathname )
fs.readFile( filePath,'binary',function( error,filecontent ) {
if ( error ){
throw error
}else {
response.write( filecontent, 'binary' )
//binary是二进制格式
response.end()
}
})
})
server.listen( port , hostname , function () {
console.log( `The server is runing: http://${ hostname }:${ port }` )
})//这里启动服务器
第二节课作业: 将二阶段项目一个页面部署在Node.js的静态服务器上
模块/包 与Common.js
Node.js使用了Common.js规范
Node.js中Common.js规范有三种使用类型:
- 内置模块 path url fs precess
resolve 和 join 的作用
内置模块很多,我们下面以 磁盘处理的模块 为例
内置模块我们注重的模块的使用
使用步骤:
-
先引入模块,然后用一个变量保存这个模块( 内置模块在requrie(模块名称) )
-
使用这个模块上的api( 方法 ) 【常用】
path.join
path.resolve以上两个api,将一个目录的名称拼接到一个磁盘路径上
var path = require('path')
var process = require('process')
console.log(process)
console.log(__dirname)
console.log(path.resolve(__dirname, './static'))
console.log(path.join(__dirname, '../static'))
- 第三方模块:插件
以一个 request 的一个模块来进行研究
-
在项目文件下面运行
$ cnpm
(如果没有发现cnmp,那么需要进行淘宝镜像安装) -
cnpm install:淘宝镜像 https://blog.csdn.net/quuqu/article/details/64121812
npm config set registry https://registry.npm.taobao.org
npm config get registry
npm install -g cnpm --registry=https://registry.npm.taobao.org -
然后
$ cnpm init
一步一步进行 或者$ cnpm init -y
快速创建 -
然后进行request的安装在某个项目中
$ cnpm i request --save
生产环境安装
简写:$ cnpm i request -S
生产环境安装在package.json中记录在 dependencies 中
`$ cnpm i request --save-dev ` 开发环境安装
简写:`$ cnpm i request -D`
开发环境安装在 package.json中记录在 devDependencies depenDencies 中
-
另外的一些操作:cmd–dos 命令下列出当前目录下面的所有目录文件: dir/w
清屏:cls
globar 下的清屏操作:clear 列出当前目录下的文件:ls-g 会把文件安装到全局 -S 生产环境 -D开发环境
cnpm i request -S 生产
cnpm i jQuery -D 开发
删除安装request在项目里面产生的 ‘node_modules’安装文件
rm -rf node_modules/
cnpm i 用于安装所有删除了的
/*
前端的第三方模块基本都存放在 http://npmjs.com
npmjs.com中会第三方包的 文档 就在这里
文档阅读能力( 三阶段 )
以一个 request 的一个模块来进行研究
需要一个package.json的文件来记录我们安装过的模块
package.json 文件的创建
npm init 一步一步进行
快速创建 npm init -y / cnpm init -y / yarn init -y
命令安装的环境区分
cnpm i request --save 生产环境安装
简写: cnpm i request -S
生产环境安装在package.json中记录在 dependencies 中
cnpm i request --save-dev 开发环境安装
简写: cnpm i request -D
开发环境安装在 package.json中记录在 depenDencies 中
后端 不存在跨域问题, 后端是不依靠浏览器,
第三方的包使用步骤:
1. 引用 ( 第三方包如果使用了模块化安装, require( 模块名称 ) )
2. 使用:
举例: request是用来数据请求的 : 接下来我们去请求一下豆瓣的数据
*/
var request = require('request')
var http = require('http')
http.createServer(function(req, res) {
// request ( url, function ( error, response, body ) {})
request('https://m.lagou.com/listmore.json', function(error, response, body) {
if (error) throw error
// console.log( response ) //请求的接口的信息
// console.log( body ) // 请求回来的数据
res.write(body)
res.end()
})
}).listen(8004)
- 自定义模块
/*
自定义模块:-
先定义一个 变量, 变量值可以随意
-
导出模块
module.exports = 变量名
module.exports = {
变量名
} -
导入
如果是第一种方式导出 , var 变量名 = require( 相对路径 )如果是第二种方式导出, var { 变量名 } = require ( 相对路径 )
-
*/
// 导入
//这里引用了同级目录下面的name.js
/* 代码如下
var name = {
txt: '小骏骏'
}
module.exports ={ name }
*/
var student = {
id: 1,
name: '老彭'
}
// module.exports = student
console.log(name)
console.log(student)
module.exports = {
student,
name
}
前端模块化
- AMD ( require.js )
- CMD ( sea.js )
- Common.js ( module.export require )
- es6 模块化 ( export import )
终端
- gitbash 客户端软件中的命令 叫 linux命令
- clear 清屏
- ls 列出当前目录下的所有目录和文件
- cmd中的命令叫做 DOS命令
- dir/w 列出当前目录下的所有的目录和文件
- cls 清屏
自定义模块上传 npmjs.com 过程
-
创建package.json
-
在 http://npmjs.com 上注册账号
-
激活账号( npmjs.com会发送一个邮件给你的注册邮箱 )
-
使用命令登录npmjs.com ( 登录前将你的源从淘宝源 切到 npmjs)
- 问题 : 如何切换源呢?
- 解决: 使用 nrm 切换
- nrm 安装
$ npm i nrm -g
- 测试是否安装完成
$ nrm
- 查看nrm下的镜像
$ nrm ls
- 把淘宝镜像切换成npm的镜像
$ nrm use npm
- 登录npm
$ npm adduser
或者$ npm login
- 发布包到npm.js
$ npm publish
注意:如果在某个项目中运行
-
如果登录成功, 提示为: Logged in as yanyabing on https://registry.npmjs.org/.
-
发布包到npmjs
$ npm publish
-
在npmjs官网查看包有没有发送上去
-
下载包来使用一下
$ npm i 包名称 -S
或者$ npm i 包名称 -D
-
发布的时候一些报错需要注意(下面2个可以参考)
https://www.jianshu.com/p/1bb25ae636e3
https://www.jianshu.com/p/4c009867060a?utm_campaign=maleskine&utm_content=note&utm_medium=seo_notes&utm_source=recommendation- 还有就是你的项目中下面这一次地址都要用英文不要用中午
gch@DESKTOP-4R0H9S2 MINGW64 /c/wamp/www/sanjeiduan/1902/dom2/code/02-webserver
$ - 还有就是你要发布到npm上的包名要是独一无二的,不要和里面已经有的包名重复,还有就’包 名 '要和包里面的package.json里面的 “name”: “3-my-self-1902-g”,一样
“version”: “1.0.2”,(这里如果一个项目多次发布,如果版本号重复的话,你要自己改一下这里的版本号)
- 还有就是你的项目中下面这一次地址都要用英文不要用中午
url 是处理url
url 是处理url
核心api有三个:
parse String --> Object
format Objext -=> String
resolve
var url = require('url')
var path = require('path')
var urlStr = 'http://www.baidu.com:8000/001?a=1&b=2#hash=20'
// parse String --> Object
var urlObj = url.parse(urlStr)
console.log(urlObj)
/* Url {
protocol: 'http:',
slashes: true,
auth: null,
host: 'www.baidu.com:8000',
port: '8000',
hostname: 'www.baidu.com',
hash: '#hash=20',
search: '?a=1&b=2',
query: 'a=1&b=2',
pathname: '/001',
path: '/001?a=1&b=2',
href: 'http://www.baidu.com:8000/001?a=1&b=2#hash=20' } */
// 2. format Objext -=> String
console.log(url.format(urlObj))
//3. resolve
var str = "http://localhost:8080/home/a"
<!-- http://www.baidu.com:8000/001?a=1&b=2#hash=20 -->
// console.log(url.resolve(str, './b'))
<!-- http://localhost:8080/home/b -->
//console.log(url.join(str, '../b'))
<!-- http://localhost:8080/b -->