python Web开发框架-Django (2)

接上篇文章，介绍一些实用的技巧和注意点。首次用MarkDown编辑，感觉行空隙太大，不是那么好看。

GET/POST

前后端会有数据交互，使用JQuery来实现get/post请求
GET
方法1：通过正则表达式匹配url传递参数

$.ajax({

    type:"GET",

    url:"/search/serviceInfo/" + $('#servicename').val() + "/",

    dataType: 'json',//预期服务器返回的数据类型，我喜欢用json，当然你可以用xml/text/responseXML等

    success: function(msg) {

        //获取服务端返回的数据

        var logNames = msg['logName'];//读取json中的字段

        document.getElementById('logs').innerHTML = logNames;

    },

});

通过url路径传递参数，需要urls.py配置

//urls.py

urlpatterns = patterns('',

    (r'^search/serviceInfo/(.+)/$', 'searchText.getServiceInfo'),

)

//searchText.py

def getServiceInfo(request, servicename):

    result = {}

    //something about servicename

    return HttpResponse(json.dumps(result))

方法2：request parameter

//.ajax同上

url:"/search/searchLog/?offset=" + tmpOffset + "&count=" + pageCount

//后台获取参数,视图函数

def searchLog(request):

    offset = request.GET.get('offset');

    count = request.GET.get('count');

    //something

POST
提交表单或者上传数据往往用post

//前端js

logConf = {};

//something

$.ajax({

    type:"POST",

    url:"/setting/updschema/",

    data:JSON.stringify(logConf),

    dataType:'json',

    success: function(msg) {

        //something

    }

    });

//后台py接收

def addSchema(request):

    conf = json.loads(request.body)

    #中文转换，前端过来的数据是unicode格式，需要一次转码

    logSchema.servicename = conf["servicename"].encode('utf8')

    logSchema.fields = json.dumps(conf['fields'])

    logSchema.monitorLines = json.dumps(conf['lines'])

    //something...

json对象和字符串的转换：在js和python中，json对象对应的是字典、序列，各脚本语言都提供的有字符串转为字典/序列对象、对象转为json串的方法。

//js

JSON.stringify(obj)将JSON转为字符串

JSON.parse(string)将字符串转为JSON对象

//python

json.dumps(obj)JSON转为字符串

json.loads(str)字符串转为JSON

CSRF: Cross Site Request Forgery跨站请求伪造，为了确保请求的真实性django提供了防止csrf攻击的方法，在post时需要请求带上csrf token。所以使用post时会遇到csrf相关的错误，请求被拒绝。正规解决办法见django csrf protection。
后台程序员做的web服务多是内部使用，提供一个绕开csrf的方法。修改settings.py关掉csrf验证，如下

MIDDLEWARE_CLASSES = (

    //....注释掉下面这行

    #'django.middleware.csrf.CsrfViewMiddleware',

    //....

)

数据返回

//后端返回页面或json数据

#返回新页面

return render_to_response('current_datetime.html')

#返回json数据,result是一个字典

return HttpResponse(json.dumps(result))

log使用

在settings.py中设置log

import logging

from logging.handlers import *

from logging import Formatter

root = logging.getLogger()

if len(root.handlers) == 0:

    #日志路径

    filename = os.path.join(BASE_DIR,'log/tulip.log').replace('\\','/')

    #日志格式

    format = '%(asctime)s %(levelname)s %(module)s.%(funcName)s Line:%(lineno)d %(message)s'

    #归档切换

    rotate = TimedRotatingFileHandler(filename,"midnight",1,5)

    fmt = Formatter(format)

    rotate.setFormatter(fmt)

    root.addHandler(rotate)

#log level，如下debug及其以上都会显示

root.setLevel(logging.DEBUG)

在后台python中就可以直接使用log了：

import logging

logging.info(str)

logging.debug(str)

logging.warn(str)

#....

前端

模板：搜bootstrap模板，可以看到很多漂亮简洁的前端模板
jquery：

//样式管理

$('#servicenameErr').addClass('has-error');

$('#servicenameErr').removeClass('has-error');

//取值

servicename = $('#servicename').val();

//ajax

$.ajax({});

HTML DOM:

//清除selector的option,很简单哟

document.getElementById("logName").length = 0;

//表格行删除

document.getElementById('fieldTable').deleteRow(index);

//表格行增加

row =document.getElementById('fieldTable').insertRow(index);

row.innerHTML = "xxx";

//遍历表格

var fieldRows = document.getElementById('fieldTable').rows;

for (var i = 1; i < fieldRows.length; ++i) {

    var cells = fieldRows[i].cells;

    name = cells[0].childNodes[0].value;//单元格中有个input控件

}

//设置控件内容

document.getElementById('xxx').innerHTML="";//可以带html标签

document.getElementById('xxx').innerText ="";//纯文字

一款漂亮的alert-toastr:

toastr.options['positionClass'] = 'toast-top-center';

toastr.options['timeOut'] = "1000";

toastr.success('配置成功');

一款好用的日历控件-My97DatePicker

//注意到在onclick指出了日历的调用、日期格式、以及取值限制

<script language="javascript" type="text/javascript" src="/static/My97DatePicker/WdatePicker.js"></script>

<input id="startTime" type="text" placeholder="起始时间" onClick="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:ss',maxDate:'#F{$dp.$D(\'endTime\')}'})"/>

<input id="endTime" type="text" placeholder="终止时间"

onClick="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:ss',minDate:'#F{$dp.$D(\'startTime\')}'})"/>

参考资料

Django book: http://djangobook.py3k.cn/2.0/
Django下载：https://www.djangoproject.com/download/
bootstrap前端框架：http://www.bootcss.com/
JQuery：http://www.w3school.com.cn/jquery/
HTML DOM:http://www.w3school.com.cn/htmldom/
toastr：https://github.com/CodeSeven/toastr
My97DatePicker:http://www.my97.net/
django csrf:https://docs.djangoproject.com/en/dev/ref/csrf

巴特西

python Web开发框架-Django (2)

GET/POST

log使用

前端

参考资料

最新文章

热门文章