IOS canvas drawImage img 取不到 src

需求：現在需要一個簽名版，用戶可以分多次簽名字的姓和名。 多次簽名平合成一個圖片 傳遞給后台。

現象：pc,安卓顯示均正確，但ios上 合成的圖片總是顯示不出來。

html:

<div>
    <canvas id="single"></canvas>
    <img id="singleImg">
    <canvas id="compose"></canvas>
    <img id="composeImg">
</div>

JS：使用了jSignature.js 插件

 var data = $('#single').jqSignature('getDataURL');//獲取單次簽名的base64
 var img = document.getElementById("singleImg");
img .prop("src",data);//顯示給用戶
$('#single').jqSignature('clearCanvas');

var c = document.getElementById("compose");
var ctx = c.getContext("2d");
img.onload = function(){
      ctx.drawImage(img,w,0,100,100);
      w+=100;
      var data2 = c.toDataURL();
      $("#composeImg").prop("src",data2);
};

查出問題所在的思路：

一開始並沒有將代碼寫在

img.onload 方法里
===========================================================================

一開始上網查看有的說是跨域的問題，額。。。

1. data2 沒有取到   alert出來是有的，base64的一大串

2. 既然src是有的，那就是合成時沒畫上去？

　　於是把data2的內容寫到頁面上，賦值出來，直接賦值到html的img src屬性上  哭~ 空白

3. drawImage的問題？ 把img 的src 寫到頁面上， 竟然和2 的base64 字符串一樣， 空白~~~

4.好吧好吧，問題嘗試嘗試着就清晰了，把 img onload 的時候 打印出 img src    出來了~~~

問題的根源就是圖片還沒有load 成功。