论怎样把背景治理体系写出花

2019年8月30日 153次阅读 来源: wslicknet

前两天看segmentfault的时刻，突然间，想写篇文章总结一下那些年自身写过的背景治理体系。作为我前端的入门项目，我对背景治理体系的情绪照样挺深的。本着以下几点缘由，写了此文。

  1. 对背景治理体系做一个综合周全的总结（嗯，这会是我今后项目总结的末尾）。

  2. 也算是给新入门的一个基本概念和进修局限吧（~大神请自动疏忽~）。

  3. 学问在于分享，也是愿望和人人交流下，怎样把背景治理体系写得能更具工程化，模块化，更有效力。

背景治理体系多为PC端，所以css3和HTML5的手艺应用不多，会依据产物需求举行文雅降级和渐进加强。下面先上一张图，排列下背景治理体系涉及到的各个方面，迎接人人补充。
《论怎样把背景治理体系写出花》

言语
html+js+css+php mysql c++

背景治理体系经常运用框架：bootstrap

经常运用类库：jquery，jquery UI（内里有许多好用的函数和小组件）

团体完成：
前端页面HTML+css+js ，用php做cgi层调背景接口，数据衬着。

页面构造：
头部，侧边栏导航条，面包屑等大众部份抽离成页面片，表格，表单，列表等抽离成小组件。所以背景治理体系的页面就有各个小积木拼接而成。

最罕见的操纵：
增编削查：背景治理体系的标配。主假如操纵DOM，调接口，只是操纵胜利后，假如想有更好的用户体验，不要革新页面，用js动态改DOM即可，其他觉得没啥好说的。

批量操纵：批量操纵自身并没有手艺难点，然则在用户体验上，个人认为，有许多考究。比方：全选，单选，多选，不选时的处置惩罚；单个或多个校验不合法时的提醒和处置惩罚；部份胜利，部份失利时的提醒和处置惩罚；悉数胜利的处置惩罚；

查询：这是背景治理体系的标配。罕见2种处置惩罚要领，1.get要领，参数悉数拼到URL上，个人引荐这类，可以存为书签；2.post要领，URL一直不会转变，人人都晓得post要领较平安，然则这类没法保留为书签，f5革新页面时没法保留查询前提。（如果列位看官有别的完成要领，迎接见教）

导出：平常是导出Excel表格。用PHPExcel类库。
须要加上头信息：

     header('Content-Type: application/vnd.ms-excel');
     header(sprintf('Content-Disposition: attachment;filename="%s.xls"',$filename));
     header('Cache-Control: max-age=0');

导入：平常也是导入Excel表格。用php的$_FILES可获得上传的文件。

      if (isset($_FILES["file"]) && 0 == $_FILES["file"]["error"]) {
            $fileType = array("application/vnd.ms-excel", "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet", "application/kset","application/octet-stream");  //文件花样
            if (in_array($_FILES["file"]["type"], $fileType) && $_FILES["file"]["size"] <= 2 * 1000 * 1000) {
                $file = $_FILES['file']['tmp_name'];
                require_once BASEPATH . '/libraries/phpexcel/PHPExcel.php';
                $excelReader = new PHPExcel_Reader_Excel2007();

                if (!$excelReader->canRead($file)) {
                    $excelReader = new PHPExcel_Reader_Excel5();
                }
                $sheet = $excelReader->load($file)->getSheet(0); //sheet1操纵
                $excelCont = array(
                    'highestCol' => $sheet->getHighestColumn(), //列
                    'highestRow' => $sheet->getHighestRow(), //行
                    'highestColumnIndex' => PHPExcel_Cell::columnIndexFromString($sheet->getHighestColumn()) // 几列
                );
        }
    }

权限掌握处置惩罚：
白名单，黑名单：以php的CI框架为例，思绪是：在项目的配置文件config中写入名单数组，在core下建一个继续CI_Controller的MY_Controller文件，然后在文件中封装权限掌握要领，如许全部项面前目今的文件只需继续了MY_Controller 就都可以挪用这个权限掌握的要领。

日记：虽然背景一定会打毛病日记，但前端也要依据营业恰当打日记。打日记是为了失足时，更好的定位题目，所以多半在失足时，把接口入参和出参打出来。详细怎样打，要依据营业状况。
比方：下面这类基础不调接口的状况，背景基础不会有日记，但用户会有上传失利的状况，所以前端日记对定位题目有很大协助，cilog是封装好的一个写日记的函数。

        elseif (!in_array($_FILES["file"]["type"],$fileType)) {
                cilog('error', '上传文件MIME：'.$_FILES["file"]["type"]);
                echo '<script>alert("文件范例毛病，请上传.xls或.xlsx文件");window.location.href = "xxx";</script>';
            } elseif ($_FILES["file"]["size"] > 2 * 1000 * 1000) {
                cilog('error', '上传文件大小：'.$_FILES["file"]["size"]);
                echo '<script>alert("上传文件不得凌驾2Mb");window.location.href = "xxx";</script>';
            } else {
                cilog('error', '上传失利：上传文件MIME：'.$_FILES["file"]["type"].'上传文件大小：'.$_FILES["file"]["size"]);
                echo '<script>alert("文件上传失利");window.location.href = "xxx";</script>';
            }

xss过滤：
平安题目主假如xss和sql注入。sql注入背景会做，前端主假如做xss过滤。经常运用的解决方案就是：对特别字符举行转义。但如许会形成页面展现上也会转义。所以现在的解决方案是，将半角的<>字符转义成全角的＜＞。

$strNavName=str_replace("<", "＜", $str);
$strNavName=str_replace(">", "＞", $strNavName);

上岸：加密（https），平常登录页会运用https协定，运用md5屡次加密。

退出：清cookie，清sessionkey。

document.cookie = name + "=;expires=Thu, 01 Jan 1970 00:00:00 GMT; path=/; domain=" + domain;

异常处置惩罚：虽然背景治理体系对异常的容忍度远远小于用户侧的项目，但作为一个有寻求的前端，对异常分支照样要认真对待。

  • 关于操纵胜利或失利，都邑给出对应的提醒。封装一个大众的函数，依据毛病码，给出用户可以明白的毛病提醒。

  • 运用try catch,保证边沿数据异常时不影响主体功用。比方：一个商品列表的页面，商品的信息是主体，商品的批评数据黑白主体，批评和商品不是同一个接口，批评接口有时会挂掉，所以就对批评接口运用try catch，保证批评异常时，商品数据是可以一般显现的。

try {
      //可能会失足的详细营业代码 
 } catch(Exception $e) {
      //打日记，做容灾处置惩罚
      cilog('error', 'get_mgmt_comment_list error: '.$e->getMessage());
 }

【注】：这些异常处置惩罚只是前端对异常的处置惩罚，背景也会有自身的异常报警处置惩罚。

经常运用插件（背景治理体系的标配 ）：
日历：datetimepicker (个人比较偏向这个)，layDate
弹窗：bootstrap的modal。假如自身写，最好是一个网站的作风保持一致，封装一个一致的函数或组件。
拖拽排序：jquery UI有现成的api,拖拽draggable，排序sortable，异常好用。
分页：PHP CI框架有现成的分页类Pagination，可以合营bootstrap的分页款式运用。

一些优异的模板：（网上一搜一大堆）
http://www.jq22.com/demo/Bootstrap-150103222921/dashboard-1.html
http://themes.laborator.co/
http://themes.laborator.co/#theme=neon

字体图标库：
FontAwesome：http://fontawesome.io/
阿里巴巴矢量图标库：http://www.iconfont.cn/

听说背景治理体系和Vue更配呢，改天得试下~~

    原文作者：wslicknet
    原文地址: https://segmentfault.com/a/1190000005822465
    本文转自网络文章，转载此文章仅为分享知识，如有侵权，请联系博主进行删除。
点赞