小程序爬坑

&＃xff08;遇到的9个耗费时间比较长的坑及解决方案&＃xff0c;记录一下&＃xff0c;很多内容都是在这个论坛上找到的答案 http://www.wxapp-union.com&＃xff09;

1.background-image:可以使用网络图片和base64图片但是不可以是本地图片

2、微信小程序无法识别json格式&＃xff0c;一眼看上去json数据没问题还没有问题 &＃xff08;各种转格式&＃xff0c;就是不行&＃xff09;
后来参考了这篇文章解决&＃xff1a;http://qidai.blog.51cto.com/6435621/1887272

居然是下载的文件所致&＃xff0c;很神奇的原因

3.小程序微信登录无法返回数据中无unionid&＃xff08;文档中明明就说有啊&＃xff0c;我擦&＃xff0c;怀疑人生了。。。&＃xff09;

原因是必须去微信开放平台绑定小程序&＃xff08;没有单独的入口&＃xff0c;在微信公众平台处输入&＃xff09;后就会有了。

4.页面传值 &＃xff08;数组和对象都要转一下格式才能传递&＃xff09;

(1)传递基本数据类型

Page({
data: {
testStr: ‘xiaochengxu’
},
next: function(e){
wx.navigateTo({
url: ‘/test/test?str&＃61;’&＃43;this.data.testStr
})
}
})

Page({
onLoad:function(options){
console.log(“接收到的参数是str&＃61;”&＃43;options.str);
}
})
打印内容&＃xff1a;接收到的参数是str&＃61;xiaochengxu

(2)传递对象

Page({
data: {
testData:{name:’username’, password:’password’}
},
next: function(e){
wx.navigateTo({
url: ‘/test/test?testData&＃61;’&＃43;JSON.stringify(this.data.testData)
})
}
})
Page({
data:{
testData:null
},
onLoad:function(options){
console.log(“接收到的参数是testData&＃61;”&＃43;options.testData);
this.data.testData &＃61; JSON.parse(options.testData);
}})
打印内容&＃xff1a;

接收到的参数是testData&＃61;{“name”:”username”,”password”:”password”}

(3)传递数组集合

Page({
data: {
list:[‘item-A’,’item-B’]
},
next: function(e){
wx.navigateTo({
url: ‘/test/test?list&＃61;’&＃43;JSON.stringify(this.data.list),
})
}
})
Page({
data:{
list:[]
},
onLoad:function(options){
console.log(“接收到的参数是list&＃61;”&＃43;options.list);
this.data.list &＃61; JSON.parse(options.list);
}})
打印内容&＃xff1a;接收到的参数是list&＃61;[“item-A”,”item-B”]

统一处理&＃xff1a;

var dealParam &＃61; function(data) {

for(var i in data) {if (typeof data[i] &＃61;&＃61; ‘string’){console.log(“key&＃61;”&＃43;i&＃43;“; value&＃61;”&＃43;data[i]);} else if (typeof data[i] &＃61;&＃61; ‘object’) {dealParam(data[i]);}}


}

5.宽高百分比无效 建议使用vm 和vh做

6.POST请求 这是个大坑&＃xff08;文档看起来超简单&＃xff0c;我各种找后端同学调试都不行&＃xff0c;后端同学都恼了。。然后去百度了一下&＃xff0c;才知道这个坑啊。。。。。抱头痛哭&＃xff09;

post强求必须遵循下面的规则
&＃xff08;1&＃xff09; ‘Content-Type’: ‘application/json’用在get请求中没问题.
POST请求就不好使了.需要改成: “Content-Type”: “application/x-www-form-urlencoded”
&＃xff08;2&＃xff09; 加上method: “POST”&＃xff1b;
&＃xff08;3&＃xff09;data: { cityname: “上海”, key: “14e11ba70” }写成json格式这样也是请求不到数据的.需要转格式.方法入下
function json2Form(json) {
var str &＃61; [];
for(var p in json){
str.push(encodeURIComponent(p) &＃43; “&＃61;” &＃43; encodeURIComponent(json[p]));
}
return str.join(“&”);
}

7.必须用Https的接口 还要去微信后台配置一下合法域名

&＃xff08;1&＃xff09;域名必须后台设置

&＃xff08;2&＃xff09;必须使用HTTPS
&＃xff08;3&＃xff09;配置域名可以同时配置多个域名&＃xff0c;使用&＃43;号即可
&＃xff08;4&＃xff09;最多配置十五个
&＃xff08;5&＃xff09;一个月最多修改五次&＃xff0c;请谨慎修改

8.多个input 设置auto_focus会导致安卓设备崩溃&＃xff0c;只设置一个或者不设置解决问题

9.登录授权如果用户拒绝了&＃xff0c;我们就无法再掉用微信登陆了&＃xff0c;只能原生登陆和微信登录两手抓吧&＃xff0c;或者在小程序wx.getuserInfo之前弹框提示用户一定要允许获取权限。再请求wx. wx.getuserInfo

作为一个IOS开发工程师小程序从开发到上线我只用了2个周。开发简单&＃xff0c;体验跟app差不多。虽然短期内很多人都唱衰微信小程序&＃xff0c;但是我感觉还是很有前途的。估计用不了多久许多小体量的公司&＃xff0c;和线下商户就活跃起来了。