小程序服务器搭建前后端交互,微信小程序:request前后端交互 路由跳转 存储数据到本地和获取 小程序登入 授权...
一 request前后端交互
基本样式
wx.request({
url:'test.php', //仅为示例,并非真实的接口地址
data: {
x:'',
y:''},
header: {'content-type': 'application/json' //默认值
},
success(res) {
console.log(res.data)
}
})
实际示例
1.wxml文件中
2.js文件
3.django后端如何获取
二 路由跳转
1.通过js事件页面之间跳转
此方式需要在wxml和wxjs2个文件中同时操作
示例
全局配置文件app.json
{"tabBar": {"list": [
{"pagePath": "index","text": "首页"},
{"pagePath": "other","text": "其他"}
]
}
}
pages局部js文件>Page>事件函数中
wx.switchTab({
url:'/index' #tabar页面路径
})
实际示例
1.
2.
示例
pages局部js文件>Page>事件函数中
1.
Page({
wx.reLaunch({
url:'test?id=1'})
})
2.
Page({
var name = "sb";
wx.reLaunch({
url: "/pages/test3/test3?name="+name
})
})
2.a标签方式跳转
此方式只需要在wxml中编写即可,作用和通过js一样
三 存储数据到本地
四 小程序登入
2.实际案例
2.1前端
代码:
//app.js
App({
onLaunch: function () {
var _this=this//登录
wx.login({
success: res=>{//发送 res.code 到后台换取 openId, sessionKey, unionId
wx.request({
url: _this.globalData.Url+'/login/',
data:{"code":res.code},
header:{"content-type":"application/json"},
method:"POST",
success:function(res){
console.log(res)
wx.setStorageSync("login_key",res.data.data.login_key)
}
})
}
})
},
globalData: {
Url:"http://127.0.0.1:8000",
userInfo: null
}
})
2.2后端
1.目录结构
2.封装配置文件
1.settings.py
AppId="..."AppSecret="..."
#开发者服务器向官方服务器请求的网址
code2Session="https://api.weixin.qq.com/sns/jscode2session?appid={}&secret={}&js_code={}&grant_type=authorization_code"
2.wx_login.py#导入settings.py
from app01.wx importsettings#导入requests
importrequestsdeflogin(code):#1.向微信官方服务器请求数据,网址和拼接数据示例:
#GET https://api.weixin.qq.com/sns/jscode2session?appid=APPID&secret=SECRET&js_code=JSCODE&grant_type=authorization_code
response=requests.get(settings.code2Session.format(settings.AppId,settings.AppSecret,code))#2.将json字符串反序列化为字典
data=response.json()if data.get("openid"):returndataelse:return False
3.cbv
models.py
from django.db importmodels#Create your models here.
classWxuser(models.Model):
id= models.AutoField(primary_key=True)
openid=models.CharField(max_length=255)
name= models.CharField(max_length=50)
avatar= models.CharField(max_length=200)
language= models.CharField(max_length=50)
province= models.CharField(max_length=50)
city= models.CharField(max_length=50)
country= models.CharField(max_length=50)#gender = models.CharField(max_length=50)
creat_time = models.DateTimeField(auto_now_add=True)
update_time= models.DateTimeField(auto_now=True)def __str__(self):return self.openid
views.py
from rest_framework.views importAPIViewfrom rest_framework.response importResponsefrom app01.wx importwx_loginfrom django.core.cache importcacheimporthashlib,timefrom app01 importmodelsclassLogin(APIView):defpost(self,request):#获取前端数据
param=request.dataif param.get("code"):#调用wx/wx_login.py/login函数
data=wx_login.login(param.get("code"))ifdata:#将openid和session_key自定义拼接
val=data['openid']+"&"+data["session_key"]#自定义openid的key
key=data["openid"]+str(int(time.time()))
md5=hashlib.md5()
md5.update(key.encode("utf-8"))
key=md5.hexdigest()#存入redis
cache.set(key,val)
has_user=models.Wxuser.objects.filter(openid=data['openid']).first()if nothas_user:#存入mysql
models.Wxuser.objects.create(openid=data['openid'])returnResponse({"code":200,"msg":"ok","data":{"login_key":key}
})else:return Response({"code": 200, "msg": "code无效"})else:return Response({"code":200,"msg":"缺少参数"})
五 授权
1.录音授权案例
2.用户数据授权
小程序服务器搭建前后端交互,微信小程序:request前后端交互 路由跳转 存储数据到本地和获取 小程序登入 授权...相关推荐
- centos ftp服务器搭建_CentOS系统云服务器宝塔面板安装以及微信小程序服务器搭建...
宝塔面板(官网http://bt.cn)是一款非常优秀的服务器管理工具,无论是系统功能还是用户界面都做的很完善很人性化,是使用Linux服务器的站长不可多得的一款工具,本文以CentOS6.5-64位 ...
- 服务器一般安装那种centos_CentOS系统云服务器宝塔面板安装以及微信小程序服务器搭建...
宝塔面板(官网http://bt.cn)是一款非常优秀的服务器管理工具,无论是系统功能还是用户界面都做的很完善很人性化,是使用Linux服务器的站长不可多得的一款工具,本文以CentOS6.5-64位 ...
- 宝塔linux面板搭建小程序wss,CentOS系统云服务器宝塔面板安装以及微信小程序服务器搭建...
宝塔面板(官网bt.cn)是一款非常优秀的服务器管理工具,无论是系统功能还是用户界面都做的很完善很人性化,是使用Linux服务器的站长不可多得的一款工具,本文以CentOS6.5-64位系统为例详细介 ...
- 小程序服务器搭建前后端交互,手把手带你搭一个简单的微信小程序(包括前后端)...
开发小程序除了大家能看到的客户端,前端小程序是如何与后端服务器进行数据交互的呢? 本文将通俗易懂的讲一下.这里以nodejs为例来进行讲解 1.首先要在服务器上安装nodejs服务器: wget ...
- 树莓派微信小程序服务器搭建,之四-呕血制作-Lettuce IOT框架-移远BC35G+树莓派+华为OC+SpringBoot后台+微信小程序...
上一篇主要讲的是华为OceanConnect平台profile文件与编解码插件的开发与调试而这一篇将要讲如何使用window电脑调试NB-IoT移远BC35G模组. 移远BC35G模组的初次使用 移远 ...
- 移动开发——音乐小程序服务器搭建
因为音频视频文件格式会比较大,开发小程序需要将这些文件放在服务器端,所以需要用node.js搭建本地服务器 1.进入命令,与项目文件mymusic处建立新的文件夹mymusic-sever 在路径栏 ...
- 微信小程序服务器错误错误码404,微信小程序 云开发 错误代码 大全
微信小程序 云开发 错误代码 大全 发布时间:2019-11-12编辑:三思 转载 阅读(1542) 以下记录的是微信小程序 云开发常出现的错误. 错误码 含义 -1通用错 ...
- 微信小程序开发笔记 支付篇④——基于微信支付SDK实现Java后端接口使用
文章目录 一.前文 二.微信支付 Java SDK 三.示例 一.前文 微信小程序开发笔记--导读 微信支付-SDK与DEMO下载 先看README.md 二.微信支付 Java SDK 对微信支付开 ...
- 爬去微信小程序服务器代码,Python爬取微信小程序通用方法代码实例详解
背景介绍 最近遇到一个需求,大致就是要获取某个小程序上的数据.心想小程序本质上就是移动端加壳的浏览器,所以想到用Python去获取数据.在网上学习了一下如何实现后,记录一下我的实现过程以及所踩过的小坑 ...
最新文章
- FPGA从Xilinx的7系列学起(4)
- Python实现迭代器协议
- android x86一键安装,安卓
- Elasticsearch、Elasticsearch-head、Kibana 安全设置账号密码验证登陆
- c++面向对象高级编程 学习一 不带指针的类
- [2021-ICCV] MUSIQ Multi-scale Image Quality Transformer 论文简析
- 宣化市大专计算机学校,2018张家口专科大学有哪些 最新大专院校名单
- __gnu_cxx::hash_map使用中的一些问题
- CCD 与 CMOS
- Spoon工具使用(kettle进行实时同步数据)
- c语言面试题-基本概念
- 最全面的Kano模型详解,及Kano模型为何是5种需求?
- matlab计算星期,在matlab中计算周数
- 冶金物理化学复习 --- 典型熔渣模型
- 资深投资人: VC的“增值平台”就是一坨狗屎
- openfire开发
- 蓝桥杯 算法训练 ALGO-128 Cowboys 递推、动态规划
- vue-video-play 记载视频观看时间和还原视频进度
- 〖Python 数据库开发实战 - Python与Redis交互篇⑫〗- 综合案例 - 新闻管理系统 - 删除新闻(含redis缓存)
- 关于深圳户口从集体户口迁入朋友家庭户口的相关手续总结