element-ui
安装
cnpm i element-ui -S
配置main.js
import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css';
Vue.use(ElementUI);
使用:官方API
https://element.eleme.cn/#/zh-CN/component/installation
<!--案例-->
<el-row>
<el-button>默认按钮</el-button>
<el-button type="primary">主要按钮</el-button>
<el-button type="success">成功按钮</el-button>
<el-button type="info">信息按钮</el-button>
<el-button type="warning">警告按钮</el-button>
<el-button type="danger">危险按钮</el-button>
</el-row>
web接口
# 请求工具:postman => https://www.getpostman.com/
# 接口:url链接,通过向链接发生不同的类型请求与数据得到相应的响应数据
# http://127.0.0.1:8888/test/
# https://api.map.baidu.com/place/v2/search
'''
ak: 6E823f587c95f0148c19993539b99295
region: 上海
query: 肯德基
output: json
'''
RESTful接口规范
# REST: 表征性状态转移(Representational State Transfer)
# RESTful规范:web数据请求接口设计规范
# 规范规定了两部分:1、url链接应该怎么写 2、返回的数据格式如何写
1)通常使用https请求
2)域名:有api关键字出现
-- https://api.example.com (存在跨域问题)
-- https://example.com/api
3)版本:不同版本需要标注
-- https://example.com/api/v1 | -- https://example.com/api/1
-- https://example.com/api/v2 | -- https://example.com/api/2
4)资源:请求的目标数据称之为资源,资源一般都有名词复数表示
-- https://example.com/api/v1/books (之前不规范的案例: /get_books/)
5)操作方式:不从请求链接体现操作方式,从请求方式上决定操作方式
-- get:https://example.com/api/v1/books 获取所有
-- post:https://example.com/api/v1/books 新增一本
-- put:https://example.com/api/v1/book/1 更新id=1的一本
-- patch:https://example.com/api/v1/book/1 更新id=1的一本
-- delete:https://example.com/api/v1/book/1 删除id=1的一本
6)资源过滤:通过接口传递参数来过滤资源
-- https://example.com/api/v1/books?limit=10 限制10条
7)状态码:返回数据要标准状态码,通过在数据中 {"status": 200}
-- SUCCESS("0", "查询成功")
-- NODATA("1xx", "非正确,无数据,显示基本信息")
-- FEAILED("2xx", "查询失败")
8)错误信息:请求失败需要标注错误信息 {"message": "请求参数不合法"}
9)操作结果:请求操作成功的返回结果 {"results": []}
-- get:返回资源列表 | 返回单一资源
-- post:返回单一新增资源
-- put:返回更新的资源
-- patch:返回更新的资源
-- delete:返回空文档
10)子资源返回资源接口:返回的资源如果有子资源,返回子资源的链接地址,如查找书,书的封面图片就可以url表示
drf简易书写TESTful规范接口
#路由层
from app import views
urlpatterns = [
url(r'^admin/', admin.site.urls),
url(r'^cbv/', views.CBVTest.as_view()),
url(r'^books/', views.books),
url(r'^book/(?P<id>\d+)/', views.book),
]
# 视图层
from django.http import JsonResponse
book_list = [{'id': 1, 'name': '红楼梦'}, {'id': 2, 'name': '水浒传'}]
def books(request):
if request.method == "GET":
if 'ak' not in request.GET:
return JsonResponse({
'status': '101',
'msg': 'ak不存在'
}, json_dumps_params={'ensure_ascii': False})
ak = request.GET.get('ak')
if ak != '123abc':
return JsonResponse({
'status': '200',
'msg': 'ak非法'
}, json_dumps_params={'ensure_ascii': False})
return JsonResponse({
'status': '0',
'msg': 'ok',
'results': book_list
}, json_dumps_params={'ensure_ascii': False})
if request.method == 'POST':
name = request.POST.get('name')
id = len(book_list) + 1
book = {'id': id, 'name': name}
book_list.append(book)
return JsonResponse({
'status': '0',
'msg': 'ok',
'results': book
}, json_dumps_params={'ensure_ascii': False})
CBV源码分析
# 视图层
from django.shortcuts import render, HttpResponse
from django.views import View
class CBVTest(View):
# 通过调度(dispatch)分发请求
def dispatch(self, request, *args, **kwargs):
pass
super().dispatch(request, *args, **kwargs)
pass
def get(self, request):
return render(request, 'cbv.html')
def post(self, request):
return HttpResponse('cbv post method')
<!-- 模板层 -->
<form action="/cbv/" method="post">
{% csrf_token %}
<input type="text" name="usr">
<button type="submit">提交</button>
</form>
# 路由层
from app import views
urlpatterns = [
url(r'^cbv/', views.CBVTest.as_view()),
]
drf安装与使用
# 1)安装drf:pip3 install djangorestframework
# 2)settings.py注册app:INSTALLED_APPS = [..., 'rest_framework']
# 3)基于cbv完成满足RSSTful规范的接口
# 视图层
from rest_framework.views import APIView
from rest_framework.response import Response
user_list = [{'id': 1, 'name': 'Bob'}, {'id': 2, 'name': 'Tom'}]
class Users(APIView):
def get(self, request, *args, **kwargs):
return Response({
'status': 0,
'msg': 'ok',
'results': user_list
})
def post(self, request, *args, **kwargs):
# request对formdata,urlencoded,json三个格式参数均能解析
name = request.data.get('name')
id = len(user_list) + 1
user = {'id': id, 'name': name}
user_list.append(user)
return Response({
'status': '0',
'msg': 'ok',
'results': user
})
# 路由层
from app import views
urlpatterns = [
url(r'^users/', views.Users.as_view()),
]
request源码分析
# as_view()
# 核心走了父类as_view
view = super(APIView, cls).as_view(**initkwargs)
# 返回的是局部禁用csrf认证的view视图函数
return csrf_exempt(view)
# dispatch(self, request, *args, **kwargs)
# 二次封装request对象
request = self.initialize_request(request, *args, **kwargs)
# 自定义request规则
self.initial(request, *args, **kwargs)
# initialize_request(self, request, *args, **kwargs)
# 原生request封装在request._request
# initial(self, request, *args, **kwargs)
# 认证
self.perform_authentication(request)
# 权限
self.check_permissions(request)
# 频率
self.check_throttles(request)
原文地址:https://www.cnblogs.com/huanghongzheng/p/11348100.html
时间: 2024-11-29 11:35:21