微信小程序與web的區(qū)別
小程序必須用Https請求后端服務器
不支持cookie
使用微信內部的用戶管理系統(tǒng)
http://www.jianshu.com/p/c1c5b1f641b1
https://segmentfault.com/a/1190000007605475
http://www./xiaochengxu-359941.html
http://blog.csdn.net/mad_geek/article/details/53148267
http://www./infodetail-384792.html
7.28 解決掉微信小程post問題
炎炎盛夏,突然變得涼爽宜人,明天是周末,去做些什么呢?小雪是離不開人的,不能遠走,帶著她。不想這些了,微信小程序的post到django讓我很是困惑不過終于解決掉了。幾天在外面跑來跑去,有些心野了,收心。
post的要點
1.header:{
“Content-Type”: “application/x-www-form-urlencoded;charset=UTF-8”
}
2.data:Util.json2form(e.detail.value)
json2form:
function json2form(jsonobj){
var str=[];
for(var p in jsonobj){
str.push(encodeURIComponent(p)+”=”+ encodeURIComponent(jsonobj[p]));
}
return str.join(“&”);
}
module.exports = {
formatTime: formatTime,
imageUtil: imageUtil,
json2form:json2form
}
var Util = require(‘../../utils/util.js’);
django的setting中要注釋掉 django.middleware.csrf.CsrfViewMiddleware
然后一切都變得正常了。下一個任務微信小程序的用戶識別。
https://github.com/gusibi/python-weixin
用戶識別
formSubmit: function (e) {
console.log('form發(fā)生了submit事件,攜帶數據為:', e.detail.value);
console.log(app.globalData.userInfo);
wx.getSetting({
success:re=>{
if (re.authSetting["scope.userInfo"]){
wx.login({
success: function (res) {
console.log("mm");
console.log(res.code);
Util.addprj(e.detail.value, res.code);
}
})
}else{
console.log("fail");
wx.openSetting({
success: m => {
console.log(m.authSetting);
if(m.authSetting["scope.userInfo"]){
wx.login({
success: function (res) {
console.log("mm");
console.log(res.code);
Util.addprj(e.detail.value, res.code);
}
})
}
}
})
}
}
})
}
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 33
- 34
- 35
- 36
- 37
- 38
- 39
- 40
- 41
- 42
function json2form(jsonobj){
var str=[];
for(var p in jsonobj){
str.push(encodeURIComponent(p)+"="+ encodeURIComponent(jsonobj[p]));
}
return str.join("&");
}
function addprj(jsonobj,code){
var formjson=jsonobj;
wx.getUserInfo({
withCredentials:true,
success: function (res) {
console.log(res.userInfo);
console.log(res.iv);
jsonobj["encryptedData"] = res.encryptedData;
jsonobj["iv"] =res.iv;
jsonobj["code"] = code;
console.log(jsonobj);
wx.request({
url: 'https:///proj/onAppLogin/',
method: 'POST',
data: json2form(jsonobj),
header: { "Content-Type": "application/x-www-form-urlencoded;charset=UTF-8" },
success: function (re) {
console.log(re);
console.log(re.data["openId"]);
re.data["prjname"]=formjson["prjname"];
re.data["prjaddr"]=formjson["prjaddr"];
re.data["regtime"]=new Date().getTime();
wx.request({
url: 'https:///proj/addprj/', //僅為示例,并非真實的接口地址
//method:'GET',
method: 'POST',
data: json2form(re.data),
header: {
"Content-Type": "application/x-www-form-urlencoded;charset=UTF-8"
},
success: function (res) {
var data = res.data;
}
})
}
})
}
})
}
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 33
- 34
- 35
- 36
- 37
- 38
- 39
- 40
- 41
- 42
- 43
- 44
- 45
- 46
- 47
- 48
- 49
- 50
def onAppLogin(request):
if request.method=="POST":
code=request.POST.get("code")
encrypted_data=request.POST.get("encryptedData")
iv=request.POST.get("iv")
api = WXAPPAPI(appid=WEIXIN_APPID,
app_secret=WEIXIN_APPSECRET)
session_info = api.exchange_code_for_session_key(code=code)
# 獲取session_info 后
session_key = session_info.get('session_key')
crypt = WXBizDataCrypt(WEIXIN_APPID, session_key)
# encrypted_data 包括敏感數據在內的完整用戶信息的加密數據
# iv 加密算法的初始向量
# 這兩個參數需要js獲取
user_info = crypt.decrypt(encrypted_data, iv)
json_string = json.dumps(user_info)
return HttpResponse(json_string)
#return HttpResponse(json_string)
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
def onAppLogin(request):
if request.method=="POST":
code=request.POST.get("code")
encrypted_data=request.POST.get("encryptedData")
iv=request.POST.get("iv")
api = WXAPPAPI(appid=WEIXIN_APPID,
app_secret=WEIXIN_APPSECRET)
session_info = api.exchange_code_for_session_key(code=code)
# 獲取session_info 后
session_key = session_info.get('session_key')
crypt = WXBizDataCrypt(WEIXIN_APPID, session_key)
# encrypted_data 包括敏感數據在內的完整用戶信息的加密數據
# iv 加密算法的初始向量
# 這兩個參數需要js獲取
user_info = crypt.decrypt(encrypted_data, iv)
json_string = json.dumps(user_info)
return HttpResponse(json_string)
#return HttpResponse(json_string)
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
def addPrj(request):
userinfo={}
userinfo["nickname"]=request.POST.get("nickName")
userinfo["gender"]=request.POST.get("gender")
userinfo["city"]=request.POST.get("city")
userinfo["province"]=request.POST.get("province")
userinfo["openId"]=request.POST.get("openId")
#userinfo["regtime"]=request.POST.get("regtime")
userinfo["avatarUrl"]=request.POST.get("avatarUrl")
wxuser=WxUser.objects.filter(openId=userinfo["openId"])
if(not wxuser.exists()):
wx=WxUser.objects.create(nickname=userinfo["nickname"],gender=int(userinfo["gender"]),city=userinfo["city"],province=userinfo["province"],openId=userinfo["openId"],avatarUrl=userinfo["avatarUrl"])
wx.save()
projaddr = request.POST.get("prjaddr")
projname = request.POST.get("prjname")
proj.objects.get_or_create(useropenid=userinfo["openId"],proj_name=projname, proj_addr=projaddr)
if (request.method == "POST"):
return HttpResponse("{'url':'" + projname + "'}")
else:
return HttpResponse("{'url':'nono'}")
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
8月15日
下一步為微信樣式:
微信樣式如下:https:///
https://mp.weixin.qq.com/debug/wxadoc/design/index.html?t=2017621
http://www./css3/
https://www./weixinapp/rmcw1q8t.html
微信小程序的樣式:
container:quickstar時就會來的一個樣式
button: type(default,warn,primary)自帶背景色,可以像做網頁那樣設計自己的按鈕,然后做為背景放入。
background-size:(cover和contain)
display:flex
flex-direction
基本與網頁排版區(qū)別不大,比公眾號的內網頁開發(fā)要靈活很多,小程序還是很不錯的,少了很多的往復認證過程。
<view class="container">
<view class="appTitle">
<view class="item1">HOCKEY</view>
<view class="item2">TRAIN & GAME</view>
</view>
<view class="userinfo">
<button class="bt1" wx:if="{{!hasUserInfo && canIUse}}" open-type="getUserInfo" bindgetuserinfo="getUserInfo" size="default">
<label>點擊授權進入</label></button>
<block wx:else>
<button class="bt2" size="default" type="warn" bindtap="Scancode"><label>馬上簽到</label></button>
<button class="bt2" size="default" type="warn" ><label>訓練安排</label></button>
<button class="bt2" size="default" type="warn" ><label>比賽信息</label></button>
<button class="bt2" size="default" type="warn"><label>積分查詢</label></button>
<button class="bt2" size="default" type="warn" ><label>積分兌換</label></button>
</block>
</view>
page{
background-color: #000;
background:url('../../images/weixin/IMG5.jpg') no-repeat #000;
}
.appTitle
{
display:flex;
flex-direction: column;
align-items:center;
}
.item1{
color:#fff;
font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;
font-weight: bolder;
font-size: 4em;
}
.item2{
color:crimson;
font-family: Cambria, Cochin, Georgia, Times, Times New Roman, serif;
font-weight: bolder;
font-size: 1.3em;
}
.bt1>label{
font-size:1em;color:yellow;padding-left:20px;margin-right:20px
}
.bt2>label{
font-size:1em;color:yellow;padding-left:20px;margin-right:20px
}
.bt1{
top:100px;
background:url('../../images/weixin/bt2.png');
background-size:cover;
border:none;
}
.bt2{
top:100px;
background:url('../../images/weixin/bt2.png');
background-size:cover;
border:none;
}
.userinfo {
width:100%;
display: flex;
flex-direction: column;
align-items: center;
}
.userinfo-avatar {
width: 128rpx;
height: 128rpx;
margin: 20rpx;
border-radius: 50%;
}
.userinfo-nickname {
color: #aaa;
}
.usermotto {
margin-top: 200px;
}
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 33
- 34
- 35
- 36
- 37
- 38
- 39
- 40
- 41
- 42
- 43
- 44
- 45
- 46
- 47
- 48
- 49
- 50
- 51
- 52
- 53
- 54
- 55
- 56
- 57
- 58
- 59
- 60
- 61
- 62
- 63
- 64
- 65
- 66
- 67
- 68
- 69
- 70
- 71
- 72
- 73
- 74
- 75
- 76
- 77
- 78
- 79
- 80
- 81
- 82
8月16日:
滿懷信心,覺得眼前是亮的,一切都不是問題了,微信小程序越來越顯得靈動起來,就在想一鼓作氣完成的時候發(fā)現(xiàn)又掉坑里了,這坑,沒有準備,原本是想打通同一公眾號下內網頁與小程序之間的用戶統(tǒng)一,UnionId~~~~沒錯就是這家伙,從一開始我就注意著他,想著一定要用上這個東西,小程序運轉OK,公眾號網頁運轉OK,那就再驗證一下用戶統(tǒng)一吧,怎以回事?為什么在小程序的用戶信息中得不到unionId,說好的統(tǒng)一呢?又重新看了一下unionId的介紹,不帶這樣的,還要去開放平臺下去認證,本人不怕認證就怕花錢,這前前后后的,左一個認右一個認的,同一公眾號下的小程序用戶統(tǒng)一也要再來一個認證才行,如果不花錢,這我可以接受,又要花錢,沒必要嘛,小程序的開發(fā)原本也沒有什么經濟利益的,只是圖個用得方便。做到此不得不放棄。
以下是從經濟角度出發(fā)做的總結:
1.本著小程序開發(fā)的想法,原本應不必弄什么公眾號,只需申請個小程序開發(fā)的賬號,但你會發(fā)現(xiàn)這個開發(fā)賬號也是要認證的,也是要交費的。如果你已有了微信公眾號的認證交費,可以直接用微信公眾號的認證也不必再交費。還是有一個公眾號的好,畢竟您還得做公眾號的內網頁開發(fā)。
2.小程序的開發(fā)靈活,公眾號網頁開發(fā)受限制的地方太多。更愛小程序。
3.在統(tǒng)一移動應用,網頁應用,公眾內網頁應用時,即便在同一主體公眾號下的開發(fā),也需要再申請一個開放開臺賬號做平臺綁定,這種綁定是要付費的。同樣是300.
也就是如果您想做一個平臺統(tǒng)一的開發(fā)沒600的預算是不行的,這600中還不包括微信支付平臺和微信網店的開通,如一并加上應是過千的。
以上只是暫時的心得,還需繼續(xù)看一看是不是哪兒自己理解錯了。
8.17日
研究小程序要告一段落,今天想完成搖一搖的在小程序中的實現(xiàn)。
參考資料如下:
http://blog.csdn.net/xiangzhihong8/article/details/53888087
http://www.jb51.net/article/102493.htm
|