鍍金池/ 問答/人工智能  HTML5  HTML/ canvas toDataURL 跨域問題 設(shè)置了crossOrigin = '

canvas toDataURL 跨域問題 設(shè)置了crossOrigin = 'anonymous' 并沒有完全解決問題

今天寫了一個(gè)生成海報(bào)的H5，微信端的，其中海報(bào)有一塊要拿到用戶的頭像，并繪制到canvas上，頭像是拿到了，加載的時(shí)候也給圖片加上crossOrigin = 'anonymous'的屬性了，在獲取canvas的base64位的圖片時(shí)，出現(xiàn)問題了；
其中有一個(gè)圖片的是后端給我的微信頭像的路徑，微信源的，跨域了；
clipboard.png
圖片加載完成執(zhí)行ck回調(diào)
ck函數(shù)里執(zhí)行的是canvas的繪制，已經(jīng)最后toDataURL拿到canvas的圖片路徑
clipboard.png

經(jīng)測試后，發(fā)現(xiàn)有的手機(jī)微信端打開，toDataURL可以獲得正常的base64的圖片，也就是說跨域的微信頭像可以通過toDataURL拿到；
另有一部分手機(jī)報(bào)錯了，toDataURL拿不到任何東西；
求大神深層次講解一下，很懵，這個(gè)問題到底前端能不能自己解決，已經(jīng)完全解決。
通過百度感覺前端很難自己完全解決。。。。
求大神講解

回答
編輯回答
不二心

不算答案的答案

按照你的描述，我覺得問題不是出在前端能否做到，
而是在于各個(gè)移動端瀏覽器廠商對跨域限制的處理不是一致的，
協(xié)議是死的，人是活的。人家就是不遵守，你也沒辦法。

這個(gè)問題光靠前端基本搞不定，所以在后端做一層跨域代理我覺得是唯一的解決辦法

2017年8月19日 10:26
編輯回答
薄荷綠

前端只設(shè)置crossorign是不行的，后臺服務(wù)器還要返回access.control.allow.origin。還有個(gè)需要注意的地方，圖片前端有沒有緩存。再有的瀏覽器下第一次訪問ok，再次刷新訪問我就拿不到數(shù)據(jù)了。

2017年6月2日 22:46
編輯回答
舊言

同樣遇到這樣的問題，但是我怎么把后臺提供的二維碼連接（不是圖片鏈接），同樣作為動態(tài)的值，合成到海報(bào)上啊？

2017年2月28日 06:11
編輯回答
久不遇

如果用到nginx，可以在nginx的location里面加上下面這行代碼試試：

add_header 'Access-Control-Allow-Origin' '*';
2018年8月5日 16:06