PHP-校花评选-埃洛等级分系统(Elo rating system)

校花是怎么评出来的

---

转载自：https://www.shiyanlou.com/courses/document/990
源程序地址：http://download.csdn.net/detail/u011532367/9310479

---

看看DEMO

课程目录 （markdown 中使用 [toc] 自动产生 ）

---

一、实验介绍

1. 环境登录

无需密码自动登录，系统用户名shiyanlou，密码shiyanlou

2. 环境介绍

本实验环境采用带桌面的Ubuntu Linux环境，实验中会用到桌面上的程序：

1. LX终端（LXTerminal）: Linux命令行终端，打开后会进入Bash环境，可以使用Linux命令
2. Firefox：浏览器，用于前端页面展示
3. GVim：非常好用的编辑器，最简单的用法可以参考课程Vim编辑器
4. PHP环境. 实验楼提供了我们一个很完美的平台快速学习.

3.环境配置

获取此教程代码

cd /home/shiyanlou/Code/git clone http://git.shiyanlou.com/shitou/shiyanlou_cs321.git

下载完整代码到本地

a. php环境

sudo apt-get install nginx   //下载安装nginxsudo apt-get update     //更新远程软件源sudo apt-get install php5-fpm  //下载安装 php

等待下载完成….

b. 修改nginx配置文件.

sudo vim /etc/nginx/sites-available/default  #使用vim编辑器修改默认的nginx根目录和php支持或者sudo gedit /etc/nginx/sites-available/default # 使用gedit编辑器修改默认的nginx根目录和php支持

打开文件后，进入到文件24行.将此行设置为根目录地址.

22  listen [::]:80 default_server ipv6only=on;2324  root /home/shiyanlou/Code/shiyanlou_cs321;  // 此处设置网站默认根目录25  index index.html index.htm;

找到54-64行前面的注释去掉（除59行不需要去掉）.改为如下形式.

54  location ~ \.php$ {55      fastcgi_split_path_info ^(.+\.php)(/.+)$;56      # NOTE: You should have 'cgi.fix_pathinfo = 0;' in php.ini57  58      # With php5-cgi alone:59  #    fastcgi_pass 127.0.0.1:9000;60      # With php5-fpm:61      fastcgi_pass unix:/var/run/php5-fpm.sock;62      fastcgi_index index.php;63      include fastcgi_params;64  }

c. mysql 环境

实验楼 mysql环境中已经默认搭建好，直接可以启动.

sudo service mysql start # 启动mysql进程mysql -uroot #连接mysql

二、项目介绍

1. 简介

《社交网络》中页面：

教程中页面实现：

---

校花评比项目这个想法来自于电影《社交网络》
——马克扎克伯格被女友甩了之后，一气之下黑了所有宿舍的相册，将所有女生的照片放在Facemash上供人评比。如今我们实验楼的教程教大家也来过把瘾，把这个实现过程来重映一下。请同学们好好利用实验楼里面的环境~~

《社交网络》在线播放
看看DEMO
介绍： 校花排名页面随机产生两个女生(名字做了处理) ， 比较两个女生的颜值， 然后利用鼠标点击选择一个你认为较漂亮的女生，随后数据自动提交到数据后台处理， 页面会自动刷新，再次随机产生两个女生，再次选择比较， 依次达到不断更新颜值的作用。 上方进度条可以显示你的进度，当进行10次选择以后， 页面自动弹到排名页面， 显示美女排名 ，以及校花。

想法来自《社交网络》，所以这里教程的步骤也跟着扎克伯格的脚步来进行。

---

a. 获取图片信息(了解).

1). apache 允许插入目录,所以wegt 就能全部下载下来.2). 加不了目录，所以进行一个空白搜索，接着数据库里所有的图片就会显示出来。利用火狐保存网页就能保存所有图片.3). 需要密码的破解直接进入，对方没有高级权限，就发现不了这次入侵.4).搜索链接到个人网页的,修改perl代码进入个人网页批量提取图片即可.

---

b. 排名算法

每个女生都有一个1400的基础颜值，，可称作“旧颜值”，在供人评比之后，将会通过公式计算出“新颜值”。
埃洛等级分系统(Elo rating system)
假设女生A和B的当前颜值分别为RA和RB.
A对B的胜率期望值当为：

类似B对A的胜率为：

举例说明:
假如一位女生在比赛中的真实得分（胜=1分，和=0.5分，负=0分）和她的胜率期望值不同，则她的颜值要作相应的调整。
例如，女生A颜值为1613，与颜值为1573的女生B战平。若K取32，则A的胜率期望值为

因而A的新颜值为1613+32*(0.5-0.5573)=1611.166;
在不断的两两比较之后,由此可以得出他们的颜值排名。
然后就知道校花是谁了。

---

三、项目开始

获取此教程代码

cd /home/shiyanlou/Code/git clone http://git.shiyanlou.com/shitou/shiyanlou_cs321.git

1. 建库建表

sudo service mysql start # 启动mysqld进程mysql -uroot #连接mysql

配置web环境以后，就可以开始操作代码了。

完整的代码都保存在了Mysql.sql中 自行下载查询.

a. 创建beauty数据库.

mysql> CREATE DATABASE beauty DEFAULT CHARSET utf8 COLLATE utf8_general_ci;

mysql> use beauty

b. 设计stu数据库表

数据库存储女生信息.（id，姓名，标识，图片，颜值）

mysql> CREATE TABLE IF NOT EXISTS `stu` (  `id` int(11) NOT NULL AUTO_INCREMENT,  `stu` varchar(255) DEFAULT NULL,  `img` varchar(255) NOT NULL,  `beauti` varchar(255) DEFAULT NULL,  `score` int(20) NOT NULL DEFAULT '1400',  PRIMARY KEY (`id`)) ENGINE=MyISAM  DEFAULT CHARSET=utf8 AUTO_INCREMENT=78 ;

c. 插入数据到beauty数据表。

实例:

INSERT INTO `stu` (`id`, `stu`, `img`, `beauti`, `score`) VALUES(1, 'Mary', '', 'image/01.jpg', 1400),(2, 'Nancy', '', 'image/02.jpg', 1400),(3, 'Kacy', '', 'image/03.jpg', 1400),(4, 'Judegli', '', 'image/04.jpg', 1400);

ps: 因为网络原因这里就没有提供女生图片，可以参考外网demo.

2. 页面布局(主要布局)

前端html

前端设计采用bootstrap响应式布局，适合任何设备使用。主要布局如下(具体看下载下来的页面代码):

<div class='container rank'>            <div class='progress'>        <div class='progress-bar' role='progressbar' aria-valuenow='60' aria-valuemin='0' aria-valuemax='100' style=''>          <span class=''>0% Complete</span>        </div>      </div>            <div class='alert alert-info alert-dismissible' role='alert' style='display:none;'>              <button type='button' class='close' data-dismiss='alert' aria-label='Close'><span aria-hidden='true'> &amp;times;</span></button>              <strong>!</strong>Of the two girls, who do you think is more beautiful~            </div>            <?php require('DBMysql.php');$query=new DBMysql();$i=0;$sql='select * from stu order by rand() limit 2';$result=$query->query($sql);while($row=mysql_fetch_array($result)){ $i++;?>            <div class='col_2 rankimg<?php echo $i; ?> rankimg'>                <input type='hidden' value='<?php echo $row['id'];?>'>                <a  href='#' id='ranka<?php echo $i; ?>'><img src='<?php echo $row['beauti'];?>' class='img-responsive img-rounded' alt='<?php echo $row['stu'];?> image'></a>                <span><?php echo $row['stu'];?></span>            </div>            <?php }?>        </div>

在主体部分内部随机产生两个女生并列显示. 利用对数据库的随机查询每次刷新随机产生两个女生，然后对她们进行选择比较，产生分值差.因为环境网络原因。外网可看看DEMO

2. js动态控制（交互）

js控制
这里利用了jquery的库，已经打包。

    $('#ranka1').on('click',function(){        $('#ranka2').hide();        rank(1);    });    $('#ranka2').on('click',function(){        rank(0);        $('#ranka1').hide();    });    //选择其中一个女生后，另一个女生图片消失，等待服务器响应。    function rank(i){        $.ajax({            url: './rank.php',   //访问路径             data: '&stu1=' + $('.rankimg1 input').val() + '&stu2=' + $('.rankimg2 input').val()+'&id='+i, //需要验证的参数             type: 'post', //传值的方式             error: function () {},             success: function (msg) {                window.location.reload();            }        })    }    //上传选择信息到服务器处理 ，处理完后，刷新页面重新加载两个女生。    function getCookie(name)   //获取cookie函数    {        var arr,reg=new RegExp('(^| )'+name+'=([^;]*)(;|$)');        if(arr=document.cookie.match(reg))            return (arr[2]);        else            return null;    }    if(!getCookie('rankwoman'))    {        $('.alert-info').show();        document.cookie='rankwomanper=0';    }    document.cookie='rankwoman=rankwoman';    rankwomanper=parseInt(getCookie('rankwomanper'));    $('.progress-bar').width(rankwomanper+'0%');    $('.progress-bar span').text(rankwomanper+'0% Competed');    rankwomanper=parseInt(getCookie('rankwomanper'))+1;    document.cookie='rankwomanper='+rankwomanper;    //页面每次刷新一次  存在cookie中rankwomanper的值+1 当累计到10以后页面自动刷新跳转到列表排名页面。    if(getCookie('rankwomanper')>10){        window.location.href='./ranklist.php';    }//等待页面再次刷新重新分配两个女生进行比较.

3. PHP后台处理(颜值计算)

利用了上面分析的ELo算法所写。
Rank.php
* 功能: 排名 Rank
* 专业名: Elo Rating System (埃洛等级分系统)
* Author: 实验楼 石头哥
* E-Mail: [e-mail]

$run=new Rank();  //自动启动类中的selectStu函数开始处理 POST 过来的数据。$a=$run->selectStu();var_dump($a); class Rank{    private static $K=32;    function queryScore($stu){        $sql='SELECT * FROM stu WHERE `id` = {$stu}';        $query=new DBMysql();        $info=$query->fetch($sql);        return $info['score'];    }    function updateScore($Ra,$stu){        $query=new DBMysql();        $query->query('UPDATE `stu` SET `score` = $Ra WHERE `id` = $stu');    }    function expect($Ra,$Rb){        $Ea=1/(1+pow(10,($Rb-$Ra)/400));        return $Ea;    }    function calculateScore($Ra,$Ea,$num){        $Ra=$Ra+$this::$K*($num-$Ea);        return $Ra;    }    function selectStu(){        require('DBMysql.php');        $stu1=@$_POST['stu1'];        $stu2=@$_POST['stu2'];        $victoryid=@$_POST['id'];        return $this->getScore($stu1,$stu2,$victoryid);    }    function getScore($stu1,$stu2,$victoryid){        // 查询目前分数        $Ra=$this->queryScore($stu1);        $Rb=$this->queryScore($stu2);        if($Ra & $Rb){        // 求期望值        $Ea=$this->expect($Ra,$Rb);        $Eb=$this->expect($Rb,$Ra);        $Ra=$this->calculateScore($Ra,$Ea,$victoryid);        $Rb=$this->calculateScore($Rb,$Eb,1-$victoryid);        $Rab=array($Ra,$Rb);        // 新分数入库        $this->updateScore($Ra,$stu1);        $this->updateScore($Rb,$stu2);        return $Rab;        }        else{            return false;        }    }}

4. 数据库操作辅助类

用来方便操作mysql数据库。

DBMysql.php
* 功能: 数据库查询

class DBMysql{//dbc()中使用了编码函数 用来防止中文乱码。    function dbc(){        $dbc = @mysql_connect('localhost','root','') OR die('Could not connected to MySQL: '.mysql_error());        $db_selected = mysql_select_db('beauty',$dbc);        $program_char = 'utf8';        mysql_set_charset($program_char, $dbc);        mysql_client_encoding($dbc);        mysql_query('set character_set_results=utf8');        mysql_query('SET NAMES utf8');   //        return $dbc;    }    function query($sql){        $dbc=$this->dbc();        $result=mysql_query($sql, $dbc);        return $result;    }    function fetch($sql){        $result=$this->query($sql);        $fetch=mysql_fetch_array($result);        return $fetch;    }}

启动

sudo service nginx start    //启动nginxsudo service php5-fpm start  //启动 php

打开浏览器即可。输入http://127.0.0.1/index.php
然后就可以进去了

点击Choose Again 可以再次选票