Restore deleted repositories

_posts/2019-06-22-counter.md

@@ -0,0 +1,130 @@
+---
+layout: post
+title: 如何自己写一个博客计数器
+tags: [计数器]
+---
+
+  都怪LeanCloud，我得自己写计数器了！<!--more-->   
+  
+# 事件起因
+  我之前用的博客计数器是用的LeanCloud作为后台制作的计数器，然后嘛……代码是抄的。结果最近[LeanCloud凉了](https://blog.avoscloud.com/6841/)，这让我无法忍受，之前的代码我也看不懂，改也不会改……   
+  那好吧，我只好自己写计数器了。   
+  于是我花了很长时间，自己写了一个计数器，另外还得把原来的计数器信息转移过来……
+  
+# 使用方法
+## 前端部分
+  主页显示点击数：
+```html
+{% raw %}Hits: <span id="{{ post.url }}" class="visitors-index" >Loading...</span>{% endraw %} 
+```
+  内页显示点击数：
+```html
+{% raw %} Hits: <span id="{{ page.url }}" class="visitors" >Loading...</span>{% endraw %} 
+```
+  JS代码：（需要Jquery）
+```js
+var auxiliaryHost = "你的域名";
+function showHitS(hits){
+    $.get(auxiliaryHost+"/counter.php?action=show&id="+hits.id,function(data){
+            hits.innerHTML=Number(data);
+        });
+}
+function showHitCount() {
+    var visitors=$(".visitors-index");
+    for(var i = 0; i < visitors.length; i++){
+        showHitS(visitors[i]);
+    }
+    
+}
+function addCount() {
+var visitors=$(".visitors");
+    $.get(auxiliaryHost+"/counter.php?action=add&id="+visitors[0].id,function(data){
+        visitors[0].innerHTML=Number(data);
+    });
+}
+if ($('.visitors').length == 1) {
+    addCount();
+} else if ($('.visitors-index').length > 0){
+    showHitCount();
+}
+```
+  2021.03.23更新：修复了一些BUG并且支持异步了
+
+## 后端部分
+  MySQL建表：
+```sql
+CREATE TABLE `counter` (
+  `url` char(50) NOT NULL,
+  `counter` int(11) NOT NULL,
+  UNIQUE KEY `url` (`url`)
+);
+```
+  PHP：
+```php
+<?php
+header('Access-Control-Allow-Origin: *');
+$con=mysqli_connect("MySQL地址","用户名","密码","数据库名"); 
+if (mysqli_connect_errno($con)) 
+{ 
+    die("连接 MySQL 失败: " . mysqli_connect_error()); 
+}
+
+$hid = md5($_GET['id']);
+
+if ( $_GET['action'] == "show" ) {
+
+$sql = "SELECT * FROM `counter` WHERE `url` = '".$hid."' ";
+$result = $con->query($sql);
+
+if ($result->num_rows > 0) {
+    while($row = $result->fetch_assoc()) {
+        echo $row["counter"];
+}
+} else {
+
+$sql = "INSERT INTO `counter` (`url`, `counter`)
+VALUES ('".$hid."', '0')";
+ 
+if ($con->query($sql) === TRUE) {
+    echo "0";
+}else{
+echo "Error";
+}
+
+}
+
+} elseif ( $_GET['action'] == "add" ) {
+
+
+$sql = "SELECT * FROM `counter` WHERE `url` = '".$hid."' ";
+$result = $con->query($sql);
+if ($result->num_rows > 0) {
+    while($row = $result->fetch_assoc()) {
+$sql = "UPDATE `counter` SET `counter` = '".($row["counter"]+1)."' WHERE `url` = '".$hid."'";
+$con->query($sql);
+        echo ($row["counter"]+1);
+}
+} else {
+
+$sql = "INSERT INTO `counter` (`url`, `counter`)
+VALUES ('".$hid."', '1')";
+ 
+if ($con->query($sql) === TRUE) {
+    echo "1";
+}else{
+echo "Error";
+}
+
+}
+
+
+} else {
+header("HTTP/1.1 301 Moved Permanently");
+header("Location: https://mabbs.github.io");
+}
+mysqli_close($con);
+```
+
+# 结果
+  看来还是自己写代码放心，至少服务是自己维护的，不像垃圾LeanCloud坏掉之后我就无能为力了……   
+  不过说实话我根本不会JS（虽然我之前说我学这个），编写之中遇到了不少问题，所以在此感谢各位帮助我的各位大佬们，让我最终完成了这个计数器。