小程序服務器圖片的使用

Hello,小夥伴們下午好,最近手頭上比較忙,呼呼,還接了別的組的一個小項目,自己手裏的小程序還一分爲二個版本,忙的都有點抓不過來了,導致最近發佈小程序正式版的時候總是存在一點問題,慚愧慚愧~也總算是告一段落了,現在我來更一片有關使用小程序服務器圖片的博文咯。
衆所周知,小程序的大小限制在2M,我手頭上這個項目目前已經不小了,因此時常出現超過2M上傳不了代碼的情況,爲了解決這個問題,我曾經把項目的圖片儘可能的去做了壓縮,可是省下來的空間永遠趕不上需求的增加,很快就又會出現這個問題,很是頭大,就是那種眼看着自己辛苦寫出來的代碼還不能面世的尷尬,心痛的很,那麼有人說了小程序不是提供了分包加載嗎?是的嘞,但是我目前使用的是wepyjs的框架,對於基於這個的分包實在是沒琢磨透,所以沒敢輕舉妄動,因爲就想到了把本地圖片放到服務器上的辦法,哈哈~也算是笨人有笨辦法吧,嘻嘻。。。

那麼接下來就來說我是怎麼處理的,其實還是很簡單的。
首先,讓後臺的小夥伴協助把圖片放到對象項目的域名上,那麼這個圖片對於我們來說就相當於項目的接口一樣了,在使用的時候只需要把對應的接口域名拼接上即可啦,下面我們來看一個小例子:
圖片已經請後臺放到了服務器上了,那麼負責任的後臺呢會給你一個完整的圖片鏈接給你做例子,讓你去對應的修改你所需要的圖片。
在這裏插入圖片描述
如上圖,這就是我們後臺把圖片放到服務器上給我發的一個鏈接例子,正如你們所看到的,我掩蓋到的部分就是項目的域名,Picture是服務器上放圖片的文件夾,然後就是對應圖片的名稱。
所以這樣看來就很簡單了吧,我得具體做法是:
在app.wpy文件的onload中,給globalData附上服務器圖片的公共域名鏈接的前半段,然後在其他wpy文件中,直接在onload中把globalData賦值給當前頁的一個data值使用即可。如圖:
首先:
在這裏插入圖片描述
如圖畫紅框的位置就是項目的域名,但是因爲公共方法中是爲接口準備的,爲了方便加上了api,所以在用圖片的時候用不到,故而替換成了圖片文件夾,然後賦值給globalData對象的globalImgUrl。
其次:
在這裏插入圖片描述
在其他wpy文件中的使用,就如圖所示的操作即可啦,值得一提的是,要想使用app.wpy文件中的globalData,需要用this.$parent獲取父級數據。
使用:
在這裏插入圖片描述
那麼使用的時候直接雙花括號賦值就行了呢,記得拼接圖片名哦。
還有值得一提的一點就是,細心的小夥伴可能已經注意到了,image上我還加了一個if條件,其實這個問題倒不是什麼大問題,就是你一開始進入到這頁的時候如果這個時候圖片還沒賦值上,它會報如下錯,所以故而加上顯示的判斷條件呀
在這裏插入圖片描述

好了,這就是如何使用服務器上的圖片啦,希望能幫助到大家,麼麼噠,拜拜~

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章