1. 程式人生 > >微信小程式 the server responded with a status of 404 錯誤解決方法

微信小程式 the server responded with a status of 404 錯誤解決方法

微信小程式開發,剛剛接觸這個小程式,遇到了題目中的問題,也就是在WXSS中無法使用background-image這個功能

後來經過各種查終於找到了解決方法。

首先官方給的說明是background-image:可以使用網路圖片,或者 base64,或者使用<image/>標籤

但是我是新手並不知道這個具體程式碼怎麼寫,因此在這裡網路圖片不知道怎麼用,base64也不清楚是什麼的情況下我只能慢慢摸索。然後第三種<image/>我也不清楚怎麼用,因為我是在 .wxss檔案裡面遇到的問題。

最後呢我是通過這樣的語句解決的

 background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACsAAAAgCAIAAAAE+BZUAAAFnUlEQVRYCa1WXWtcVRS9986dJpNMmgn5pCqKFb9AEcUG8iAUFATxzR/hX/DJJ/+HKPgLCkJFxGp9q4oGiygW25pq2iSm02SczGSue62197k3qY+eyZyz99prr73PuR+T/NKnn2VVlWV5xlFlZsdIpoIVeI0h32KnYFFOkes8ptVZ+cU33qYAE9zCksqhp/gQx+SfoCmPIKBEq4VOYiJIpZzqdCxF9XxO8i4ZmrVKYlhGQk029RClsUa6FyHLQUBlbuePQ85BzDkDYapCVYUjMwC0hweTyWBOQ0d8JCo5N3m2gQVCKJiXE2xD5wGMERJoIgRPK7doQMNjlAzlWkgazAO3qaoYoSRaTiagRWWj04vCrNlQgT4EwOIXvStfu2AwSMEMSmrSU5GYlUkRbTiVSxQw1A/PYF0llA/Vk4WTNBnisI66rBNlIblEG/ZBdRWmGwnAqmrCkKmDqZB3m3iMeKrTIIoUTJ7kLBGI251Y8TLUIalEHRTkqGXULTQRVJV6pQWyf6MLkhNbBmLWgd2J4Ke59lDZPLWUKPBFrkPOCaYHkluLI0Ilg6CD4rgPIKgv46hMKrAoZ3aeiGRHKDggy67zaAHURwE7dCmRbx0AaKgRFiVVB1ZldjfULRFiostDAjTNBrrJ1SPYswhI96Gn0Z0g1lLN3oXycYgDBmTDy8aC8t4PQiTrxNmev9mMxFdWCbJEkgAh9yJoGOHM9kFMdSOVseir0REawGB2TMmjYWcwQTo7behIjRSfpOMbeogJdWegHp/gJIogh0XwRqGimXhL4z44WTy6iZ16c54UoloFSpEzYZs4vCoP29MNqi1vhe9ESwAdiz5MBsiv8iIaYDCZy5LcC11l2MzfIIjzkqM8EQN85HoaURcF1KE0Gi47ieYSDrYPN0K1UYcvdOAQ50hGuLwPGqpqxKI0vKzFSQFcf6I+gtTlZVUx+R5wXA14RPXRmP8yeQ+xoIzLclHdaAAhEPgiiQNGkOquDQmduL3JAotVgK6M7gNtGbhqsYScJMy6KKx7196R1EMCh1xKCEA+Bmc1o0DYCpeZ3z9wsbWoKFugimuWCGYJJP+Um3AZzWjTtqswwZaA6azCJstr8sVdVaPemfb+kW9J15ZsPNY6OhZrurQhLBBdg6xSDrbW1h43QKBmNMNhreEP/0Rlo/n27++9PFztdH/Ygdz/N/As8ASsT5SdFHk+1oVJODp68PyC/Vdb7gzMwT5sGFrkdhH9f13sNPqCIt1kmJsIOoLYBn+dEa4GK9N7G6vHU8Xax79EFDo64f6FFSs2e+0uEQibzv6rywcvLva+3Or8ul8YpnpgcCT3YcPi6kP3wcGTczsXzx0+dTYr8pnNXTuIPC+CAO5o4czwkdn29mDqzmFWtCJka3XwbO/wmZ6FFj6/Pff9jp0fLno0o0OxBuLU0FmyZbQOPnhz9+K5o8XpYlx1Nu8tXL7V7o94gqgNw/a6vnL43MLZK1szv/WZ5sdd7P1j12C80hkvTB28sHh/fdWuS/vuoBgeW53ogyIo/d+jNXn3tWIwnru6tfTR9flv/mr3x3YAKduS7EjuvXN+0m0vffJzObTjQU8axXDSub7bvbrV6h+Nlmesj8HTvfsba2aU1sfBCJ2qEfUciZ5PsLV4dmX5w5+6m3vlsCoKq20VRAfNUo6Wp3ffemLq1oPeF3+cisK1fo+z6Rv9uSu3238ejpemx73p4WPd/Y21Iz04DTUvfHIp5r++0x7lRdGSnMrjqcBVxl//pUVLmb22jZABRNEaNoSv4dZ6K2t1f9ztXbpR7g9RosgH5+fxquHAUdaJSA48K2++vz7/1Zb1UfZH0GsMcyd59eDCqt1f3W/v+smQZHLmmqrGpMz7r6z8/fqjo6WOIflxNfPddu/yzdyeaHtiG0xsAT4mG9bHv66lp5/sSTBhAAAAAElFTkSuQmCC");
  background-repeat:repeat;
  padding-top: 30rpx;
在這裡面 URL是Uniform Resoure Locator(統一資源定位符),後面的那個就是base64對影象的編碼了。你沒有看錯隨隨便便一個影象的編碼都好長好長,我當時複製的時候猶豫了,最後貼上上發現確實可行而且不在報錯了。

如果繼續報錯建議選擇1.5.1後在次編譯就可以消除錯誤了。

最後的感悟就是,這個東西真挺累的。

附加彩蛋:微信小程式是有專門的開發者論壇,以及開發者文件的,這些論壇跟文件使用的前提是已經有微信公眾平臺的基礎上。對於新手還是很有幫助的,特別是我這種新手。