最近用 Cocos Creator (cc) 開(kāi)發(fā)微信小游戲。由于 微信小游戲存在 主域和子域的隔離；

• 主域，你的主要游戲場(chǎng)景，和一些交互按鈕等內(nèi)容；

• 子域，主要用于獲取用戶數(shù)據(jù)和排行榜的顯示；

微信這樣分開(kāi)也是為了更好地保護(hù)用戶數(shù)據(jù)，防止數(shù)據(jù)泄露。因此一定要合理的設(shè)計(jì)自己的主域和子域；

凡是設(shè)計(jì)從微信里獲取數(shù)據(jù)的比如用戶頭像，游戲成績(jī)等；一定需要在子域的canvas 完成繪制；

實(shí)際在完成排行榜的功能時(shí)候遇到了一點(diǎn)兼容性的問(wèn)題，Android 的部分機(jī)型(自己這邊全部復(fù)現(xiàn))和 iOS 設(shè)備上存在畫(huà)布模糊的問(wèn)題:

ios 的截圖如下:

搜索了一下，發(fā)現(xiàn)沒(méi)有多少人提出這樣的問(wèn)題，但是看別的游戲也存在同樣的問(wèn)題；

不過(guò)，靈機(jī)一動(dòng)?。?！

如果前端接觸 canvas 的話，才開(kāi)始都會(huì)遇到一個(gè)問(wèn)題，就是再 PC 上看著挺好的，但是在移移動(dòng)端就模糊了，因?yàn)檫@里存在一個(gè) 設(shè)備上物理像素和設(shè)備獨(dú)立像素(device-independent pixels (dips))的比例 因此你的 canvas 設(shè)置的像素要比實(shí)際多出一些比如會(huì)有:

canvas.width = window.innerWidth * window.devicePixelRatio  

于是照著這個(gè)思路，輸出了 主域的 canvas 寬度 和 子域的 canvas 寬度，發(fā)現(xiàn) 子域的 sharedCanvas 并不是你預(yù)期的寬度，因此這個(gè)時(shí)候你需要手動(dòng)的將它設(shè)置成你在 cocos creator 設(shè)置的畫(huà)布大小比如 750 * 1662 等；

if (typeof sharedCanvas !== 'undefined') {  
  sharedCanvas.width = 750
  sharedCanvas.height = 1662
}

大概完成后就不會(huì)有模糊的感覺(jué)了~