BinZhiZhu's Blog

Hello,World.


  • 首页

  • 关于

  • 标签

  • 分类

  • 归档

  • 搜索

Nginx 配置访问Access Denied

发表于 2018-11-21 | 分类于 后端 | | 阅读次数:
字数统计: 500 | 阅读时长 ≈ 1

前言

前段时间双11阿里云搞活动,于是便忍痛(花呗)入手了一台1核2G、40G系统盘、1M带宽的云服务ECS服务器。想着自己平时开发玩玩以及搭建自己的博客,所以就很爽快的买了,还顺便在阿里云买了一个.top的域名。
也就是博客现在的这个域名,域名申请备案后,大概半个月左右收到备案通过的通知,于是我就开始解析域名到服务器,同时也把自己的项目在服务器搭建好。
我是直接搭wget一键安装LNMP环境的,github clone下来,这个时候心想着配置一下虚拟域名应该就美滋滋了。

搭建过程的遇到的问题

访问解析的域名连接重置

我刚开始以为是域名解析的问题,因为访问域名是一直显示正在连接,最后显示连接重置,也就是说无法连接到服务器,于是我问了一下其他朋友,在阿里云服务器添加了安全组,默认开启所有连接。
其实开启http 80、https就可以了,其他看自己的需求,添加之后就不会显示连接重置了。

访问提示Access Denied

1
access denied

mlgj… 难受,解决了一个问题又出现了另外一个问题,访问项目提示access denied。我前前后后检查过Nginx的配置,真的觉得没有问题…。Nginx 提示successful,重启也正常。
最让我觉得奇怪的是,访问域名提示access denied 的同时,可以看到网页的logo 已经访问到我项目的logo了,但是就完全没有任何反应,我自己去看Nginx日志也没相应的报错信息,我真的不知道该如何排查。

重新clone项目部署

我只好重新clone项目 重新认真部署一次 看看效果如何 未完待续。。。

Vue.js结合ElementUI的(分页)进行前端分页

发表于 2018-11-17 | 分类于 前端 | | 阅读次数:
字数统计: 876 | 阅读时长 ≈ 3

前言

我们在开发的过程中总会遇到某些项目需要根据后台接口返回的数据进行前端分页显示,举个例子:电商项目中的订单列表页面。
后台点击订单列表页的时候会去请求后端接口,前端根据后端返回的订单数据进行分页显示。虽然自己是一个后端人员,但今天处理一个后台改版的任务的时候,
订单列表页用Vue写的,在对接写好的接口的时候,就遇到了这个分页的问题。那我们就一起来看下这个问题一般要如何解决吧。

思路

大致的想法是:后台返回所有订单数据,然后前端拿到返回的数据进行全部分页,这里注意的是:例如有100条记录,每页显示10条,这个时候实际分页效果是10页对吧,也就是说我们是
后端一次性返回所有的订单数据,然后交给前端提前进行分页,每一页的数据我们在拿到后台返回的数据的时候前端就已经分好页了。

优点

  1. 分页切换的效果用户体验会更加顺畅;
  2. 当删除一条数据的时候过滤器会重新计算当前页面的显示数据

缺点

  1. 当页面数据量大的时候会浪费很多流量,因为有点类似于预加载的效果,一次把所有数据返回,数据多的时候RT时间会比较长

代码片段

过滤器

我们应该先创建一个过滤器来过滤列表数据,这里有三个参数tabledata(列表数据),pageNum(当前第几页),pagesize(每页条数)

1
2
3
4
5
6
7
filters:{
pagination(tabledata,pageNum,pagesize){
let offset = (pageNum - 1) * pagesize;//当前页第一条的索引
let data=(offset + pagesize >= tabledata.length) ? array.slice(offset, tabledata.length) : array.slice(offset, offset + pagesize);
return data
}
}

完整代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<template>
<el-table :data="tableData | pagination(pageNum,pagesize)">
<el-table-column label="">
<template slot-scope="scope">

</template>
</el-table-column>
</el-table>
<el-pagination
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="pageNo"
:page-size="pageSize"
layout=" prev, pager, next, sizes, jumper"
:total="tableData.length">
</el-pagination>
</template>
阅读全文 »

解决Hexo首页阅读次数样式诡异的问题

发表于 2018-11-16 | 分类于 博客 | | 阅读次数:
字数统计: 1.1k | 阅读时长 ≈ 5

前言

今晚在完善阅读统计的功能是时候发现一个很诡异的问题,我们一起来探讨一下。上一篇文章大概有阐述阅读统计功能的搭建,所有这里我就不多说了。
利用leancloud接完统计功能后,当前这个hexo版本我会发现首页的阅读数量的样式有点诡异,大致如下:
两种情况: 1:阅读次数::9:9 :2:阅读次数::99
实际上这个时候我们的阅读量只有9而已,正常来说应该这样显示: 阅读次数:9
于是我忍不住摁住F12一探究竟,大致可以知道阅读次数那一块的元素是js直接赋值的,所以我就去找了一下阅读统计的部分的相关js,我比较粗暴,直接定位全局搜索一波 leancloud_visitors 相关的文件
这是我们可以找到一个路径为 themes\next\layout_third-party\analytics\lean-analytics.swig 的文件,打开发现就是这部分js处理leancloud的阅读数量统计。

今天的我

阅读全文 »

为NexT主题添加文章阅读量统计功能

发表于 2018-11-15 | 分类于 博客 | | 阅读次数:
字数统计: 124 | 阅读时长 ≈ 1

前言

最近刚入门Hexo+GithubPage搭建个人博客,基础的搭建完毕之后,总觉得缺少些技术性(代表)的功能,于是想到要不要在自己的博客搭建阅读统计的功能?但这个时候不太明白如何去实现,网上看了其他博主的一些建议之后,也打算使用learncloud这家服务商的资源解决我们的问题,所以我们得先去learncloud官网注册账号。

阅读全文 »

尝试使用Hexo+Github搭建个人博客

发表于 2018-11-14 | 分类于 博客 | | 阅读次数:
字数统计: 258 | 阅读时长 ≈ 1

##初探Hexo

Hexo是一款基于Node.js的静态博客框架,依赖少易于安装使用,可以方便的生成静态网页托管在GitHub和Heroku上,是搭建博客的首选框架。这里我们选用的是GitHub,你没看错,全球最大的同性恋交友网站(逃……)。
Hexo同时也是GitHub上的开源项目,参见:hexojs/hexo 如果想要更加全面的了解Hexo,可以到其官网 Hexo 了解更多的细节,因为Hexo的创建者是台湾人,对中文的支持很友好,可以选择中文进行查看。这里,默认各位猿/媛儿都知道GitHub就不再赘述。

阅读全文 »

1…678
BinZhi Zhu

BinZhi Zhu

纵使你脚下有一千名挑战者,那就把我算作第一千零一名。

36 日志
4 分类
28 标签
RSS
0%
© 2020 BinZhi Zhu
Copyright © 2018
|
Powered by Hexo | Theme by Next
载入天数...载入时分秒...