【Django】django初识

一、测试demo

1、pycharm创建django

2、创建APP

pycharm命令行输入：

python manage.py startapp app01

创建好后会多一个app01文件夹

3、注册app

在app01文件夹下，apps.py中会有App01Config类。找到settings.py文件，找到INSTALLED_APPS列表，末尾添加'app01.apps.App01Config'，
找到TEMPLATES列表，删除’DIRS’中的内容。

4、找到views.py

添加：

from django.shortcuts import HttpResponse

def index(request):
    return HttpResponse("欢迎使用！")

5、找到urls.py

from app01 import views

urlpatterns = [
    path('index/', views.index),
]

6、运行程序

网页中进入http://127.0.0.1:8000/index，可以看到"欢迎使用！"字样。

二、接收微信小程序请求demo

1、urls.py

from django.urls import path

from app01 import views

urlpatterns = [
    path('index/', views.index),
    path('login/', views.LoginView.as_view()),
]

2、views.py

from django.shortcuts import render,HttpResponse
from rest_framework.views import APIView
from rest_framework.response import Response

# Create your views here.

def index(request):
    return HttpResponse("欢迎使用！")

class LoginView(APIView):
    def post(self, request, *args ,**kwargs):
        print(request.data)
        return Response({"status":True})

3、settings.py

在INSTALLED_APPS列表中添加’rest_framework’

INSTALLED_APPS = [
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
    'app01.apps.App01Config',
    'rest_framework'
]

4、微信小程序中

demo.wxml

<!--pages/demo/demo.wxml-->
<view>{{message[0]}}</view>
<view bindtap="getLocalPath">{{localPath}}</view>
<view>手机号：</view>
<input value="{{phone}}" bindinput="bindPhone" placeholder="请输入手机号"></input>

<view>验证码：
  <view bindtap="messageCode">点击获取验证码 </view>
</view>

<input value="{{code}}" bindinput="bindCode" placeholder="请输入验证码"></input>

<button bindtap="login">登录</button>

demo.js

// pages/demo/demo.js
Page({

    /**
     * 页面的初始数据
     */
    data: {
        message:["a","b","c"],
        localPath:"请选择位置",
        phone:"",
        code:""
    },

      bindPhone:function(e){
        this.setData({ phone:e.detail.value});
      },
      bindCode: function (e) {
        this.setData({ code: e.detail.value });
      },
  /**
   * 发送短信验证码
   */
  messageCode:function(){
    // 手机长度限制
    if (this.data.phone.length !=11){
      // 弹窗
      wx.showToast({
        title: '手机号长度错误',
        icon:"none", // loading/success/none
      })
      return;
    }

    // 正则匹配手机格式
    var reg = /^(1[3|4|5|6|7|8|9])\d{9}$/;
    if(!reg.test(this.data.phone)){
      wx.showToast({
        title: '手机号格式错误',
        icon: "none", // loading/success/none
      })
      return;
    }

    wx.request({
      url: 'http://127.0.0.1:8000/api/message/',
      data: { phone: this.data.phone },
      method: 'GET',
      success: function (res) {
        console.log(res);
      }
    })
  },
  /**
   * 用户登录
   */
  login:function(){
    console.log(this.data.phone, this.data.code);
      // 将手机号和验证码发送到后端，后端进行登录。
      wx.request({
        url: 'http://127.0.0.1:8000/login/',
        data: { phone: this.data.phone, code: this.data.code},
        method: 'POST',
        success: function(res) {
          console.log(res);
        }
      })
  },  
  
    getLocalPath:function(){ 
        var that = this; 
        wx.chooseLocation({ 
            success: function(res) { 
                that.setData({localPath:res.address}); 
            }, 
        })
    },
    onLoad(options) {

    },

    /**
     * 生命周期函数--监听页面初次渲染完成
     */
    onReady() {

    },

    /**
     * 生命周期函数--监听页面显示
     */
    onShow() {

    },

    /**
     * 生命周期函数--监听页面隐藏
     */
    onHide() {

    },

    /**
     * 生命周期函数--监听页面卸载
     */
    onUnload() {

    },

    /**
     * 页面相关事件处理函数--监听用户下拉动作
     */
    onPullDownRefresh() {

    },

    /**
     * 页面上拉触底事件的处理函数
     */
    onReachBottom() {

    },

    /**
     * 用户点击右上角分享
     */
    onShareAppMessage() {

    }
})

三、效果
在微信小程序中登录，在pycharm中可以接收到信息

{'phone': '13544443333', 'code': '1111'}