解決小程式圖片在開發者工具能顯示，真機不顯示問題

阿新 • • 發佈：2018-12-13

最近在學習微信小程式開發，剛寫完一個測試頁面拿起手機體驗的時候bug就出現了，心裡苦~ 出現個很奇怪的問題，頁面的圖片在開發者工具中明明是可以顯示的，但到了真機中卻不見了，檢查過圖片src路徑，貌似也沒寫錯吖。於是開始去網上找各種部落格、帖子。大致的解決方法無非是以下幾種：

圖片路徑不能帶有中文
圖片名稱去除空格
將圖片字首http改成https
域名需備案
本地圖片src用絕對路徑（'/images/test.png'），不要用相對路徑('../../images/test.png') ，使用相對路徑不能正確解析。具體原因這位大佬詳細解釋了

https://blog.csdn.net/li11_/article/details/81477888

小程式載入圖片的兩種寫法

1.載入本地的圖片

<image class="testImg" src="/image/arrowright.png"></image>

2.載入網路圖片

<image class="testImg" src="https://img1.3lian.com/2015/w7/85/d/101.jpg"></image>

解決小程式圖片在開發者工具能顯示，真機不顯示問題

微信小程式wx.request請求沒反應，真機預覽測試請求無效問題解決總結。

我釋出之後發現，wx.request無法使用，用小程式開發工具測試的都沒有問題，而且校驗了合法域名、web-view（業務域名）、TLS 版本以及 HTTPS 證書，都沒有任何問題，釋出之後，發現了問題，在網上看了很多說法，再次我用自己的理解做個總結。測試了

微信小程式之wx.request:fail錯誤，真機預覽請求無效問題解決，安卓,ios網路預覽異常

問題描述：域名已經備案，我全部都有，也在後臺配置了，但是手機預覽，還是請求失敗， PC端是可以請求資料出來的新版開發者工具增加了https檢查功能；可使用此功能直接檢查排查ssl協議版本問題：可能原因：0：後臺域名沒有配置0.1：域名不支援https1：沒有重啟工具；2：

小程式canvas使用網路圖片真機不顯示解決方案----可直接使用案例測試

圖片都是線上的，可以直接放到onLoad裡邊自動檢測 1.注意點：在繪製網路圖片時必需先將其儲存到本地然後在繪製。當我們在載入一個帶有圖片的頁面時，圖片都會被暫存到本地，由此我們可以通過wx.ge

微信小程式使用本地圖片在真機不顯示的問題

最近做的小程式，在真機測試發現有些本地圖片在開發工具上可以顯示，但是在真機上預覽的時候不能顯示程式碼是這樣寫的 <view class='seat-size' wx:for="{{item}}" wx:key="index" wx:for-index="index" wx:f

微信小程式分享到朋友圈-遇到的問題drawImage真機不顯示網路圖片

網上有現成的例子，所以直接拿來用了，見連結，接下來說下自己遇到的問題 -> 因為在我的專案中，我的圖片是網路圖片，canvas上繪製的目前只支援本地圖片，那應該怎麼辦呢？不可能圖片是固定死的，所以只能另尋捷徑了，前端開發

實戰解決小程式圖片載入問題

相較於web端或者H5開發，小程式本身在效能上弱很多（但使用者體驗上要好）。以前開發時伺服器效能過剩在那裡幫你撐著臉面，你對自己的程式碼質量和程式設計習慣心裡沒數，小程式就是一面鏡子。廢話少說，要解決的問題是，小程式載入圖片閃爍，漸漸出現，出現的很慢等等效果不

windows環境，teamviewer13被檢測為商務用途，不能連線，重新安裝不顯示用於“個人用途”的選項，還需要刪除“regedit”登錄檔下teamviewer資訊

剛學習使用TeamViewer的使用者可能不知道當我們的軟體使用過期了該怎麼辦，尤其是個人免費版為什麼會過期以及怎麼解決呢？今天小編就來教大家解決此類問題的方法吧！圖：TeamViewer被檢測為商用當然，以下操作步驟和解決方法僅限於個人被誤檢

解決android7.0+ 自定義Toast時長，但是toast不顯示問題

重點在於解決部分機型自定義Toast 時長不顯示問題在部分手機上會出現自定義時長的Toast不顯示，從而導致出現bug（排除Toast許可權被關閉情況），這樣我們需要自定義Toast 程式碼如下 public class ToastUtils { pr

關於微信小程式圖片本地顯示真機測試上不能顯示的問題

廢話不多說直接入正題圖片不能過大圖片命名不能含有中文圖片命名也不能有空格圖片大小寫要區分以介面或者連結形式的圖片開頭不能是大寫的HTTP結尾也不能是.PNG 上面就是我在今天碰到問題時在網上搜到的普遍解決方法但如果問題還沒解決，怎麼辦呢？

小程式video元件在開發者工具可以播放，在手機上無法播放問題終極解決方案

如果你的伺服器是Apache2.4，不是的請繞行！究其根本原因：就是阿帕奇沒有配置MP4視訊不要進行的gzip壓縮。在阿帕奇的配置檔案中加一行： SetEnvIfNoCase Request_URI。（？：gif | jpe？g | png | zip | mp4）

解決小程式背景圖片不顯示問題

微信小程式通過 background-image 設定背景：只支援線上圖片和 base64 圖片，不支援本地圖片。線上圖片：圖片上傳到微信開發者工具雲開發中，拷貝路徑到 background-image 中即可。 base64 圖片設定步驟： 1、在網站 http://imgba

小程式圖片不顯示問題解決

弄了2個小時，http和https的圖片就是不顯示，但是相對路徑的圖片就顯示。最後查出問題是因為： image標籤被text包裹了，text標籤只能用來顯示文字，你把text標籤去掉應該就好了。

微信小程式圖片拼接的時候底部留白的問題解決

原文連結：傳送門 1.給圖片包裹元素加屬性 position: relative;

微信開發者工具初始化專案時，進去報錯：小程式重啟耗時過久，請確認業務邏輯中是否有複雜運算，或者死迴圈

　　　　　　　　　　如圖上，為錯誤原因。　　之前用開發者工具用的好好地，前些日子又版本更新，升級了一下，然後開啟專案就出現上面的問題。當時以為電腦出啥問題了，也沒當回事。今天再次開啟開發者工具，發現還是出現上面的問題。一臉懵，新建專案，啥都沒做竟然出問題。網上一查同樣的問題一大堆。

解決小程式中圖片或者視訊元件下方出現白色空隙的問題

小程式中如下程式碼會出現視訊元件下方空白 <view class='head'> <video id="myVideo" src="{{video}}" controls></video> </view> 解決方法是設定圖片或視訊元件

微信小程式圖片文字水平垂直居中對齊解決方案

我們知道常用的居中對齊方式有很多種例如： text-align:center; align-items:center; justify-content: center; margin: auto; #子容器在父容器中居中但是在view中的文字對齊卻不能簡單的使用text-ali

小程式真機除錯顯示已結束請重新開始解決方法

可能是晚上更新了下微信開發者工具的原因，下班回家開啟微信真機除錯就一直這樣，真是差點罵娘重啟開發者工具，重新下載最新版本開發者工具，甚至重啟電腦都試了。然並卵！最後真的絕望了，下了箇舊版本的開發者工具，居然就好了…… 歷史版本下載開發者工具地址：https://dev

微信開發者工具匯入專案提示：登入使用者不是該小程式的開發者

有時候，我們在使用微信開發者工具匯入別人開發好的專案時會提示：登入使用者不是該小程式的開發者。如下圖所示：這時候，找到“project.config.json”檔案，我們需要修改專案中的“project.config.json”檔案。使用記事本或

微信小程式圖片等比縮放顯示正中間

這是小程式 image標籤的mode ,對圖片的縮放做的處理縮放 scaleToFill 不保持縱橫比縮放圖片，使圖片的寬高完全拉伸至填滿 image 元素縮放 aspectFit 保持縱橫比縮放圖片，使圖片的長邊能完全顯示出來。也就是說，可以完整地將圖

解決小程式圖片在開發者工具能顯示，真機不顯示問題

小程式載入圖片的兩種寫法

相關推薦