修复微信小程序真机调试无法显示背景图片的问题

已于 2023-02-28 15:27:40 修改
阅读量1.4k 收藏
点赞数
分类专栏： 前端 文章标签： 微信小程序
于 2023-02-28 15:20:24 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/charlesix59/article/details/129262449
版权

腾讯出于某些原因的考虑，不支持微信小程序的背景图片为本地图片， 所以这就要求我们把图片存放在服务器中。

云开发

如果你是云开发项目将，可以将图片放在腾讯的云服务器上，具体操作如图：
将图片的本地url转化为网络资源的url
上传图片
点击云开发控制台
注意：因为存放在云服务器上，加载可能会稍慢

自己搭建服务器

添加白名单之后通过nginx或者tomcat引用静态资源均可

Charlesix59
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
微信小程序：背景图不显示、下拉没有触发onPullDownRefresh
03-29
No.1 背景图不显示 微信小程序里面是允许用户自定义背景图的，但是限定了背景图的路径及地址，之前一直用相对路径来写，微信开发者工具中也显示出了背景图，误以为没有问题，但是预览的时候发现手机中不显示背景图，这就是今天介绍的第一个坑，背景图不允许为本地图片。 解决方法： 第一、用在线图片转base64码的方法，这种方法的优点在于图片不存储在本地或者服务器上，占用空间小修改方便，缺点是小图片处理效果更好，大图代码相当的长，长的都不想看他... 第二、将图片上传至服务器，引用图片地址就可以了，方便快捷，不过修改麻烦且占用服务器空间。   No.2 下拉没有触发onPullDownRefresh  
微信小程序设置背景图片在手机端不显示的问题
A2258908698的博客
09-21 1010
微信小程序背景图片不显示
微信小程序背景图不显示问题
最新发布
思渝崖
05-30 497
微信小程序背景图不显示问题
微信小程序背景图片真机不显示问题
红叶落水的博客
02-22 5514
问题描述 ： 开发者工具上<view style="background-image: url(图片路径);"></view>可以正常显示 但是真机预览，不显示。 解决方式： 1.图片路径以http开头时，可以显示。所以，可以将图片放到微信云端，直接引用云id; 没钱的话，把多张图片放到一个压缩包里，压缩包放到云端储存；然后下载下来，保存到本地，再从本地引用即可；（实测，安卓没啥问题，苹果还是不显示） 2.将图片路径转化为Base64格式 Backgrou
微信小程序 实例汇总 完整项目源代码
11-01
10. **调试与发布**：微信开发者工具提供了强大的调试环境，包括实时预览、真机调试、性能分析等功能，帮助开发者找出并修复问题。完成开发后，需要通过微信开发者平台进行版本管理和提交审核，最终发布上线。 这个...
微信小程序代码：电影时光
06-01
9. **测试与调试**：小程序的测试包括单元测试、集成测试和真机测试，开发者需借助微信小程序开发工具进行调试，找出并修复可能出现的错误。 10. **发布与更新**：最后，开发者需要按照微信小程序的发布流程，提交...
微信小程序模板-100个
07-18
微信小程序是一种轻量级的应用开发平台，主要针对移动端，尤其是智能手机用户。由腾讯公司于2017年推出，它的核心理念是“用完即走”，旨在提供便捷、高效的用户体验，减少用户下载安装大量应用程序的需求。这个...
微信小程序+麦当劳点餐程序+源码demo+可视化图片
04-03
微信小程序是一种轻量级的应用开发平台，由腾讯公司推出，主要针对移动设备用户，特别是微信用户。它允许开发者在微信内部构建丰富的交互式应用，无需下载安装即可使用，极大提升了用户体验。微信小程序的设计理念是...
微信小程序项目真机调试图片不显示处理
luochunlong123的博客
12-05 2783
微信开发者上图片显示，但在真机调试时不显示。查看数据库图片文件上传方式。如果是本地地址，改成网络地址即可。如图：修改地址前调试前无图 修改地址后，改了地址的调试有图，没改的无图
微信小程序设置背景图片不显示问题解决方法
热门推荐
Ghjkku的博客
07-22 13万+
微信小程序设置背景图片不显示问题解决方法
微信小程序换行符、hidden属性、图片高度、背景图不显示问题
qq_45350116的博客
09-17 1657
微信小程序\n换行符，只能在text标签中起作用
uniapp微信小程序无法使用本地静态资源图片，背景图在真机不显示方法
我总是词不达意的博客
09-30 1万+
uniapp微信小程序背景图的显示问题。微信小程序无法使用本地静态资源图片作为背景图解决办法。
关于微信小程序背景图手机上加载不出来问题的解决方案
m0_51495354的博客
10-17 1753
1.问题:平时在给背景图的时候大家的第一反应一定是在css中直接写background-image,直接就把图片当背景放在了那里，但是这样的方法在pc端还是可以的，在小程序端却存在着加载不出来的问题，现在我来给大家提供一个解决方法（插入图片的方法），直接在你想要加背景图的盒子前面插入图片，用<image>标签来实现，话不多说，直接上代码。2.原理：一个大的父盒子，同时里面包含（1.要当背景的图片2.要在背景上显示的内容）这样，给小程序加背景图在手机上显示不出来的问题就解决了。运用绝对定位，相对定位的知识。
微信小程序背景图真机显示不了
zhoutao2的博客
07-20 2816
微信小程序背景图真机显示不了
【微信小程序常见问题】view标签设置背景图片手机无法预览解决方案二
FutrueJet的博客
11-09 1万+
【微信小程序常见问题】view标签设置背景图片手机无法预览解决方案二：将本地图片路径修改为网络图片链接。
解决小程序引入背景图片不显示的四种方法
xiamoziqian的博客
12-19 5723
小程序在css样式文件里面直接 background-image引入本地背景图是不生效的 .header{ width:100%; height:420rpx; background-image: url("/static/image/bg.jpg"); background-size: 100%; background-color: red; } 三种解决办法：...
微信小程序真机调试技术解析
"微信小程序真机调试.pdf" 微信小程序真机调试是开发过程中不可或缺的一环，它涉及到了小程序的运行架构、开发者工具的运作方式以及在真实设备上调试的挑战和解决方案。微信小程序作为轻量级的应用形态，其运行环境...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值