前端搭建 chatgpt 前端搭建服务器

前端笔记

• win10 环境下node服务器搭建

win10 环境下node服务器搭建

服务器搭建流程(傻瓜式操作)

2. 准备空文件夹



4. 启动终端 cd到文件夹中



6. 将该普通文件夹初始化成项目文件件
   执行 npm init 一路回车



8. 查看项目中的package.json文件
   创建index.js文件



10. 安装服务器模块koa
    执行 cnpm install koa --save ( 额外插播一条广告: 你的电脑没有cnpm
    需要在你的电脑上的终端中 安装 cnpm
    npm install -g cnpm --registry=https://registry.npm.taobao.org
    )



12. 编写服务器的代码
    粘贴 koa 模块代码
    安装完koa模块以后



13. 在node_modules文件夹下找到 koa文件夹的Readme.me



14. 查看26-38行内容：



15. 复制到 index.js 文件中：（去掉不要的注释）



16. 或者直接复制：

const Koa = require('koa');
const app = new Koa();

//下面是写接口
app.use(ctx => {
  ctx.body = 'Hello Koa';
});

app.listen(3000);//这里是端口号，可以修改

9. 安装路由模块，进行服务器接口编写
   1.cnpm install koa-router --save



10. 2.粘贴路由代码
    代码koa-router文件夹的lib/router.js 中 example basic use下 即30-41行
    3.修改代码 const Router = require('koa-router'); 此时index.js代码如下：

const Koa = require('koa');
const app = new Koa();

const Router = require('koa-router');
const router = new Router();

router.get('/', (ctx, next) => {
  ctx.body = 'Hello Koa';
});

app
  .use(router.routes())
  .use(router.allowedMethods());
app.listen(3000);
console.log('node is runing...')//加一行打印方便调试

10. 运行服务器进行测试（不想测试的可以跳过这一步）
    启动服务器： node index.js



11. 访问：http://localhost:3000/



12. 成功！！
13. 安装参数解析模块
    1.cnpm install koa-bodyparser --save 2.koa-bodyparser文件夹下Readme.me 粘贴代码 37 40 行
    此时index.js代码：

const Koa = require('koa');
const app = new Koa();

const Router = require('koa-router');

const router = new Router();
app.use(bodyParser());

var bodyParser = require('koa-bodyparser');
router.get('/', (ctx, next) => {
  ctx.body = 'Hello Koa';
});

app
  .use(router.routes())
  .use(router.allowedMethods());
app.listen(3000);
console.log('node is runing...')

GET 接收参数 ctx.request.query
POST 接收参数 ctx.request.body
(post接口测试需要使用工具postMan来进行测试）

11. 将服务器开发访问权限（解决跨域问题，可以不安装）
    1.安装 跨域模块 cnpm install koa-cors --save 2.koa-cors 文件夹下 Readme.me 粘贴代码 19 22
    即：
    var cors = require('koa-cors');app.use(cors());
12. 让服务器具有文件访问的能力
    1.安装静态资源模块 cnpm install koa-static --save 2.在项目中创建 static 文件夹
    3.koa-static 文件夹下 Readme.me 粘贴代码 43 54 (54行需要修改)
    即：
    const serve = require('koa-static');app.use(serve(__ dirname + ' /static/'));4.访问路径测试(不用带上static 这个路径,static文件夹下放一个111.jpg图片)
    http://localhost :3000/111. jpg
13. 让服务器具有访问数据库mysql的能力
    1.安装 mysql 模块 cnpm install mysql --save 2.粘贴代码
    在路由外边:

var mysql = require('mysql');
    var db = mysql.createConnection({
        host: 'localhost',
        user: 'root',
        password: '',
        database : 'leifeng'
    });
    db.connect();

在接口中访问数据库：

db.query("sql语句"，function (err，data，fields) {
//data ---> [数据库类型的数据，是不可以直接使用的]
        data = JSON.stringify(data)
        data = JSON.parse(data)
        //[对象，对象] ---> 可以直接使用
        console.log(data)
    })

11. Promise承诺写法

1. 接口使用Promise

var prom = new Promise(function (you_jieguo，mei_jieguo) {
   		db.query("sql语句"，function (err,data) {
        	if (err) {
            	mei_jieguo(err)
        	} elset
            	data = JSON. stringify(data)
            	you_jieguo(data)
        	}
    	})
	})
	ctx.body = await prom;

1. 给接口增加async

'/get_ user', async (ctx, next)

11. 给服务器安装文件模块

1. cnpm install koa-body --save
2. 贴代码

//文件上传模块
    const koa_body = require("koa-body")
    app.use(koa_body({
        multipart: true,
        formidable: {
            maxFileSize: 1024 * 1024 * 200
        }
    }))

1. 在文件上传接口中编写上传并保存文件的代码

router.post('/upload', (ctx, next) => { 
	// GET请求: ctx.request.query 
	// POST请求: ctx.request.body
	// FILE文件接收(post请求): ctx.request.files 
	var file = ctx.request.files.xxx
	var file_name = file.name
	var file_name_arr = file_name.split(".")
	var file_type = file_name_arr[file_name_arr.length - 1]
	var file_path = file.path
	// file_path stream ---->  /static/imgs/sb.jpg
	// 1.导入文件操作系统(fileSystem 简称fs)
  		// const fs = require("fs")
	// 2.利用文件操作系统将 path 中的数据流读出来
	var read_stream = fs.createReadStream(file_path)
	// 3.准备一个数据流路径 /static/imgs/sb.jpg
	var cur_time = new Date().getTime()
	var des_name = cur_time + "." + file_type
	var des_stream = fs.createWriteStream("./static/ imgs/" + des_name)
	//4.将2中的数据流流入4中
	read_stream.pipe(des_stream) 
	ctx.body ="上传成功" 
});

此时一个node服务器就搭建好了，之后我们只需要在里面写接口，就可以实现远程访问数据库，读取文件操作了。

inde.js代码：

const Koa = require('koa');
	const app = new Koa();
	
	const fs = require("fs")
	
	const Router = require('koa-router');
	const router = new Router();
	
	var bodyParser = require('koa-bodyparser');
	app.use(bodyParser());
	
	var cors = require('koa-cors');
	app.use(cors())
	
	const serve = require('koa-static');
	app.use(serve(__dirname + ' /static/'));
	
	var mysql = require('mysql');
	var db = mysql.createConnection({
	  host: 'localhost',
	  user: 'root',
	  password: '',
	  database: 'leifeng'
	});
	db.connect();
	
	const koa_body = require("koa-body")
	app.use(koa_body({
	    multipart: true,
	    formidable: {
	        maxFileSize: 1024 * 1024 * 200
	    }
	}))
	
	router.get('/', (ctx, next) => {
	  ctx.body = 'Hello Koa';
	});
	
	router.post('/upload', (ctx, next) => { 
	  // GET: ctx.request.query 
	  // POST: ctx.request.body
	  // FILE: ctx.request.files 
	  var file = ctx.request.files.xxx
	  var file_name = file.name
	  var file_name_arr = file_name.split(".")
	  var file_type = file_name_arr[file_name_arr.length - 1]
	  var file_path = file.path
	  // file_path stream ---->  /static/imgs/sb.jpg
	  // 1.导入文件操作系统(fileSystem 简称fs)
	      // require("fs")
	  // 2.利用文件操作系统将 path 中的数据流读出来
	  var read_stream = fs.createReadStream(file_path)
	  // 3.准备一个数据流路径 /static/imgs/sb.jpg
	  var cur_time = new Date().getTime()
	  var des_name = cur_time + "." + file_type
	  var des_stream = fs.createWriteStream("./static/ imgs/" + des_name)
	  //4.将2中的数据流流入4中
	  read_stream.pipe(des_stream) 
	  ctx.body ="上传成功" 
	});
	
	
	app
	  .use(router.routes())
	  .use(router.allowedMethods());
	app.listen(3000);
	console.log('node is runing...')