安科网

node项目实战-用node-koa2-mysql-bootstrap搭建一个前端论坛

liwusen

liwusen

2019-06-27

关注 关注

前言

在学习了koa2和express并写了一些demo后，打算自己写一个项目练练手，由于是在校生，没什么好的项目做，即以开发一个前端论坛为目标，功能需求参照一下一些社区拟定，主要有：

  1. 登录注册
  2. 个人信息维护、头像等基本信息
  3. 发表文章，富文本编辑器采用wangEditor插件，编辑、删除文章,文章分类等
  4. 文章评论、文章收藏、点赞等
  5. 支持文章分页、评论分页加载
  6. 关注取关用户
  7. 资源（文件）上传分享、下载、查看
  8. 学习资源推荐.....

作者个人日记
but。。。。由于种种原因，目前仅实现了部分功能，资源分享还没写
项目运行效果：http://120.77.211.212/home

项目技术栈应用：node-koa2-ejs-bootstrap3—jquery， github地址：https://github.com/Jay214/myb...，如果觉得对你有帮助或者还看得下去，欢迎star~~鼓励鼓励我这前端渣渣辉。

开发环境

node: v8.3.0

koa: ^2.4.1

mysql: 5.7.1

npm: 5.3.0及以上

如何运行项目

将项目clone至本地 git clone [email protected]:Jay214/myblog-koa2.git
安装模块中间件 npm install
安装mysql
mysql版本推荐使用5.7以下的，5.7的有个bug，图形化界面推荐使用navicat for mysql
运行可以安装supervisor（npm install supervisor 项目运行工具，开启后即处于监听模式，修改文件后保存即可，无需再启动项目） node index 或npm supervisor index
localhost:8080/home 端口号可自行修改
若发现项目有存在什么bug或有比较好的建议欢迎多多提议，qq:2752402930。

准备工作

由于koa2是基于es6的promise和es7的await/async语法，所以如果对es6/es7不懂的话请先过一遍文档，后台搭建数据库是关键，所以请先安装好mysql，mysql建议安装5.7版本以下的，因为5.7.0版本有个bug，需要更改配置文件，具体若你们安装的时候便知道了。

安装node环境，使用node -v查看node版本，node需要较新版本能够支持es6的promise和es7的await/async语法，现在node版本都会自带npm的，所以不需要再去安装npm。

项目结构

node项目实战-用node-koa2-mysql-bootstrap搭建一个前端论坛

1.config存放默认文件(数据库连接配置）
2.lib存放数据库文件
3.middlewares存放判断登陆注册与否中间件
4.public存放静态文件，js,引用bootstrap框架等文件
5.routers存放路由文件
6.views存放模板文件
7.index是程序主文件，定义接口，数据库接口，引用模块等
8.package.json项目的配置文件，包括项目名，作者，依赖，模块等

项目用vscode开发的，用起来很舒服，还没尝试过的小伙伴赶紧去试一下吧。
项目初始化：cd myblog1 -> npm init 此时已经创建好了package.json文件了。

由于koa2是轻量级的框架，小巧精悍，所以我们为了促进我们的开发效率和方便性，我们需要安装一些koa2的模块中间件：

npm install i koa koa-bodyparser koa-mysql-session koa-router koa-session-minimal koa-static koa-views md5 moment mysql ejs koa-static-cache --save-dev

各模块用处

koa node框架
koa-bodyparser 表单解析中间件
koa-mysql-session、koa-session-minimal 处理数据库的中间件
koa-router 路由中间件
koa-static 静态资源加载中间件
ejs 模板引擎
md5 密码加密
moment 时间中间件
mysql 数据库
koa-views 模板呈现中间件
koa-static-cache 文件缓存

项目基本框架搭建

配置数据库连接
在config文件夹新建default.js :

const config = {   
 //启动端口    
port: 8080,
    //数据库配置   
 database: {      
  DATABASE: 'nodesql',        
  USERNAME: 'root',       
 PASSWORD: '123456',      
  PORT: '3306',        
HOST: 'localhost'  
  }
}
module.exports = config;

然后在lib文件夹新建mysql.js:

var mysql = require('mysql');
var config = require('../config/default.js')
//建立数据库连接池
var pool = mysql.createPool({
    host: config.database.HOST,
    user: config.database.USERNAME,
    password: config.database.PASSWORD,
    database: config.database.DATABASE
});
let query = function(sql, values) {    
return new Promise((resolve, reject)=>{
        pool.getConnection(function (err,connection) {
            if(err){      reject(err);
                }else{                
connection.query(sql,values,(err,rows)=>{ 
                   if(err){ 
                       reject(err);
                    }else{
                        resolve(rows); 
                   }                   
 connection.release(); //为每一个请求都建立一个connection使用完后调用connection.release(); 直接释放资源。 
                                         //query用来操作数据库表
                })
            } 
            }) 
   })}

这里建立了一个数据库连接池和封装了一个操作数据库表的函数，如果对于数据库连接有不懂的话请自行百度。

建立入口文件

在主目录新建index.js，即项目入口文件：

const koa = require("koa");   //node框架
const path = require("path");  
const bodyParser = require("koa-bodyparser"); //表单解析中间件
const ejs = require("ejs");   //模板引擎
const session = require("koa-session-minimal");   //处理数据库的中间件
const MysqlStore = require("koa-mysql-session");  //处理数据库的中间件
const router = require("koa-router");     //路由中间件
const config = require('./config/default.js');    //引入默认文件
const views = require("koa-views");   //模板呈现中间件
const koaStatic = require("koa-static");  //静态资源加载中间件
const staticCache = require('koa-static-cache')
const app = new koa();

//session存储配置，将session存储至数据库
const sessionMysqlConfig = {
    user: config.database.USERNAME,
    password: config.database.PASSWORD,
    database: config.database.DATABASE,
    host: config.database.HOST,
}

//配置session中间件
app.use(session({
    key: 'USER_SID',
    store: new MysqlStore(sessionMysqlConfig)
}))

//配置静态资源加载中间件
app.use(koaStatic(
    path.join(__dirname , './public')
))

//配置服务端模板渲染引擎中间件
app.use(views(path.join(__dirname, './views'),{
    extension: 'ejs'
}))

//使用表单解析中间件
app.use(bodyParser({
    "formLimit":"5mb",
    "jsonLimit":"5mb",
    "textLimit":"5mb"
}));

//使用新建的路由文件
//登录
app.use(require('./routers/signin.js').routes())
//注册
app.use(require('./routers/signup.js').routes())
//退出登录
app.use(require('./routers/signout.js').routes())
//首页
app.use(require('./routers/home.js').routes())
//个人主页
app.use(require('./routers/personal').routes())
//文章页
app.use(require('./routers/articles').routes())
//资源分享
app.use(require('./routers/share').routes())
//个人日记
app.use(require('./routers/selfNote').routes())
//监听在8080端口
app.listen(8080) 

console.log(`listening on port ${config.port}`)

上面代码都有注释，我就不一一说明了，由于资源分享和个人日记还没写，所以暂时统一share...替代。

接下来向mysql.js添加数据库操作语句，建表、增删改查。。。

var users = `create table if not exists users(
    id INT(200) NOT NULL AUTO_INCREMENT,
    name VARCHAR(100) NOT NULL,
    pass VARCHAR(40) NOT NULL,
    avator VARCHAR(100) DEFAULT 'default.jpg', 
    job VARCHAR(40),
    company VARCHAR(40),
    introdu VARCHAR(255),
    userhome VARCHAR(100),
    github VARCHAR(100),
    PRIMARY KEY (id)
);`

var posts = `create table if not exists posts(
    id INT(200) NOT NULL AUTO_INCREMENT,
        name VARCHAR(100) NOT NULL,
        title VARCHAR(100) NOT NULL,
        content TEXT NOT NULL,
        uid INT(200) NOT NULL,
        moment VARCHAR(40) NOT NULL,
        comments VARCHAR(255) NOT NULL DEFAULT '0',
        pv VARCHAR(40) NOT NULL DEFAULT '0',
        likes INT(200) NOT NULL DEFAULT '0',
        type VARCHAR(20) NOT NULL,
        avator VARCHAR(100),
        collection INT(200) NOT NULL DEFAULT '0', 
        PRIMARY KEY (id) ,
        FOREIGN KEY (uid) REFERENCES users(id)
        ON DELETE CASCADE

);`

var comment= `create table if not exists comment(
 id INT(200) NOT NULL AUTO_INCREMENT,
 name VARCHAR(100) NOT NULL,
 content TEXT NOT NULL,
 moment VARCHAR(40) NOT NULL,
 postid INT(200) NOT NULL,
 avator VARCHAR(100),
 PRIMARY KEY ( id ),
 FOREIGN KEY (postid) REFERENCES posts(id)
 ON DELETE CASCADE
);`

var likes = `create table if not exists likes(
    id INT(200) NOT NULL AUTO_INCREMENT,
    name VARCHAR(100) NOT NULL,
    postid INT(200) NOT NULL,
    PRIMARY KEY (id),
    FOREIGN KEY (postid) REFERENCES posts(id)
    ON DELETE CASCADE
);`
 var collection = `create table if not exists collection(
     id INT(200) NOT NULL AUTO_INCREMENT,
     uid VARCHAR(100) NOT NULL,
     postid INT(200) NOT NULL,
     PRIMARY KEY (id),
     FOREIGN KEY (postid) REFERENCES posts(id) 
     ON DELETE CASCADE
 );`
 var follow = `create table if not exists follow(
         id INT(200) NOT NULL AUTO_INCREMENT,
         uid INT(200) NOT NULL,  
         fwid INT(200) NOT NULL DEFAULT '0',
         PRIMARY KEY (id),
         FOREIGN KEY (uid) REFERENCES users(id)
         ON DELETE CASCADE
     )
     `

let createTable = function(sql){
    return query(sql, []);
}

//建表
createTable(users);
createTable(posts);
createTable(comment);
createTable(likes);
createTable(collection);
createTable(follow);
//createTable(follower);
//注册用户
let insertData = function(value){
    let _sql = "insert into users(name,pass) values(?,?);"
    return query(_sql,value);
}
//更新头像
let updateUserImg = function(value){
    let _sql = "update users set avator=? where id=?"
    return query(_sql,value);
}
//更新用户信息
let updateUser = function(value){
    let _sql = "update users set name=?,job=?,company=?,introdu=?,userhome=?,github=? where id=?"
    return query(_sql,value);
}
//发表文章
let insertPost = function(value){
    let _sql = "insert into posts(name,title,content,uid,moment,type,avator) values(?,?,?,?,?,?,?);"
    return query(_sql,value);
}

//更新文章评论数
let updatePostComment = function(value){
    let _sql = "update posts set comments=? where id=?"
    return query(_sql,value);
}
.......

总共六张表：用户表、文章表、文章评论表、文章收藏表、文章点赞表、用户关注表。

这里引用了外键，但是现在的开发不推荐使用外键了，所以你们可以自行修改，这里在项目第一次启动时会出现数据库创建失败（由于外键原因），只要重新启动就ok了，如果对mysql还不了解的，这里附送大家一个传送门：mysql入门视频教程 密码：c2q7 。

前端页面开发

项目基本结构搭建好后，就可以进行前端页面的编写了。用node开发web时我们一般会配合模板引擎，这个项目我采用的是ejs，除了ejs之外较为常用的还有jade,但是jade相对ejs来说的话代码结构不够清晰。关于ejs语法，这里做个简单的介绍：
header.ejs

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <title>Myblog</title>
        <link rel="stylesheet" href="/css/bootstrap.min.css">
        <link rel="stylesheet" href="/css/index.css">
        <script src="/js/jquery-3.2.1.min.js" type="text/javascript"></script>
        <script src="/js/bootstrap.min.js" type="text/javascript"></script>

  • nav.ejs

    </head>
   <body>
   <header class="nav-head">
       <div class="nav container">
           <ul>
               <li><a href="/home">首页</a></li>
               <li> <a href="/share">资源分享</a></li>
               <li> <a href="/share">推荐</a></li>
               <li> <a href="/share">个人日记</a></li>
               <li><a href="/about">关于作者</a></li>
               <li><input type="text" placeholder="搜索" class="input-sm search"></li>
             
               <% if(session.user){ %>
                   <li>
                       <img src="/images/<%= session.avator %>" alt="" class="img-circle img-title">
                      
                       <ul class="menu">
                           <li class="personal menulist"><a href="/personal/<%= session.user %>">主页</a></li>
                        <!--   <li class="collection menulist"><a href="#">收藏集</a></li>
                        -->
                           <li class="menulist"><a href="/articles">写文章</a></li>
                           <li class="out"><a href="/signout">登出</a></li>
                       </ul>
                   </li>
                   <script>
                         var imgTitle = document.getElementsByClassName('img-title')[0],
          
                         menu = document.getElementsByClassName('menu')[0];
                         imgTitle.onclick = function (event) {
                         showTap();
                         event.stopPropagation();
                           }
                           
                           document.body.addEventListener('click',function (event) { 
                               menu.style.display = 'none';
                              // event.stopPropagation();
                            },true)
     
                             function showTap(){
                                if(menu.style.display == 'block'){
                                    menu.style.display = 'none';
                                }else {
                                    menu.style.display = 'block';
                                }
                           }
                           //退出登录
                           var signOut = document.getElementsByClassName('out')[0];
                       /*    signOut.onclick = function(){
                               ajax('get','/signout',null);
                               xhr.onreadystatechange = function () {
                             if(xhr.readyState==4&&xhr.status>=200&&xhr.status<300){
                                let  text = xhr.responseText;    //服务器返回的对象
                           if(text){
                               window.location.reload = 'localhost:8080/home';
                                }
                                
                            }
                        }

                           }*/
                   </script>
                   <% }else{ %>
                       <li class="login">
                               <a class="loginup" href="javascript:;"><span class="glyphicon glyphicon-user"></span> 注册 | 登录</a>
                          
                           </li>
                           <% } %>
             
           </ul>

        </div>
   </header>
   <script>
     
   
       var searchInput = document.getElementsByClassName('search')[0];
       searchInput.onfocus = function () {
           this.style.width = "300px";
       }
       searchInput.onblur = function () {
           this.style.width = "180px";
       }
       
   </script>
  • login.ejs
<div class="sign">
    <a href="javascript:;" title="关闭" class="login-close close">×</a>
    <div class="sign-title">
        <h1>用户注册</h1>
        <h3>来吧骚年们!</h3>
    </div>
    <form class="form signup" role="form">

            <div class="form-group">
                <input type="text" name="username" placeholder="账号不少于两个字符" class="form-control">
            </div>
        <div class="form-group">
            <input type="password" name="pass" class="pass form-control" placeholder="密码">
        </div>
        <div class="form-group">
            <input type="password" name="repeatpass" id="repeat" placeholder="重复密码" class="form-control">
        </div>
            <div class="form-group">
            <input type="button" value="注册" class="btn btn-primary login-up">
            </div>

    </form>
    <form class="form signin" role="form">
       <div class="form-group">
           <input type="text" name="username" placeholder="请输入用户名" class="form-control">
       </div>
       <div class="form-group">
           <input type="password" name="pass" class="pass form-control" placeholder="请输入密码">
       </div>
      <div class="form-group">
          <input type="button" value="登录" class="btn btn-primary login-in">
      </div>
    </form>
    <div class="form-tips">
        <span>已有账号？</span>
        <a href="javascript:;" class="register">登录</a>
    </div>
</div>
<div class="login-form-mask"></div>
<script>
  //  $(document).ready(function () {
        var $close = $('.login-close');
        var $sign = $('.sign');
        $close.click(function () {
            $sign.css("display","none");
        })

        var $register = $('.register'), //login/loginup切换
            $span = $('.form-tips span'),
            $signup = $('.signup'),
            $signTitle = $('.sign-title h1'),
            $signin = $('.signin');

        $register.click(function () {
            if($span.html() == "已有账号？"){

                $signin.css('display','block');
                $signup.css('display','none');
                $(this).html('注册');
                $span.html("没有账号？");
                $signTitle.html("欢迎登录");

            }else{

                $signin.css('display','none');
                $signup.css('display','block');
                $(this).html('登录');
                $span.html("已有账号？");
                $signTitle.html("欢迎注册");
            }
        })

        var $loginup = $('.loginup');   //点击登录/注册，阻止事件冒泡
        $loginup.click(function () {
            $mask.fadeIn(100);
            $sign.slideDown(200);
            return false;
        })

        var $close = $('.login-close'),
            $mask = $('.login-form-mask'),
            $sign = $('.sign');

        $sign.click(function () {
            return false;
        })

        $close.click(function (e) {
           // e.stopPropagation();
            fadeOut();

        })

        $(document).click(function (e) { //点击任意位置取消登录框
            //e.stopPropagation();
            fadeOut();
        })
        function fadeOut(){
            $mask.fadeOut(100);
            $sign.slideUp(200);
        }
    

    var loginUp = document.getElementsByClassName('login-up')[0],
        loginIn = document.getElementsByClassName('login-in')[0],
        signUp = document.getElementsByClassName('signup')[0],
        signIn = document.getElementsByClassName('signin')[0];

    
    
    loginUp.onclick = function () { //注册
        var data1 = 'username=' + signUp["username"].value + '&' + 'pass='+ signUp["pass"].value + '&' + 'repeatpass=' + signUp["repeatpass"].value;
        var  reg = /^[\u4E00-\u9FA5]{2,5}$/;
      /*  if(!reg.test(signUp["username"].value)){
            signUp["username"].classList.add("tips");
            signUp['username'].value()
        } */
        ajax('post','/signup',data1,"application/x-www-form-urlencoded");
        xhr.onreadystatechange = function () {
            if(xhr.readyState==4&&xhr.status>=200&&xhr.status<300){
             let  text = JSON.parse(xhr.responseText).code;  
             console.log(text)  //服务器返回的对象
               if(text == 3){
                   fadeOut();
                   alert("注册成功")
                   setTimeout(()=>{
                    window.location.reload();
                },1000)
               //    document.getElementsByClassName('login')[0].outerHTML = "<li class='users'><a href='/'>"+signUp["username"].value+ "(=^ ^=)" +"</a></li>"
               }else{
                fadeOut();
                alert("用户已存在")
               }
               
            }
        }

    }

    loginIn.onclick = function () { //登录
        var data2 = 'username=' + signIn["username"].value + '&' + 'pass=' + signIn["pass"].value;
        ajax('post','/signin',data2,"application/x-www-form-urlencoded");
        xhr.onreadystatechange = function () {
            if(xhr.readyState==4&&xhr.status>=200&&xhr.status<300){
             let  text = JSON.parse(xhr.responseText).code;    //服务器返回的对象
                console.log(text);
                
                 //  document.getElementsByClassName('login')[0].outerHTML = "<li class='users'><a href='/'>"+signUp["username"].value+ "(=^ ^=)" +"</a></li>"
               if(text===1){
                fadeOut();
                // let imgTitle = document.getElementsByClassName('img-title')[0];
                // imgTitle.setAttribute('src','/images/' + JSON.parse(xhr.responseText).avator)
                setTimeout(()=>{
                    window.location.reload();
                },1000)
               }else if(text === 2){
                   alert('密码错误')
               }else{
                   alert('账号不存在')
               }
               
            }
        }
      
    }
</script>
  • footer.ejs
</body>
    </html>

header为页面头部结构，nav为页面导航条，login为登录、注册内容、footer为页面顶部结构。可以看到我在ejs文件里有很多的if else 判断语句，这是根据session来判断用户是否登录渲染不同的内容。现在我们需要我们的页面编写样式：分别是home.css和index.css

为了增强对原生js的理解，在项目里我用了大量的原生ajax(显然jquery封装的ajax比较好哈哈），因此这里先编写一个原生ajax请求：

  • ajax.js
var xhr = null;
    function ajax(method,url,data,types) {   //封装一个ajax方法
      //  var text;
        if(window.XMLHttpRequest){
            xhr = new XMLHttpRequest();
        }else if(window.ActiveXObject){
            xhr = new ActiveXObject("Microsoft.XMLHTTP");
        }else {
            alert('你的浏览器不支持ajax');
            return false;
        }
      
        xhr.onerror = function (err) {
            alert("some err have hapened:",err);
        }
        xhr.open(method,url,true);
        if(method=="post"){
            xhr.setRequestHeader("Content-type",types);
         // xhr.setRequestHeader("Conent-Type",'application/json'"application/x-www-form-urlencoded")
        }
        try{
            setTimeout(()=>{
                xhr.send(data);
        },0);
        }catch(err) {
            alert("some error have hapened in font:",err);
        }
        return xhr;
    }

实现登录注册

前端基本页面开发好后，我们就可以写后台登录接口了：

注册：signup.js

var router = require('koa-router')();
var userModel = require('../lib/mysql.js');
var md5 = require('md5')

    // 注册页面
  
    // post 注册
router.post('/signup', async(ctx, next) => {
    console.log(ctx.request.body)
    var user = {
        name: ctx.request.body.username,
        pass: ctx.request.body.pass,
        repeatpass: ctx.request.body.repeatpass
    }
    let flag = 0;
    await userModel.findDataByName(user.name)
        .then(result => {
            console.log(result)
            if (result.length) {
               
                    //处理err
                    console.log('用户已存在')
                    ctx.body = {
                        code: 1
                    };               
                
            } else if (user.pass !== user.repeatpass || user.pass == '') {
                ctx.body = {        //应把这个逻辑放到前端
                    code: 2
                };

            } else {
                flag = 1;             
                
            }
        })
    if(flag==1){
        let res = await  userModel.insertData([user.name, md5(user.pass + 'asd&$BH&*') ])
       console.log(res.insertId)
        await  userModel.findDataByName(user.name)
        .then((result)=>{
            
          //  var res = JSON.parse(JSON.stringify(result))
            console.log(result[0]['avator'])
            ctx.session.id = res.insertId;
            ctx.session.user=user.name;
            ctx.session.avator = 'default.jpg';
            ctx.body = {
            code: 3
            };
            console.log('注册成功')
         })
    }

})

module.exports = router

密码采用md5加密，注册后为用户创建session并将其添加到数据库，写完别忘了在最后加上module.exports = router将接口暴露出来。

登录：signin.js

var router = require('koa-router')();
var userModel = require('../lib/mysql.js')
var md5 = require('md5')

router.post('/signin', async(ctx, next) => {
    console.log(ctx.request.body)
    var name = ctx.request.body.username;
    var pass = ctx.request.body.pass;

    await userModel.findDataByName(name)
        .then(result => {

            var res = JSON.parse(JSON.stringify(result))

            if (name === res[0]['name']&&(md5(pass + 'asd&$BH&*') === res[0]['pass'])) {
                    console.log('登录成功')
                    ctx.body = {
                        code: 1,
                    }
    
                    ctx.session.user = res[0]['name']
                    ctx.session.id = res[0]['id']
                    ctx.session.avator = res[0]['avator']   

            }else if(md5(pass + 'asd&$BH&*') != res[0]['pass']){
                ctx.body = {
                    code: 2 //密码错误
                }
            }
        }).catch(err => {
            ctx.body = {
                code: 3 //账号不存在+
            }
            console.log('用户名或密码错误!')

        })

})

module.exports = router

退出登录：signout.js

//使用新建的路由文件
//登录
app.use(require('./routers/signin.js').routes())
//注册
app.use(require('./routers/signup.js').routes())
//退出登录
app.use(require('./routers/signout.js').routes())

登录注册完成，由于学习繁忙，内容只能一点一点写了，后续内容持续更新。。。

node 前端开发 koa2

liwusen

liwusen

0 关注 0 粉丝 0 动态

关注 关注

相关推荐

Node.js在大前端领域的应用分析

关于 node 的使用已经很久了，使用范围也很广，似乎有前端的地方就有 node，那么来思考一个问题，node 到底是用来干嘛的呢？本文从五个大的方面对该问题进行了解释。本文不仅仅可以应用场景的分析，完全可以把它当做Node.js高级进阶当路线，看看那些你

MrHaoNan 2020-07-31

nodejs+koa2 实现模仿springMVC框架

环境安装，工具安装及中文自行百度，环境调整好后开始进入正题。Shift+ctrl+p，输入框内输入：launch.json. 参数介绍：name项目名称、version版本号、description项目描述、main项目启动文件、scripts启动快捷设置

boneix 2020-10-21

快速搭建 Koa2 + TS 服务器

"name": "myweb","version": "1.0.0","description": "","main"

苏莉koa 2020-06-10

Node 使用express-http-proxy 做api网关的实现

let { systemName, masterName, powers } = req.tokenDecode;

seanzed 2020-10-15

NodeJS开发人员常见五个错误理解

Nodejs 诞生于 2009 年，由于它使用了 JavaScript ，在这些年里获得了非常广泛的流行。它是一个用于编写服务器端应用程序的 JavaScript 运行时，但是 "它就是JavaScript" 这句话并不是 100% 正

ifconfig 2020-10-14

Ajax获取node服务器数据的完整步骤

因为是要将服务器获取的数据放在网页中 所以说对页面的渲染是必要的 这里我准备的是 art-template模板。const list = ["百度", "百度官网", "百度游戏", "

学留痕 2020-09-20

如何利用node转发请求详解

vue 项目开发过程中，接口跨域是一个很常见的问题。在开发时候可以用 vue 自带的 proxy 可以轻松解决。生产环境下，前端项目往往是部署在后端项目下，不会存在跨域的问题，接口前缀可以忽略。项目是能正常请求了，可是还需要处理接口问题，即 node 当成

往后余生 2020-09-17

python/golang实现循环链表的示例代码

循环链表就是将单链表的末尾指向其头部，形成一个环。只是增加时，需要考虑空链表增加第一个节点的特殊情况；删除时需考虑删除节点是头/尾节点，和链表中只有一个节点的特殊情况。for i := 0; i < c.lenth; i++ {. if cur ==

kka 2020-09-14

通过Node和Redis进行API速率限制

速率限制可以保护和提高基于API的服务的可用性。如果你正在与一个API对话，并收到HTTP 429 Too Many Requests的响应状态码，说明你已经被速率限制了。这意味着你超出了给定时间内允许的请求数量。你需要做的就是放慢脚步，稍等片刻，然后再

redis 2020-09-07

什么时候使用这些Node框架？Express、Koa...

根据《2018年Node.js网络调查报告》显示，Node.js在很大程度上提高了开发者的生产力，降低了开发成本，提升了应用性能。这是成功采用和部署node.js框架的结果。我们喜欢node.js框架，从Express.js的灵活性，到koa.js的性能。

lzccheng 2020-09-06

拆解Redis Cluster，怎么实现“写安全”这个重要特性？

Redis是非常流行的缓存。在Redis升级到3.0版本后，升级到集群版本，被称之为Redis Cluster。在集群版本中，会将数据分成多份，被保存到多个server中，从而保证集群的水平扩展能力，加之每份数据保存多个副本，从而保证可用性，并且集群版本

soyo 2020-08-31

杂项 ----Node

　　Node是一个基于chrome V8引擎的JavaScript代码运行环境　　--浏览器（软件）能够运行Javascript代码，浏览器就是JavaScript代码的运行环境　　--Node（软件）能够运行Javascript代码，Node就是Java

stonerkuang 2020-08-18

PHP xpath提取网页数据内容代码解析

DOMDocument，DOMXpath，其中初始化 loadHtml一般都会报很多警告，但是并不影响使用，用@屏蔽错误。其中 $node 为 DOMElement 对象。

LxyPython 2020-08-17

浅谈使用nodejs搭建web服务器的过程

什么是 Web 服务器？它只需支持HTTP协议、HTML文档格式及URL，与客户端的网络浏览器配合。大多数 web 服务器都支持服务端的脚本语言等，并通过脚本语言从数据库获取数据，将结果返回给客户端浏览器。目前最主流的三个Web服务器是Apache、Ngi

raksmart0 2020-08-17

Nodejs 与 Golang 的比较：Web 开发人员选择哪个最佳？

全球的开发人员都关注技术趋势，这些技术最终将帮助他们在非常短的时间内设计出优秀的软件。Web 开发是发展最快的领域之一。每个行业都希望通过在线渠道扩展业务，以赢得更多的客户并加强营销。继续向下阅读，以了解有关平台发展的更多信息。此外，移动应用程序的顺利运

Lzs 2020-08-14

2020最为关注的前端技术

跨端，IOS,安卓，web。支持C++、C#、Rust、Go、nodejs等语言。

学习web前端 2020-07-27

nodejs mongoose 分页查询

router.post(‘/getArticleList‘, function ( req, res) {. message:‘请求成功‘,page和limit是由前端传过来的，通过req.body来获取，因为是要给前端传所有的数据条数，所以就需要将所有数

80530895 2020-07-05

结合puppeteer和egg.js搭建html转pdf或png的node中间层服务。

后面经过使用链接池的优化，chrome的耗时成功降下来。由于项目比较看重时间损耗，所以最终选择puppeteer。本文将讲述puppeteer的一些优化措施，以及怎么结合egg.js搭建成最终的服务器。

lengyu0 2020-06-28

Vue开发中cnpm,yarn,npm,nodejs 区别与关系

yarn是Facebook公司出品的用于管理nodejs包的一款软件。yarn是为了弥补 npm 的一些缺陷而出现的，建议使用yarnnpm是随同nodejs一起安装的包管理工具。cnpm是淘宝 npm镜像，更快。

YarnSup 2020-06-28

Deno VS Node：Javascript开发人员更喜欢前者的五大原因

为了解决Node的许多缺点，NodeJS的开发者 Ryan Dahl，发布了一个新的运行时刻。笔者也有过同样的反应。在了解其优点之后，笔者更清晰地明白了为什么说Deno正是年后端Javascript开发人员所需要的。相较Node而言，一起看看JavaScr

huanglianhuabj00 2020-06-27
liwusen

liwusen

W3CSchool教程
HTML 教程
CSS 教程
Bootstrap 教程
Javascript 教程
jQuery 教程
后端教程
C 教程
Java 教程
PHP 教程
Python 教程
Go 教程
移动开发
Android 教程
Swift 教程
Kotlin 教程
jQuery Mobile 教程
ionic 教程
关于我们
新闻动态
联系方式
招聘英才
安科实验室
帮助与反馈

安科网(Ancii)，中国第一极客网

Copyright © 2013 - 2019 Ancii.com

京ICP备18063983号 京公网安备11010802014868号