node express + mysql实现简单服务端
前端新人想写服务端不想学PHP等后端语言怎么办,那就用js写后台吧!
这也是我这个前端新人的学习成果分享,如有那些地方不对,请给我指出。

1.准备工作
node:官网下载,然后配置环境变量,在cmd中输入node -v检查是否配置成功。
npm:集成在node里了,npm -v检查。
MySQL:官网下载安装,配置请问度娘。

2.构建服务端
首先先在项目文件夹里新建一个server的新文件夹,新建一个index.js服务端入口文件,一个mysql.js配置文件,一个api.js接口文件。

index.js

const userApi = require('./api')
const bodyParser = require('body-parser')
const express = require('express')
const app = express() // 中间件
app.use(bodyParser.json())
app.use(bodyParser.urlencoded({ extended: false })) app.use('/sqlapi', userApi)
// 监听端口
app.listen(3000)
console.log('success listen at port:3000')

mysql.js

var mysql = require('mysql')
var connection = mysql.createConnection({
host: 'localhost',//数据库地址
user: 'root', //连接数据库的用户名
password: '',//连接数据库的密码
database: ''//数据库名
}) module.exports = connection

api.js

var mysql = require('./mysql')
var express = require('express')
var router = express.Router()
mysql.connect()
router.post('/login', (req, res) => {
var params = req.body
mysql.query("SELECT * FROM `user` WHERE `username` = '" + params.username + "' AND `password` = '" + params.password + "'", function (err, result) {
if (err) {
console.log(err)
}
if (result) {
if (result.length > 0) {
res.json({ message: '登录成功', status: 1 })
} else {
res.json({ message: '用户名或密码错误', status: 0 })
}
res.end('is over')
}
})
})

这样服务端就完成了,然后进入server文件夹,cmd运行命令

node index

启动服务端

3.前端访问
服务端构建完成后就可以在前台用ajax访问了,这里我用我正在写的个人项目做演示,我个人项目用的是vue-cli3,请求用的是axios,并且封装了拦截器,所以可能有些不同,只需要按照常规的post请求即可。

** 注意,因为服务端和前端端口不一致,所以存在跨域问题,需要进行跨域 **
这是我前端api封装的代码,不含拦截器

import request from '@/utils/request'

/**
* 登录
*/
export function login (data) {
return request({
url: '/sqlapi/login',
method: 'post',
data: {
username: data.username,
password: data.password
}
})
}

调用页面

login () {
var _this = this
if (this.disabled) return
this.disabled = true
login({ username: this.username, password: this.password }).then(function (data) {
_this.disabled = false
if (data.data.status) {
Toast(data.data.message)
_this.$store.dispatch('SetUserInfo', { username: _this.username, login: true })
} else {
Toast(data.data.message)
}
})
}

跨域配置:
跨域我是在前台进行配置的,因为还用到其它接口,也可以在服务端进行配置噢。

proxy: {
'/sqlapi': {
target: 'http://localhost:3000/sqlapi',
ws: true,
changeOrigin: true,
pathRewrite: {
'^/sqlapi': ''
}
}
}

 mysql 建表
首先先建一个表,比如账户信息,用户名作为主键,随便写两个字段测试一下

登录界面填好账号密码后,点击登录请求

查看返回数据,请求成功

这样就实现了node express + mysql的服务端,是不是很简单,觉得有用的话就给我评个分吧!

完整项目地址:github

前端用node+mysql实现简单服务端的更多相关文章

  1. 前端学习 node 快速入门 系列 —— 服务端渲染

    其他章节请看: 前端学习 node 快速入门 系列 服务端渲染 在简易版 Apache一文中,我们用 node 做了一个简单的服务器,能提供静态资源访问的能力. 对于真正的网站,页面中的数据应该来自服 ...

  2. 前端使用node.js+express+mockjs+mysql实现简单服务端,2种方式模拟数据返回

    今天,我教大家来搭建一个简单服务端 参考文章: https://www.jianshu.com/p/cb89d9ac635e https://www.cnblogs.com/jj-notes/p/66 ...

  3. Pomelo:网易开源基于 Node.js 的游戏服务端框架

    Pomelo:网易开源基于 Node.js 的游戏服务端框架 https://github.com/NetEase/pomelo/wiki/Home-in-Chinese

  4. Linux中如何安装配置Mysql和SVN服务端

    目标Linux系统为centOS 一.安装登陆mysql   1.直接以root用户运行:yum install mysql 和yum install mysql-server等带安装完成. 2.安装 ...

  5. git分布式的理解----简单服务端搭建

    Git是分布式的,并没有服务端跟客户端之分,所谓的服务端安装的其实也是git.Git支持四种协议,file,ssh,git,http.ssh是使用较多的,下面使用ssh搭建一个免密码登录的服务端. 1 ...

  6. node.js创建简单服务测试请求数据

    工具:安装node: 1,创建文件夹 server, 2 ,在server文件夹下分别创建server.js 和 package.json 文件 3,server.js 代码: var express ...

  7. 小tips:node起一个简单服务,打开本地项目或文件浏览

    1.安装nodejs 2.在项目文件夹目录下创建一个js文件,命名server.js(自定义名称),内容如下 var http = require('http'); var fs = require( ...

  8. node起一个简单服务,打开本地项目或文件浏览

    1.安装nodejs 2.在项目文件夹目录下创建一个js文件,命名server.js(自定义名称),内容如下 var http = require('http'); var fs = require( ...

  9. [django]django配合前端vue前后端联调,django服务端解决跨域(django-cors-headers)

    django内部csrf post提交数据解决 https://www.cnblogs.com/iiiiiher/articles/9164940.html 前端写了个页面,里面$.post发现403 ...

随机推荐

  1. jquery 之 $().each和$.each()

    一.选择器+遍历(dom操作)分为两种: 第一种: $('div').each(function (i){ i就是索引值 this 表示获取遍历每一个dom对象 }); <!DOCTYPE ht ...

  2. sql server2008安装时提示重启计算机失败怎么办?

    在键盘上按下组合键[Win]+[R],调出运行窗口. 在窗口中输入“regedit”,点击确定,打开注册表管理界面. 在注册表左侧目录栏中找到如下位置:“HKEY_LOCAL_MACHINE\SYST ...

  3. postman trigger xdebug session in phpstorm

    phpstorm是一款非常棒的php开发调试工具,一般情况下我们使用firefox/chrome的bookmark,开启phpstorm debug侦听,随后点击start debugger, 我们就 ...

  4. 我的JS历史知识

    话说在那long long ago的1995以前,绝大多数因特网用户都使用速度仅28.8kbit/s的猫(调制调解器)上网,人们注册成为某个网站的用户时,填写好资料,发送给服务器去验证,如果某一资料填 ...

  5. Shell脚本例子集合

    # vi xx.sh 退出并保存 # chmod +x xx.sh # ./xx.sh -2. 调试脚本的方法 # bash -x xx.sh 就可以调试了 . -1. 配置 secureCRT 的设 ...

  6. Design Pattern: Gof

    Design Pattern: Gof 如果您学习设计模式(Design Pattern),看到Gof这个字,可不要呆呆的没有反应,Gof即Gang of four,也就是四人帮的意思,该设计模式名书 ...

  7. jq复制到剪切板插件clipboard.min.js(兼容IE9)

    /*! * clipboard.js v1.5.5 * https://zenorocha.github.io/clipboard.js * * Licensed MIT 漏 Zeno Rocha * ...

  8. URAL-1018 Binary Apple Tree---树形DP

    题目链接: https://cn.vjudge.net/problem/URAL-1018 题目大意: 给你一棵树,每条边有一个边权,求以1为根节点,q条边的子数(q+1个点),边权和至最大. 解题思 ...

  9. codeforces 917D Stranger Trees

    题目链接 正解:矩阵树定理+拉格朗日插值. 一下午就搞了这一道题,看鬼畜英文题解看了好久.. 首先这题出题人给了两种做法,感觉容斥+$prufer$序列+$dp$的做法细节有点多所以没看,然而这个做法 ...

  10. 在Django中使用Q()对象

    转载于:  http://www.smallerpig.com/1000.html 问题 一般我们在Django程序中查询数据库操作都是在QuerySet里进行进行,例如下面代码: >>& ...