微信小程序踩坑记录

2023-07-11 18:18•linux•阅读 1850

1.问题：如果页面个数多于五个，要怎么处理

wx.navigateTo(OBJECT)最多只可以打开五个页面，如果页面多于五个，还想要返回，应该怎么处理呢

答：wx.redirectTo()

2.问题：获取不到unionId 我的小程序让用户登录后，用户信息解密出来的json结构没有unionId，可能是什么原因？是我小程序的后台配置有问题吗？

答：需要到开发者平台绑定

3.问题：微信小程序，如何调试？什么方法，用alert吗？

答：console.log

4.问题：安卓上wx.uploadFile的formData传输汉字出现问题

答：在小程序端把汉字编码，在后端对应解码就可以

5.问题：提交次数频繁什么鬼？

答：短时间连续30次会被封24小时ta

6.问题：video 能默认全屏播放吗？video 有全屏播放的方法吗？wxss 目前是不是还不支持 transform: rotate(90deg); ？在开发环境是可以，真机上就不行，微信版本6.5.3

答：思路是把视频的宽设置成屏幕的高，高设置成屏幕的宽，然后旋转90度，变成横屏显示这样

wxml:

<video src="{{src}}" autoplay="true"

controls="{{false}}" objectFit="cover"></video>

wxss:

video {

position: absolute;

top: 0;

left: 0;

width: 100%;

height: 100%;

transform: rotate(90deg);

}

7.问题：Object.assign() Android真机环境不支持这个API

答：Object.assign 是 ES6 API，安卓目前不支持

8.问题：wx.request 错误提示 request:fail invalid url，我已经配置好了 https ，浏览器中可以正常访问

在小程序后台也设置好了服务器域名，但在小程序代码中使用 wx.request 请求 url 时显示错误信息：request:fail invalid url

答：

最后发现，这个问题不是因为后台配置，也不是SSL证书的问题，是调用url时的引号写法问题

之前的写法：

wx.request({

url: \'https://www.xxx.com/test.php\',

...

})

这样就报错：invalid url

后来改成：

...

url: `https://www.xxx.com/test.php`,

...

不使用单引号，改为了 ` （与 ~ 同键）, 这样就好了

url 字符串中并没有使用变量，不明白为什么单引号不行，而需要使用 `

9.问题：微信小程序怎么控制WXSS样式我想添加或删除某个元素、或某个元素的CSS样式，该怎么处理？

答:我用的办法是在wxss定义两个样式,wxml条件渲染选择其中一个

10.问题：小程序二维码可以在朋友圈识别访问吗？

答:不可以，只能通过扫一扫识别

11.tabbar的borderStyle只能写white，写其他的就只有黑线，为什么？

答：因为只支持white和black

12.问题：微信小程序请求百度地图LBS服务器端接口报错http://api.map.baidu.com/geosearch/v3/nearby?ak=wicz7Mlbzg0Ex6oGFFriiwcmyg80pdLZ&geotable_id=160643&page_size=50&radius=30000&location=113.664119,34.7542报不在一下合法域名中，但是不知道具体错误在哪？

答：如果正式上线需要调用的话，可以自己在 server 里做一下 proxy

13.问题：<navigator url="">不跳转</navigator>为什么不跳转是什么情况？在logs.wxml写的想跳转到index不起作用。

答：如果是tabbar中的页面，需要加open-type="wx.switchTab

14.问题：为会么调试页面是空的，我新建的项目，为什么调试页面就空的，但是在真机上能游览。

答：应该是工具端口判断出错了我们下个版本做修复，最简单的处理办法是重启下系统先解决，建议下载测试版本先试试

15.问题：小程序mac 卡死，是mac 10.12.2 , 即使装了最新的测试版

答：我的能耗还好但是切换页面的时候很慢，还有你要注意开发目录里面只能有很少的必备代码，其余的不能放在开发目录，开发工具会watch整个目录，如果文件多了就会很卡

16.问题：小程序可以有自己指定的用户才能访问某些功能么？要做个公司内部的小应用，只希望公司的人能访问，微信登录后，是否可以再加一道认证，让指定用户才能访问指定内容。

答：可以的,做好后设置为体验版,然后不提交官方审核就行了。未认证小程序可以邀请20个体验者，已认证小程序可以邀请40人，随时可以新增或删除某人的体验权，太适合做企业内部工具了，如果人太多怎么办，可以做多个一模一样的小程序，同一套后端接口就行了，反正不审核，随便怎么玩，做游戏也好，做色情也好

17.问题：调试时如何清除用户对小程序的授权

由于进入首页弹出两次授权对话框被拒，怀疑时同时要了用户资料和用户位置，影响了体验

现在修改了代码，但是由于测试账号都用掉了，统一都给了小程序授权，所以不知道在那里重新清掉授权状态，求指点

答：开发者工具有清除用户授权数据的功能

18.问题：小程序的企业打款认证和微信认证有什么区别具体在开放的接口权限上有哪些区别

答：不是所有的小程序都需要用到支付、优惠劵这样的权限的！而且微信小程序注册的产品设计上企业打款认证是排在前面是否也是微信团队本身是鼓励企业优先进行打款认证，有需要在进行微信认证

19.问题：小程序绑定的“开发者”和“体验者”为什么不能预览开发中的小程序？小程序绑定的“开发者”和“体验者”为什么不能预览开发中的小程序？只有小程序管理员才能预览开发中的小程序，那丙丁的开发者和体验者有什么意义？

答：开发者只能预览自己提交的小程序，体验者能预览设置为体验版的小程序

20.微信小程序 redirectTo的URL是相对于当前页面的路径吗

21.创建个小程序项目怎么删了啊

22.微信小程序scroll-view在iphone真机不能滑动

23.在后台拼接成了json的样式接收显示的是string类型

24.使用wx.navigateTo为什么在手机显示的叉，不是说了是返回到原页面吗？

25.微信小程序Failed to load resource: net::ERR_NAME_NOT_RESOLVED问题解决办法

问题原因：通常是由于系统设置了代理如Shadowsocks等。
解决方案：关闭代理，或者依次点击工具栏“动作”-“设置”，选择“不使用任何代理，勾选后直连网络”。

26.微信小程序开发者工请求服务器能成功，手机预览请求不到数据

于小程序wx.request()方法是异步的，在app.js执行ajax后，各分页加载app.js的全局数据时，无法按顺序加载。例：

//app.js

App({

ajax:function(){

letthat =this;

wx.request({

url:\'https://a.com/url.php\',

method:\'GET\',

success:function(e){

that.data = 123;

}

})

};

})

//content.js

letapp = getApp()

Page({

getData:function(){

app.ajax();

console.log(app.data);//undefined

}

})

解决方法，使用Promise异步函数：

//app.js

App({

ajax:function(){

letthat =this;

letpromise =newPromise(function(resolve, reject){

wx.request({

url:\'https://a.com/url.php\',

method:\'GET\',

success:function(e){

that.data = 123;

resolve();

}

})

});

};

})

//content.js

letapp = getApp()

Page({

getData:function(){

app.ajax().then(()=>{

console.log(app.data);//123

});

}

})

2.图片只能获取原始宽高，无法获取现有宽高。不过image标签封装了mode属性，可以根据需求自行设置。

3.每个image标签底部有一条透明间隔，非padding，非margin。在图片前面做遮罩层时可能会被坑。

设置css为vertical-align: middle; 就可以

4.网络请求必须部署https

5.配置tabBar时，list参数中的pagePath参数至少需要包含app.json里pages数组中的第一个路径，否则会导致tabBar不显示。

6.tabBar跳转时无法带参数，解决方法：

//search.js

varapp = getApp();

Page({

confirm:function(e){

//获取数据，添加到全局

letval = e.detail.value;

app.searchWord = val;

this.jump();

},

jump:function(){

//跳转tabBar

wx.switchTab({

url:\'../index/index\',

});

},

});

//index.js

varapp = getApp();

Page({

onShow:function(e){

//获取全局数据

letval = app.searchWord;

}

});

//需要传递参数的页面在跳转前将数据添加到app.js里。需要接受参数的页面在onShow方法接受之前添加到app.js的数据。

7.小程序wx.request()方法请求的url必须是https开头

8.wx.request()使用post方法请求时，还需要加上header，header[content-type]值为application/x-www-form-urlencoded。例：

wx.request({

url:\'https://a.com/url.php\',

data: {message: 123},

method:\'POST\',

header: {

\'content-type\':\'application/x-www-form-urlencoded\'

},

success:function(e){

console.log(e)

}

});

9.小程序无法加载html标签(现在可以用rich-text组件，但是对图片很不友好)，同时数据渲染也无法渲染wxml标签（<view></view>等），可以使用wxParse.js来处理相关数据。

10.安卓无法渲染wx.request()请求的数据。官方已处理此坑

检测返回的数据是否有BOM头（3个字符的空白）。安卓的wx.request解析不会跳过BOM头，导致数据返回的是字符串，而不是对象或者数组。

例：

返回的数据是：(3个字符的空白){a:1, b:2}

解析的数据是：\'{a:1, b:2}\'(字符串)，而不是{a:1, b:2}(对象)

由于不是对象，模板渲染之类会无法正常进行。解决方法，后台返回数据前去掉BOM头就行。如果后台不会去BOM头，可以在前端去除，但是wx.request如果dataType缺省，会默认为json并自动解析，导致无法去除BOM头。

解决方案：

wx.request({

url: url,

method:\'GET\',

dataType:\'txt\',

success:function(e){

letjson = e.data.trim();

letarr = JSON.parse(json);

}

});

dataType改为json以外的格式，避免小程序自动解析json字符串，然后对返回的数据用 trim() 方法去掉空白，最后解析json字符串就行。

11.调试时多行省略（-webkit-line-clamp）正常，发布时多行省略无效。

解决方案：如果不想重新审核，让后台截断就好

12.单次setData长度有限制：1048576

appservice:16 invokeWebviewMethod 数据传输长度为 2432088 已经超过最大长度 1048576

在用富文本的时候容易发生，特别是图片为base64且像素特别大的时候

13.页面的生命周期很迷，只有当redirectTo或navigateBack的时候才会卸载页面，也就是触发onUnload。

导致变量会存在很久，如果用setTimeout循环调用，可能会被坑，可以在onHide的时候清除有影响的变量或者setTimeout

微信小程序踩坑记录

相关推荐

微信小程序之跳坑指南

【react-native】持续踩坑总结

uniapp 开发微信小程序问题笔记

微信小程序开发踩坑记

React Hook 项目中使用了antd4.0 Tree，树形组件默认展开指定的节点踩坑记录

React平时的一些踩坑总结

jQuery升级踩坑之路

【转】GO语言map类型interface{}转换踩坑小记