收藏
回答

IOS系统部分图片不显示问题,求大神分析

框架类型 问题类型 操作系统 操作系统版本 手机型号 微信版本
小程序 Bug iOS iPhone; CPU iPhone OS 12_0_1 like Mac OS X IPhone 6 6.7.3

- 当前 Bug 的表现(可附上截图)





- 预期表现


产品轮播图正常显示


问题说明:


  1. 小程序体验版本,在IOS真机上部分网络图片不显示,安卓系统和开发模拟器上正常,从未出现过该问题。

  2. 两个不同的IPhone手机,图片在另一个IOS手机上正常显示,但又会丢失其他图片,丢失图片完全是随机的(图片格式是jpg和png),在图片上绑定了预览图片方法,执行wx.previewImage方法传入不显示的图片地址,可正常预览

  3. 和swiper标签没有任何关系,在page中直接一个image标签也会随机图片不显示。

  4. 在后台查看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多资料,折腾了两周,问题还没解决,或许就差那一点点,大神们和腾讯官方给协助一下,谢谢~~

回答关注问题邀请回答
收藏

15 个回答

  • 视频号小店技术助手 - cunjin
    视频号小店技术助手 - cunjin
    2018-11-08

    小程序基础库的版本是多少?

    有触发error或者load事件么?

    2018-11-08
    有用
    回复 2
    • 解析
      解析
      2018-11-08

      小程序基础调试库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没办法清除客户端网络缓存。


      2018-11-08
      回复
    • 解析
      解析
      2018-11-08回复解析

      删除微信方式清除网络缓存成本有点大啊,生产环境重定向或者切换域名也会有,那时候小程序已经发布,切换服务器之后缓存不清,大面积空白页面很影响应用体验啊,不过我的还没上线,不影响~~

      2018-11-08
      回复
  • zqh
    zqh
    2018-11-08

    我也是经常这样,跟带宽没太大关系,需要重新加载才有概率显示

    2018-11-08
    有用
    回复
  • habbi
    habbi
    2018-11-07

    好久之前都有这问题了,概率性的在个别手机出现。也没见解决过。

    2018-11-07
    有用
    回复
  • 王佳佳
    王佳佳
    2018-11-07

    同问,目前发现iphone手机上出现image标签图片不显示的现象,都是随机的不显示,同样是两台iphone7P,有一台就出现了image不显示,不显示的微信版本是6.7.2,IOS版本是 10.3.3  ,显示正常的微信版本是6.7.3,IOS版本是11.4

    2018-11-07
    有用
    回复
  • J丶春风🔥
    J丶春风🔥
    2018-11-07

    我之前把图片全换成了背景图,做了分页加载和图片压缩;大多数情况都是好的;最近又碰上了,在iphone plus系列上有固定图片不显示的bug.

    2018-11-07
    有用
    回复

正在加载...

登录 后发表内容