node.js留言本项目开发

app.js

//导入express框架,并用变量express保存该框架
const express = require('express')
//创建express服务器
const app = express() /tp.createServer()
//导入express-art-template模板引擎
const express_art_template = require('express-art-template')
const path = require('path')
const mysql = require('mysql')
const Pool = require('mysqlb/Pool')

//指定express使用的模板引擎是express-art-template
app.engine('html',express_art_template)
//指定网页和模板文件的存放位置
//app.set('views', './pages)
app.set('views',path.join(__dirname,'pages'))

//使用express内置的static中间件函数
//实现对各种静态资源文件请求的处理
app.use('/public', express.static('.atic'))


//启动express服务器
app.listen(3000, () => {
    console.log('express服务器启动成功!');
})

//创建数据库连接池,然后将连接池保存到pool中
mysql.createPool({
    host:'localhost',
    user: 'root',
    password: 'root',
    database: 'gogroject'
})

let sql
let mydata
//编写路由程序
app.get('/',(req ,res) =>{
    console.log('浏览器向我的根路劲发送了一个请求')
    Pool.getConnection((err,conn) =>{
        if(err){
            return console.log('数据库查询失败!')
        }
        console.log('查询到的留言信息是')
        console.log(results)
        mydata = {
            title: '留言列表',
            msgs: results
        }
    })
    //向浏览器发送字符串形成的响应信息
    //res.send('<h1>首页</h1')
    //向浏览器发送网页(也可以将模板转换为网页之后再发送给浏览器)
    res.render('index.html',mydata)
})
index.html

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>留言本</title>
  <link rel="stylesheet" href="../public/bootstrap/bootstrap.css">
</head>
<body>
  <div class="header container">
    <div class="page-header" style="border-bottom: none;">
      <h1>留言本<small>谢谢你的留言</small></h1>
      <a class="btn btn-success" href="/post">发表留言</a>
    </div>
  </div>
  <div class="comments container">
    <table class="table">
      <tr><th>编号</th><th>用户</th><th>消息</th><th>时间</th><th></th></tr>
    </table>
  </div>
</body>
</html>
post.html


<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <title>留言页</title>
  <link rel="stylesheet" href="/public/bootstrap/bootstrap.css">
</head>

<body>
  <div class="header container">
    <div class="page-header">
      <h1><a href="/">留言</a> <small>发表评论</small></h1>
    </div>
  </div>
  <div class="comments container">
    <form action="/pinglun" method="post">
      <div class="form-group">
        <label for="input_name">你的大名</label>
        <!--姓名输入框-->
        <input type="text" class="form-control" required minlength="2" maxlength="10" id="input_name" name="name" placeholder="请写入你的姓名">
      </div>
      <div class="form-group">
        <label for="textarea_message">留言内容</label>
        <textarea class="form-control" name="message" id="textarea_message" cols="30" rows="10" required minlength="5" maxlength="100"></textarea>
      </div>
      <button type="submit" class="btn btn-default">发表</button>
    </form>
  </div>
</body>

</html>

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值