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

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

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

云开发

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

自己搭建服务器

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

Charlesix59
关注
专栏目录
微信小程序设置背景图片不显示问题解决方法
Ghjkku的博客
07-22 13万+
微信小程序设置背景图片不显示问题解决方法
微信小程序：背景图不显示、下拉没有触发onPullDownRefresh
03-29
No.1 背景图不显示 微信小程序里面是允许用户自定义背景图的，但是限定了背景图的路径及地址，之前一直用相对路径来写，微信开发者工具中也显示出了背景图，误以为没有问题，但是预览的时候发现手机中不显示背景图，这就是今天介绍的第一个坑，背景图不允许为本地图片。 解决方法： 第一、用在线图片转base64码的方法，这种方法的优点在于图片不存储在本地或者服务器上，占用空间小修改方便，缺点是小图片处理效果更好，大图代码相当的长，长的都不想看他... 第二、将图片上传至服务器，引用图片地址就可以了，方便快捷，不过修改麻烦且占用服务器空间。   No.2 下拉没有触发onPullDownRefresh  
微信小程序设置背景图片在手机端不显示的问题
A2258908698的博客
09-21 1053
微信小程序背景图片不显示
【微信小程序】微信小程序设置本地背景图片在真机无法显示的解决方案
最新发布
九日的博客
07-22 1598
使用网络图片：将图片上传到服务器，然后在 CSS 中引用网络地址。使用 Base64 编码：将图片转换为 Base64 编码，然后在 CSS 中引用。使用标签代替：在 WXML 文件中使用标签来显示图片。
微信小程序背景图片真机不显示问题
红叶落水的博客
02-22 5659
问题描述 ： 开发者工具上<view style="background-image: url(图片路径);"></view>可以正常显示 但是真机预览，不显示。 解决方式： 1.图片路径以http开头时，可以显示。所以，可以将图片放到微信云端，直接引用云id; 没钱的话，把多张图片放到一个压缩包里，压缩包放到云端储存；然后下载下来，保存到本地，再从本地引用即可；（实测，安卓没啥问题，苹果还是不显示） 2.将图片路径转化为Base64格式 Backgrou
微信小程序背景图不显示问题
思渝崖
05-30 898
微信小程序背景图不显示问题
微信小程序真机调试技术解析
"微信小程序真机调试.pdf" 微信小程序真机调试是开发过程中不可或缺的一环，它涉及到了小程序的运行架构、开发者工具的运作方式以及在真实设备上调试的挑战和解决方案。微信小程序作为轻量级的应用形态，其运行环境...
微信小程序真机调试连接断开
09-17
微信小程序真机调试连接断开的问题可以通过以下两种解决方式来解决。 第一种解决方式是重新安装微信开发者工具，并进行以下步骤： 1. 关闭微信开发者工具，并重新打开项目。 2. 确保重新登录项目。 3. 尝试重启电脑...
微信小程序真机调试错误
05-14
微信小程序真机调试错误可能有很多种，以下是一些可能出现的错误和解决方法： 1. 微信开发者工具与手机微信版本不一致 解决方法：确保微信开发者工具与手机微信版本一致，建议升级至最新版本。 2. 手机与电脑不在...
ios微信小程序真机调试取不出数据库
09-06
iOS微信小程序真机调试取不出数据库的原因可能有以下几点： 1. 数据库路径错误：在调试过程中，可能由于路径错误导致无法取出数据库。在检查路径时，需要确保路径的正确性，包括文件名和文件夹路径。 2. 数据库...
微信小程序背景图片不显示
Wandering的博客
04-12 1万+
最近学着写了一个微信小程序，可是总是是加载不出背景图片。这里先描述一下问题。 用下面这种办法声明的背景图片在本机和手机上都无法显示。 .container { height: 100%; display: flex; flex-direction: column; align-content: center; box-sizing: borde...
微信小程序项目真机调试图片不显示处理
luochunlong123的博客
12-05 2893
微信开发者上图片显示，但在真机调试时不显示。查看数据库图片文件上传方式。如果是本地地址，改成网络地址即可。如图：修改地址前调试前无图 修改地址后，改了地址的调试有图，没改的无图
uniapp 小程序 背景图片在真机上不能查看
...
02-19 6581
uniapp 小程序 背景图片在真机上不能查看
微信小程序换行符、hidden属性、图片高度、背景图不显示问题
qq_45350116的博客
09-17 1747
微信小程序\n换行符，只能在text标签中起作用
uniapp微信小程序无法使用本地静态资源图片，背景图在真机不显示方法
我总是词不达意的博客
09-30 1万+
uniapp微信小程序背景图的显示问题。微信小程序无法使用本地静态资源图片作为背景图解决办法。
关于微信小程序背景图手机上加载不出来问题的解决方案
m0_51495354的博客
10-17 1877
1.问题:平时在给背景图的时候大家的第一反应一定是在css中直接写background-image,直接就把图片当背景放在了那里，但是这样的方法在pc端还是可以的，在小程序端却存在着加载不出来的问题，现在我来给大家提供一个解决方法（插入图片的方法），直接在你想要加背景图的盒子前面插入图片，用<image>标签来实现，话不多说，直接上代码。2.原理：一个大的父盒子，同时里面包含（1.要当背景的图片2.要在背景上显示的内容）这样，给小程序加背景图在手机上显示不出来的问题就解决了。运用绝对定位，相对定位的知识。
微信小程序真机不显示图片【三个解决方案】
热门推荐
04-26 2万+
今天网友在开发小程序中遇见一个很奇怪的问题，就是编辑器编译后可以正常显示项目图片，但是当真机预览时却不显示图片。针对这个问题经过对比、尝试算是找到了问题的原因。下面将最近真机不显示的情况进行一下汇总： 1.本地图片文件名称中包含中文： 像上面图片，文件名称为中文，代码里面即使将文件路径设置正确同样真机不会显示图片。这个问题之前遇见过，不知道现在wx是否解决了这个问题。 2.本地图片文件名称中后缀大小写不统一： 当本地图片的后缀名出现有大写、有小写时就要注意了，代码中写的文件路径为小写时，就会出现真机不显
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值