backbone.js入门教程

文章20 |   阅读 12372 |   点赞0

来源：https://blog.csdn.net/the_fire/category_9261033.html

11、backbone实例todos扩展+web服务器

转x33g5p2x  于2022-03-06 转载在 其他  
字(8.7k)|赞(0)|评价(0)|浏览(661)

在第7节的时候，我们对backbone的功能进行了分析，建立了web端的model。在本节中我们将对原先的todos进行扩展，使其能够将数据存到server端的数据库中。这里我们使用的是django+sqlite来进行实现。

现在我们应该对应着建立server端的model。不过在此之前，为了方便不熟悉django的童鞋，简单的写下开发过程：

1、创建工程

根据上一篇中介绍的django的环境安装和使用，创建一个工程:django-admin.py startproject todos，然后在cd到todos文件夹中：python manage.py startapp todo，创建一个应用（称作模块也行）。

2、配置文件

在todos根目录的settings中，主要是数据配置：

DATABASES = {

‘default’: {
‘ENGINE’: ‘django.db.backends.sqlite3′, # Add ‘postgresql_psycopg2′, ‘postgresql’, ‘mysql’, ‘sqlite3′ or ‘oracle’.
‘NAME’: ‘D:/mytodos’, # Or path to database file if using sqlite3.
‘USER’: ”, # Not used with sqlite3.
‘PASSWORD’: ”, # Not used with sqlite3.
‘HOST’: ”, # Set to empty string for localhost. Not used with sqlite3.
‘PORT’: ”, # Set to empty string for default. Not used with sqlite3.
}
}

完整的配置最后贴出来供大家参考。

有了上面的一个铺垫，开始创建model。

打开todo文件夹中的models.py文件，写入以下代码：

  1. from django.db import models
  3.  
  4.     class Todo(models.Model):
  5.         content = models.CharField(max_length=128)
  6.  
  7.         done = models.CharField(max_length=1,default='N') #Y表示完成N表示未完成
  8.         order = models.IntegerField(blank=True)

然后再来创建views代码，关于django的mvc模式这里不介绍，大家跟着操作进行。在todo下新建一个views_todos.py文件。

这个views_todos文件是用来操作数据库的所有代码所在。关于数据库的操作，其实就是CRUD（create增加，request查询，update更新，delete删除），在django的基础上，很好写。

这里是全部代码：

  1. #coding=utf-8
  3. '''
  4.     author:huyang
  5.     date: 2012-3-26
  6.     blog:http://the5fire.net
  7. '''
  8. from models import Todo
  9. from django.http import HttpResponse
  10. from django.shortcuts import render_to_response
  11. from django.utils import simplejson
  12.  
  13. '''
  14. public
  15. @desc 加载todo首页
  16. @param
  17. @return templates
  18. '''
  19. def index(request):
  20.     return render_to_response('todo/todos.html',{})
  21.  
  22. '''
  23. public
  24. @desc 控制创建和读取方法的一个跳转
  25. @param
  26. @return 
  27. '''
  28. def control_cr(request):
  29.     if request.method == 'POST':
  30.         return create(request)
  31.     elif request.method == 'GET':
  32.         return getAll(request)
  33.     else:
  34.         return HttpResponse('
  35. access deny
  37. ')
  38.  
  39. '''
  40. public
  41. @desc 控制更新和删除方法的一个跳转
  42. @param url中的todo对象id
  43. @return 
  44. '''
  45. def control_ud(request, todo_id):
  46.     if request.method == 'PUT':
  47.         return update(request,todo_id)
  48.     elif request.method == 'DELETE':
  49.         return delete(request,todo_id)
  50.     else:
  51.         return HttpResponse('
  52. access deny
  54. ')
  55. '''
  56. protect
  57. @desc 获取所有的todo对象，并转为json格式，返回
  58. @param
  59. @return json格式的todo列表
  60. '''
  61. def getAll(request):
  62.     todos = Todo.objects.all()
  63.     todo_dict = []
  64.     flag_dict = {'Y':True,'N':False}
  65.     for todo in todos:
  66.         todo_dict.append({'id':todo.id,'content':todo.content,'done':flag_dict[todo.done],'order':todo.order})
  67.     return HttpResponse(simplejson.dumps(todo_dict), mimetype = 'application/json')
  68.  
  69. '''
  70. protect
  71. @desc 创建一个todo记录
  72. @param POST中的json格式todo对象
  73. @return json格式{'success':True/False}
  74. '''
  75. def create(request):
  76.     req = simplejson.loads(request.raw_post_data)
  77.     content = req['content']
  78.     order = req['order']
  79.  
  80.     if not content:
  81.         return HttpResponse(simplejson.dumps({'success':False}), mimetype = 'application/json')
  82.     todo = Todo()
  83.     todo.content = content
  84.     todo.order = order
  85.     todo.save()
  86.     return HttpResponse(simplejson.dumps({'success':True}), mimetype = 'application/json')
  87.  
  88. '''
  89. protect
  90. @desc 更新一条todo记录
  91. @param POST中的json格式todo对象
  92. @return json格式{'success':True/False}
  93. '''
  94. def update(request, todo_id):
  95.     req = simplejson.loads(request.raw_post_data)
  96.     content = req['content']
  97.     done = req['done']
  98.     order = req['order']
  99.     flag_dict = {True:'Y',False:'N'}
  100.     todo = Todo.objects.get(id = todo_id)
  101.     todo.content = content
  102.     todo.done = flag_dict[done]
  103.     todo.order = order
  104.     todo.save()
  105.     return HttpResponse(simplejson.dumps({'success':True}), mimetype = 'application/json')
  106.  
  107. '''
  108. protect
  109. @desc 删除一条todo记录
  110. @param url中的todo对象id
  111. @return json格式{'success':True/False}
  112. '''
  113. def delete(request, todo_id):
  114.     Todo.objects.get(id = todo_id).delete()
  115.     return HttpResponse(simplejson.dumps({'success':True}), mimetype = 'application/json')

上面的代码中除了有CRUD代码之后，还有两个重要的函数：control_cr和control_ud，从名字很容易看出来，前者是控制创建和查询的，后者是控制更新和删除的。为什么这么写呢，其原因在于使用backbone在web端进行CRUD操作的时候，对应的url并不一样，因此我写了两个函数。

在control_cr中，根据GET和POST 来判断是查询还是创建爱你，在control_ud中，根据PUST和DELETE来判断是更新还是删除。

上面代码中其他函数就不详解了，都是很简单的语句。

然后我们需要做的就是配置url，在todos下面的那个urls.py文件中的配置如下：

  1. from django.conf.urls.defaults import patterns, include, url
  2. import settings
  3.  
  4. from todo import views_todos
  5.  
  6. urlpatterns = patterns('',
  7.  
  8.     (r'^site_media/(?P.*)$', 'django.views.static.serve',{'document_root': settings.STATIC_DOC_ROOT,'show_indexes': False}),
  9.  
  10.     (r'^todo/control/$', views_todos.control_cr),
  11.     (r'^todo/control/(\d*)$', views_todos.control_ud),  #例如：http://127.0.0.1:8000/todo/control/1/ PUT就是更新，DELETE就是删除
  12.     (r'^', views_todos.index),
  13. )

当然web端我们直接使用前面分析过的todos的，只需要修改一下其中的代码。

  • 1、在Todo的模型中加入： urlRoot: ‘/todo/control/’
  • 2、在collection TodoList中加入：url: ‘/todo/control/’，并且去掉：localStorage: new Store(“todos-backbone”),

这样就ok了。在django项目中还需要配置site_media和templates文件，结构如下：

我用的Komodo Edit这个IDE来开发的。你只要按照这样的结构来建立文件和文件夹就行了。

最后给出settings的所有代码：

  1. # Django settings for testbackbone project.
  3.  
  4. DEBUG = True
  5. TEMPLATE_DEBUG = DEBUG
  6.  
  7. ADMINS = (
  8.     # ('Your Name', 'your_email@example.com'),
  9. )
  10.  
  11. MANAGERS = ADMINS
  12.  
  13. DATABASES = {
  14.     'default': {
  15.         'ENGINE': 'django.db.backends.sqlite3', # Add 'postgresql_psycopg2', 'postgresql', 'mysql', 'sqlite3' or 'oracle'.
  16.         'NAME': 'D:/mytodos', # Or path to database file if using sqlite3.
  17.         'USER': '', # Not used with sqlite3.
  18.         'PASSWORD': '', # Not used with sqlite3.
  19.         'HOST': '', # Set to empty string for localhost. Not used with sqlite3.
  20.         'PORT': '', # Set to empty string for default. Not used with sqlite3.
  21.     }
  22. }
  23.  
  24. # Local time zone for this installation. Choices can be found here:
  25. # http://en.wikipedia.org/wiki/List_of_tz_zones_by_name
  26. # although not all choices may be available on all operating systems.
  27. # On Unix systems, a value of None will cause Django to use the same
  28. # timezone as the operating system.
  29. # If running in a Windows environment this must be set to the same as your
  30. # system time zone.
  31. TIME_ZONE = 'America/Chicago'
  32.  
  33. # Language code for this installation. All choices can be found here:
  34. # http://www.i18nguy.com/unicode/language-identifiers.html
  35. LANGUAGE_CODE = 'en-us'
  36.  
  37. SITE_ID = 1
  38.  
  39. # If you set this to False, Django will make some optimizations so as not
  40. # to load the internationalization machinery.
  41. USE_I18N = True
  42.  
  43. # If you set this to False, Django will not format dates, numbers and
  44. # calendars according to the current locale
  45. USE_L10N = True
  46.  
  47. # Absolute filesystem path to the directory that will hold user-uploaded files.
  48. # Example: "/home/media/media.lawrence.com/media/"
  49. MEDIA_ROOT = ''
  50.  
  51. # URL that handles the media served from MEDIA_ROOT. Make sure to use a
  52. # trailing slash.
  53. # Examples: "http://media.lawrence.com/media/", "http://example.com/media/"
  54. MEDIA_URL = ''
  55.  
  56. # Absolute path to the directory static files should be collected to.
  57. # Don't put anything in this directory yourself; store your static files
  58. # in apps' "static/" subdirectories and in STATICFILES_DIRS.
  59. # Example: "/home/media/media.lawrence.com/static/"
  60. STATIC_ROOT = './site_media/'
  61.  
  62. # URL prefix for static files.
  63. # Example: "http://media.lawrence.com/static/"
  64. STATIC_URL = '/site_media/'
  65.  
  66.  
  67. # URL prefix for admin static files -- CSS, JavaScript and images.
  68. # Make sure to use a trailing slash.
  69. # Examples: "http://foo.com/static/admin/", "/static/admin/".
  70. ADMIN_MEDIA_PREFIX = '/static/admin/'
  71.  
  72. # Additional locations of static files
  73. STATICFILES_DIRS = (
  74.     # Put strings here, like "/home/html/static" or "C:/www/django/static".
  75.     # Always use forward slashes, even on Windows.
  76.     # Don't forget to use absolute paths, not relative paths.
  77. )
  78.  
  79. # List of finder classes that know how to find static files in
  80. # various locations.
  81. STATICFILES_FINDERS = (
  82.     'django.contrib.staticfiles.finders.FileSystemFinder',
  83.     'django.contrib.staticfiles.finders.AppDirectoriesFinder',
  84. # 'django.contrib.staticfiles.finders.DefaultStorageFinder',
  85. )
  86.  
  87. # Make this unique, and don't share it with anybody.
  88. SECRET_KEY = 'q4%c$1t0@x0iaco8!8eacy5-g8t)z1549$s4049xf^2y2#!0ef'
  89.  
  90. # List of callables that know how to import templates from various sources.
  91. TEMPLATE_LOADERS = (
  92.     'django.template.loaders.filesystem.Loader',
  93.     'django.template.loaders.app_directories.Loader',
  94. # 'django.template.loaders.eggs.Loader',
  95. )
  96.  
  97. MIDDLEWARE_CLASSES = (
  98.     'django.middleware.common.CommonMiddleware',
  99.     'django.contrib.sessions.middleware.SessionMiddleware',
  100.     #'django.middleware.csrf.CsrfViewMiddleware',
  101.     'django.contrib.auth.middleware.AuthenticationMiddleware',
  102.     'django.contrib.messages.middleware.MessageMiddleware',
  103. )
  104.  
  105. ROOT_URLCONF = 'todos.urls'
  106. import os
  107. TEMPLATE_DIRS = (
  108.     # Put strings here, like "/home/html/django_templates" or "C:/www/django/templates".
  109.     # Always use forward slashes, even on Windows.
  110.     # Don't forget to use absolute paths, not relative paths.
  111.      os.path.join(os.path.dirname(__file__), 'templates').replace('\','/'),
  112. )
  113.  
  114. INSTALLED_APPS = (
  115.     #'django.contrib.auth',
  116.     #'django.contrib.contenttypes',
  117.     #'django.contrib.sessions',
  118.     ##'django.contrib.sites',
  119.     #'django.contrib.messages',
  120.     #'django.contrib.staticfiles',
  121.     'todos.todo',
  122.     # Uncomment the next line to enable the admin:
  123.     # 'django.contrib.admin',
  124.     # Uncomment the next line to enable admin documentation:
  125.     # 'django.contrib.admindocs',
  126. )
  127.  
  128. STATIC_DOC_ROOT = './site_media'
  129.  
  130. # A sample logging configuration. The only tangible logging
  131. # performed by this configuration is to send an email to
  132. # the site admins on every HTTP 500 error.
  133. # See http://docs.djangoproject.com/en/dev/topics/logging for
  134. # more details on how to customize your logging configuration.
  135. LOGGING = {
  136.     'version': 1,
  137.     'disable_existing_loggers': False,
  138.     'handlers': {
  139.         'mail_admins': {
  140.             'level': 'ERROR',
  141.             'class': 'django.utils.log.AdminEmailHandler'
  142.         }
  143.     },
  144.     'loggers': {
  145.         'django.request': {
  146.             'handlers': ['mail_admins'],
  147.             'level': 'ERROR',
  148.             'propagate': True,
  149.         },
  150.     }
  151. }

代码已经放到github上了，建议大家下载运行参考。https://github.com/the5fire/the5fire-servertodos

本文链接: http://www.the5fire.net/11-backbone-todos-djangowebserver.html

版权说明 : 本文为转载文章, 版权归原作者所有 版权申明

原文链接 : https://blog.csdn.net/the_fire/article/details/7483275

内容来源于网络，如有侵权，请联系作者删除！

postgresqlpythonsqlitedjango扩展todosweb服务

相关文章

    查看更多
    • 蜀ICP备13028337号-1 大数据知识库 https://www.saoniuhuo.com © All rights reserved
    • 本站内容来源互联网,如果侵犯您的权益请联系我们删除, 联系方式：448109455@qq.com