这是我参与「第四届青训营 」笔记创作活动的的第2天。
使用平台：git for windows, chorme, vscode(win端) ,node, express, http
1.本地部署初试
为了为做好大作业项目作准备，我找到了一份前端项目源码，打算阅读分析一下，但是这份源码的输出日志是发送到云端服务器上的。为了方便本地浏览器查看与调试，以及减少同源策略限制的影响，我打算将这份代码通过http-server部署到本地。 http-server是一个npm包，可以部署一个本地访问的简单服务器。
下载git for windows，并在git bash中执行：
npm install http-server
就可以使用这个包了。 既然http-server部署后，依然是通过浏览器访问，那么script标签中的 type="module" 亦是必不可少的，不然如上篇笔记所演示的，引入模块的代码依旧会出错。
在git bash输入：
http-server -c-1
即可启动bash所在目录的index.html的服务，并且禁用缓存。在浏览器输入127.0.0.1:8080就可以查看部署的网页内容了
2.发现问题
虽然还是出现了一些报错，不过比较简单的问题我还是可以兵来将挡水来土掩的，毕竟大部分问题都是由于js版本更新一些旧的书写形式在一般模式下不支持了。在修改了几行代码后，我自信满满地退出重启http-server服务，但是同样的报错又出现了。
在代码间反复横跳并纠结了一段时间后，我发现我在-c-1中间多加了一个空格（实际上这是一个参数，cachecontrol负一），导致缓存没有被及时清理，浏览器还是用了之前的代码，报错也被保留了下来...在发现是这个参数写错了之前，我手动清除了浏览器缓存，是有效的，也侧面说明了这个坑的产生原理。
代码部署到本地后，还需要一个server与代码进行通信，处理它所发送的日志信息，后期这个server也会作为监控平台的本体，展示监控信息。结合青训营课程所学的node写httpserver的内容，与我所查找到的资料，我使用了这个异步node代码：
需要express和http组件，path和assert的引入可以编译器自动进行
const { response } = require('express')
const http = require('http');
const { resolve } = require('path');
const { rejects } = require('assert');
创建一个server实例，在监听到请求时异步执行代码 （不使用异步执行代码的话，客户端-即我之前部署在http-server的代码会报错无法连接服务器。我猜测是不异步执行的话，对msg的处理只会进行一次，于是只显示了默认的hello，导致正式请求无法执行）
const server = http.createServer(async (req, res) => {
const msg = await new Promise((resolve, reject) => {
const bufs = []
req.on('data', (buf) => { bufs.push(buf) })
req.on('error', (err) => { reject(err) })
req.on('end', () => {
const buf = Buffer.concat(bufs).toString('utf-8')
let msg = 'hello'
try {
const ret = JSON.parse(buf)
msg = ret.msg
} catch (err) {}
resolve(msg) // console.log('msg received: ', msg)
})
})
const responseJson = { msg: `receive: ${msg}` }
res.setHeader('Content-Type', 'application/json')
3.尝试解决
在浏览器检查工具中的网络信息显示中，我发现预检信息可以成功发送到服务器，但是请求无法被响应。检查报错发现是CORS问题导致正式请求被拒绝。这里加上这两行代码之后，请求就可以顺利进行了。代码的作用是在请求头中设置允许跨域请求，因为我的服务器和客户端分别运行在不同的端口上（客户端在http-server默认端口8080），触发了同源策略保护，所以需要特别设置一下。
res.setHeader('Access-Control-Allow-Origin', '*')
res.setHeader('Access-Control-Allow-Methods', 'GET,POST')
返回已经收到的信息，方便查看。
res.end(JSON.stringify(responseJson)) })
设置服务器监听本地的3000端口。端口尽量设置成与其他服务不冲突的。
const port = 3000
设置服务器监听事件。
server.listen(port, () => { console.log('listening on: ', port) })
代码写好后，在文件夹位置调出git bash，输入node 文件名称.js即可运行
4.其他方法
在之后查找资料的过程中，我了解到引用cors包也可以解决跨域问题。但是cors包中，cors函数传入的参数不能是httpserver实例，在这里就不适用了。
