- 当前 Bug 的表现(可附上截图)
- 预期表现
产品轮播图正常显示
问题说明:
小程序体验版本,在IOS真机上部分网络图片不显示,安卓系统和开发模拟器上正常,从未出现过该问题。
两个不同的IPhone手机,图片在另一个IOS手机上正常显示,但又会丢失其他图片,丢失图片完全是随机的(图片格式是jpg和png),在图片上绑定了预览图片方法,执行wx.previewImage方法传入不显示的图片地址,可正常预览
和swiper标签没有任何关系,在page中直接一个image标签也会随机图片不显示。
在后台查看nginx日志发现 访问图片的时候会在 jpg或者png后面加上/ 导致404,
日志详情:
2018/11/06 17:33:16 [error] 4776#5532: *417 "E:/card/shop/tab6_icon.png/index.html" is not found (3: The system cannot find the path specified), client: 115.60.16.122, server: www.m.baidu.com, request: "GET /card/shop/tab6_icon.png/ HTTP/1.1", host: "www.m.baidu.com", referrer: "https://servicewechat.com/wx9fcadf2030746bd2/0/page-frame.html"
2018/11/06 17:33:16 [error] 4776#5532: *422 "E:/card/shop/product/show/liaoyiliao_icon.png/index.html" is not found (3: The system cannot find the path specified), client: 115.60.16.122, server: www.m.baidu.com, request: "GET /card/shop/product/show/liaoyiliao_icon.png/ HTTP/1.1", host: "www.m.baidu.com", referrer: "https://servicewechat.com/wx9fcadf2030746bd2/0/page-frame.html"
2018/11/06 17:33:16 [error] 4776#5532: *420 "E:/card/shop/product/show/fenxiang.png/index.html" is not found (3: The system cannot find the path specified), client: 115.60.16.122, server: www.m.baidu.com, request: "GET /card/shop/product/show/fenxiang.png/ HTTP/1.1", host: "www.m.baidu.com", referrer: "https://servicewechat.com/wx9fcadf2030746bd2/0/page-frame.html"
2018/11/06 17:33:16 [error] 4776#5532: *424 "E:/card/shop/product/show/shoucang.png/index.html" is not found (3: The system cannot find the path specified), client: 115.60.16.122, server: www.m.baidu.com, request: "GET /card/shop/product/show/shoucang.png/ HTTP/1.1", host: "www.m.baidu.com", referrer: "https://servicewechat.com/wx9fcadf2030746bd2/0/page-frame.html"
2018/11/06 17:33:16 [error] 4776#5532: *424 "E:/files/20181017/0a73f4e7-14b8-4ea6-8a67-ad71f6fd83ba.jpg/index.html" is not found (3: The system cannot find the path specified), client: 115.60.16.122, server: www.m.baidu.com, request: "GET /files/20181017/0a73f4e7-14b8-4ea6-8a67-ad71f6fd83ba.jpg/ HTTP/1.1", host: "www.m.baidu.com", referrer: "https://servicewechat.com/wx9fcadf2030746bd2/0/page-frame.html"
4. nginx配置
listen 443 ssl; server_name www.baidu.com baidu.com; if ($http_user_agent ~* "(Android|iPhone|Windows Phone|UC|Kindle)"){ return 301 https://www.m.baidu.com$request_uri; } |
日志和nginx配置信息中我个域名替换成baidu.com,能说明问题就行,在配置中判断如果是手机端访问,则return 301
配置二
listen 443 ssl; server_name www.m.baidu.com m.baidu.com; location ~/weixin/(card|files|wxxiaochengxuimgs) { root E:\images; } |
微信小程序访问图片服务器,从baidu.com 301到m.baidu.com,然后直接读取硬盘图片资源
< swiper class = 'swiper' circular bindchange = '_swiperbindchange' > < block wx:for = '{{imagesList}}' wx:key = "*this" wx:for-index = 'idx' > < swiper-item > < view class = 'productmasterimage' > < image src = '{{item}}' mode = 'aspectFill' style = 'width:100%;height:750rpx;' bindtap = 'showmasterimage' data-index = '{{idx}}' /> < image class = 'videoplay' wx:if = '{{videocheck&&idx==0}}' src = '{{video_big}}' style = 'width:116rpx;height:116rpx;' bindtap = '_videoshow' /> </ view > </ swiper-item > </ block > </ swiper > |
循环imagesList数组,image标签直接指向网络图片地址,网络协议是https,
- 复现路径
疑问:
1. IOS部分网络图片随机不显示,是服务器并发到最到拒绝?但我nginx设置的是
worker_rlimit_nofile 65535; events { worker_connections 65535; } |
2. nginx配置问题
但安卓和模拟器可以正常访问到图片
3. 404?
真机调试,console栏里什么都没输出,没任何错误
5. 图片路径在IOS上没赋值成功
打开Wxml查看好好的啊
已经查阅N多资料,折腾了两周,问题还没解决,或许就差那一点点,大神们和腾讯官方给协助一下,谢谢~~
小程序基础库的版本是多少?
有触发error或者load事件么?
小程序基础调试库2.4.0
无error,image标签的load事件没测试,不清楚哎~~,但标签上绑定的wx.previewImage({url:***.jpg})执行没问题,可以预览到图片。
安卓和模拟器没问题,IOS系统会在个别图片地址后面加 “/” ,加后访问就变成了 ****.jpg/ 或者 ***.png/ (从Nginx服务器的Log日志查看推断的)
服务端会返回404,但前端无任何提示或者错误信息,奇怪的是一个page页面中几十张图片,不显示是随机的,如果全部不显示问题到好解决了。
补充下,关于小程序客户端访问静态资源,小程序的网络缓存真机上怎么清除?
之前真机访问 www.a.com,Nginx 301 到 www.m.a.com上获取图片文件, 地址末尾斜杠也有可能在重定向时加上的,我现在把301重定向取消了,前端访问www.a.com, 服务器直接从www.a.com上读取文件返回,但微信小程序客户端还是从www.m.a.com中获取资源导致我取消了www.m.a.com域名之后真机上大面积空白图片,现在的解决办法是删除微信,重新安装,图片不显示问题没再出现过。wx接口中只有wx.clearStorage没办法清除客户端网络缓存。
删除微信方式清除网络缓存成本有点大啊,生产环境重定向或者切换域名也会有,那时候小程序已经发布,切换服务器之后缓存不清,大面积空白页面很影响应用体验啊,不过我的还没上线,不影响~~
我也遇到了类似的问题,iOS加载资源的时候,将小程序切到后台,再切回来,部分图片无法显示,不能显示的图片是随机的,困扰好久了,希望官方可以解决一下
我也有类似问题,
重显方法为:在页面上的网络图片未加载完成前,将小程序退到后台,再回到前台,图片无法显示请问,你的问题解决了吗,我也遇到一样的问题
朋友,你这个问题最后是如何解决的呀?
我也遇到了相同的问题。求指点啊。
我也出现这个问题了 我的解决办法是 把 图片后面的参数都去掉就可以显示了
https://mmbiz.qpic.cn/mmbiz_gif/aSgMPQswpgJzVAqBAePaLoaUrptPbIAH1aQia3bejSTgD4EeeVTPN85vb3tialxRibvbt3AcGV7M6aEhF785bGI8Q/640?wx_fmt=gif&tp=webp&wxfrom=5&wx_lazy=1
例如这个
修改成 https://mmbiz.qpic.cn/mmbiz_gif/aSgMPQswpgJzVAqBAePaLoaUrptPbIAH1aQia3bejSTgD4EeeVTPN85vb3tialxRibvbt3AcGV7M6aEhF785bGI8Q/640
就可以显示了
不行呀,我的是放在cdn上的没了后缀png就找不到文件了
让我看看你的图片路径
请问这个问题解决了吗 ? 我也遇到了
我们也遇到了这种问题,模拟器和安卓手机都可以显示网络图片,ios不可以,试了苹果6,苹果7p和Xr,都不显示。
用背景图吧
背景图好像不可以根据来源图片的大小自适应等比例缩放的吧?
额,需要设置bg-size
我这边主要是受到webp的影响,把图片路径里的webp去掉就好了。更干脆的做法是把图片后面携带的参数都去掉。比如:https://*****.jpg?tp=webp&***, 改成http://***.jpg , 就好了,刚测试过可以用。
好的
有答案了吗 IOS网络路径图片不显示 开发工具安卓都没问题 6.7.4的微信
我也遇到过, 但是我的是在安卓机, 小米mix2s上, 在调试工具中是能正常显示的 一个 http://img , 但在安卓机上就显示不出来, 监控的error 也触发了, 错误信息是 404, 但是实际上是有这张图片的, 且在浏览器上也能正常范围。 这是什么原因
请问你解决了吗 ?
没有解决, 等官方答复呢