search

SevenOutman / vue-aplayer

:cake: Easy-to-use music player for Vue 2.x
https://vue-aplayer.js.org
MIT License
1.33k stars 201 forks source link

無法顯示圖片 #116

Closed maple3142 closed 6 years ago

maple3142 commented 6 years ago

如題 右邊是傳給 music 的內容，那個 pic 的路徑也確實存在 但為什麼圖片卻無法顯示? 音樂倒是可以正常撥放 image

SevenOutman commented 6 years ago

@maple3142 你的控制台显示有2处报错，也许与它们有关

maple3142 commented 6 years ago

那個只是 warning 而已，也不會有嚴重影響 而 aplayer 的 background-image 不知為何是被設成預設的圖片 image

SevenOutman commented 6 years ago

@maple3142 是只有 pic 是本地路径的时候会这样？还是使用 URL 也会这样？

maple3142 commented 6 years ago

image 使用 URL 就沒問題了，但是檔案路徑就不行

補充: 我大概研究出來是為什麼了， electron 支援在 img 等 html 元素直接指定使用檔案路徑，但是沒辦法在 css 的 background-image 屬性上面的 url 直接用檔案路徑 需要改用 img 來顯示縮圖才能使用 目前我需要透過 fs 把檔案讀取成 Blob，然後用 Object URL 作為 pic 放進去才能用...

SevenOutman commented 6 years ago

@maple3142 实际场景中通常这些资源大多是托管在服务器上的，用的是 URL，应该问题不大

maple3142 commented 6 years ago

我最後用了 pic: JSON.stringify('file://' + localImageUrl) 的方法解決了，感謝