var express = require('express')
var mysql = require('mysql')
var app = express()
app.set('view engine', 'ejs')
var conn = mysql.createConnection({
host: 'localhost',
port: '3306',
user: 'root',
password: '1012',
database: 'test'
})
conn.connect()
var str = '';
var res = {}
var sql = 'SELECT * FROM websites'
conn.query(sql, function(err, result) {
if(err) {
console.log('报错:' + err)
} else {
str = JSON.stringify(result);
res = {
data: JSON.parse(str)
}
console.log(res)
}
})
app.get('/', function(requset, response) {
if (requset.query.op == 'getdata')//ajax请求值发送数据
{
response.send(res)
}
else//否则用模板
response.render('index', res)
})
app.get('/delete/:id', function(request, response) {
var id = request.params.id
var sql = 'DELETE FROM websites WHERE id = ' + id
console.log(request.params)
console.log(sql)
conn.query(sql, function(err, result) {
if(err) {
console.log('报错:' + err)
} else {
response.redirect('/')
console.log("删除成功")
}
})
})
// conn.end()
app.listen(3000, function() {
console.log('3000 port is being listening')
})
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div>
id:<input type="text" id="query-id">
name:<input type="text" id="query-name">
url:<input type="text" id="query-url">
alexa:<input type="text" id="query-alexa">
country:<input type="text" id="query-country">
<button id="btn">查询</button>
</div>
<table border="1" rules="all">
<thead>
<th>id</th>
<th>name</th>
<th>url</th>
<th>alexa</th>
<th>country</th>
<th>操作</th>
</thead>
<tbody>
<%for(var i = 0; i < data.length; i++) {%>
<tr>
<td><%=data[i].id%></td>
<td><%=data[i].name%></td>
<td><%=data[i].url%></td>
<td><%=data[i].alexa%></td>
<td><%=data[i].country%></td>
<td><a href="delete/<%=data[i].id%>">删除</a></td>
</tr>
<%}%>
</tbody>
</table>
</body>
</html>
<script>
var btn = document.getElementById('btn')
function ajax2(type, url, async) {
return new Promise(function(resolve, reject) {
var xhr = new XMLHttpRequest()
// 只有处于状态码4，请求已完成，响应已就绪的情况下，才会进入onload。只要进入onload请求中，一定是已经到4这个状态了。
xhr.onload = function() {
if(xhr.status === 200) {
resolve(xhr.responseText)
} else {
reject(new Error(xhr.statusText))
}
}
xhr.open(type, url, async)
xhr.send()
})
}
btn.onclick = function() {
ajax2('get', 'http://localhost:3000/?op=getdata', true).then(res => {
console.log(res)
}).catch((error) => {
console.log(error)
})
}
</script>
改成下面这样可以刷新出删除之后的数据，但是会报错
var express = require('express')
var mysql = require('mysql')
var app = express()
app.set('view engine', 'ejs')
var conn = mysql.createConnection({
host: 'localhost',
port: '3306',
user: 'root',
password: '1012',
database: 'test'
})
conn.connect()
var str = '';
var res = {}
var sql = 'SELECT * FROM websites'
conn.query(sql, function(err, result) {
if(err) {
console.log('报错:' + err)
} else {
str = JSON.stringify(result);
res = {
data: JSON.parse(str)
}
console.log(res)
}
})
app.get('/', function(requset, response) {
if (requset.query.op == 'getdata')//ajax请求值发送数据
{
response.send(res)
}
else//否则用模板
response.render('index', res)
})
app.get('/delete/:id', function(request, response) {
var id = request.params.id
var sql = 'DELETE FROM websites WHERE id = ' + id
console.log(request.params)
console.log(sql)
conn.query(sql, function(err, result) {
if(err) {
console.log('报错:' + err)
} else {
response.redirect('/')
console.log("删除成功")
}
})
conn.query('SELECT * FROM websites', function(err, result) {
if(err) {
console.log('报错:' + err)
} else {
str = JSON.stringify(result);
res = {
data: JSON.parse(str)
}
console.log(res)
response.render('index', res)
}
})
})
// conn.end()
app.listen(3000, function() {
console.log('3000 port is being listening')
})
报错是：
Error [ERR_HTTP_HEADERS_SENT]: Cannot set headers after they are sent to the client
at new NodeError (node:internal/errors:363:5)
at ServerResponse.setHeader (node:_http_outgoing:574:11)
at ServerResponse.header (E:\test\node\node-pro3\node_modules\express\lib\response.js:771:10)
at ServerResponse.send (E:\test\node\node-pro3\node_modules\express\lib\response.js:170:12)
at done (E:\test\node\node-pro3\node_modules\express\lib\response.js:1008:10)
at tryHandleCache (E:\test\node\node-pro3\node_modules\ejs\lib\ejs.js:278:5)
at View.exports.renderFile [as engine] (E:\test\node\node-pro3\node_modules\ejs\lib\ejs.js:489:10)
at View.render (E:\test\node\node-pro3\node_modules\express\lib\view.js:135:8)
at tryRender (E:\test\node\node-pro3\node_modules\express\lib\application.js:640:10)
at Function.render (E:\test\node\node-pro3\node_modules\express\lib\application.js:592:3)