我一直在尝试十几种方法将svg生成的dataurl保存到我的服务器。这段代码似乎应该基于我在这里阅读的其他线程工作,但由于某种原因它只是创建一个0kb的.png文件。我继续前进,只是将dataurl复制/粘贴到我的脚本中,以避免现在将任何数据发送到php问题,我只是想看到php正确创建图像。这是我的代码:
$img="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAiYAAAGQCAYAAACatauzAAAgAElEQVR4Xuy9C5Bd1XkuuPY5p1+ipW61QOiBUSMhB0dcJGI8uTUxVy1V2amZugO4Mjck4IzEVPCYZKYQju+ti2OwYrA9Vbk2eG4lUGqqJBkJhkx5eNzM1MSuWC2TVDnXsvUA2TJCUguQEBJqdevZj3POnv/f56zuv0+fx36svfdaa/+rSjRSr73W2t+/9t7f+p+O4MYIMAKMACPACDACjIAmCDiarIOXwQgwAowAI8AIMAKMgGBiwpuAEWAEGAFGgBFgBLRBgImJNqLghTACjAAjwAgwAowAE5OE98DA9u29or34KAB/YM+DD7+e8PQ8HSPACDACjAAjoDUCTEwSFM/A7m3rcsIZcoXoqU476gjnNVe4rzFJSVAQPBUjwAgwAoyAtggwMUlQNBt2De4Ar55Ndy+8QVwrlcRbV8bciVLJkwH8Z0wId0/Zzb0m8lN7h/74keEEl8ZTMQKMACPACDACWiDAxCRBMUhicv+SFeKunj5v5rcvj4nDl0bFsWuXxYWpSbqaA64jhhzUpjzwpb0JLpOnYgQYAUaAEWAEUkOAiUmC0A+8/Fy/Uy6c6GtrF4+vXDNn5tMT18Sxq5c8snL86uXp37M2JUEh8VSMACPACDACqSKQSWKycfe2V13H6XVdMSRyxZ1Jmk3qaU3q7YBr5RKQlMuNtCngm+IOlYVzwHHcIdaopPoM8eSMACPACDACChHIHDGRWguJIWojysIdGHrwSwei4jrw0gv3Cddd6zhiABxcD+RcID/C3Vwdd9Qtiy+IQnG4mdak0RqkNgXJCv5/jdkHL6uYfoBsuZOFvUMPPTQa9X74ekaAEWAEGAFGIGkEskdMdm/bDJEw29EBdSGYVN44ewowd4fdybY7o37MN+weHILB1lMh4hz4xzPNAHHY88DDG/xqTZptBiQmFZJytfrzWm33A0COXoN7e10F6Up6Y/J8jAAjwAgwAtlEIHPERJKCx/pvE8s6uoCYfCDevHDO0zhAyO6dUbYBmIiedYXz6JruHnEY/ERw/C/fvNob8jvHDgs0z7i54i34d9Sa4O9xHaoaEhX0UcG5UatCmheWXEbT1VT+9agETNV6eRxGgBFgBBgBRqAWgewRk93bTnTkCyuevvWO6Xvfceq49zFHjYY7UfhC2A835CnxtDGfW7TEi7IZh5Dgz/QsEj8fO18hCq7YueeLD29GIYB2BbQZ4t4vf2K1WDWvW/nORBJ0+NLYtDPtOPydNE+bwv4pymHnARkBRoARYAQiIpApYiL9S1YCEXgECIFs+BFHclKNhDkAPhobwpATzOqaay+d7Mg53fPyhdzI7PBfT1siHW037hrcAj4hzyCJ+fz1SyOKsfXlSIzeroYlc8RPa7y4ByPACDACjEA6CGSLmBCNRj0y8MqHJ8W+iyMoiQPgqPrY0J88PBRULOgA6...j/bZbdmX23g8nv8GSJ7ZsQ3ZHlk6Ep0rW9snCcckDs0DcHSQjueyQrtUSk3vxZJoBMTOLckTx2Yghs3P3CWEc+N3/zspUOm3ASgz3URJWTtzMKXs29tifqCgWQhhcxMVEnFFonqgOcZO8Ds7M0Z047hjsOZMR3vQyzWXyfMTFRt994pBQR2LhrcIvriGdwCehohj4maWScTRECI6ZGNfe3jx/21soaLiNE5i2SEpOsfixVSgvxxGehnn9VbTHBWrMOal3w2bG5MTGxWboZu7dqNeStcNteMre7Fy4Wn7t+CZsKNNoHnMNEI2EEWAoN8WZiEgC4kF2pHxYOITWLMlU+RvvcDoneMDkltqVAVJoVFpTm07gOA2iq+gVkysWf6LhbS5zQwffwpVFP+/NpqC3UqggiE5OQG4cv0xcBCCfeDN7wSFBW4AP8+4uWOly+XA950crPd0NJedRscdMfAdsrC+soAUpOHgGTDtbl8aqmV808tWtu5K9VWzcsjO/KP10455EO2iQBQQ0OJkSTfmNIlh4n2ZzpMy+vb5XskomJjjuS1xQZAQwfzrUXt8BT/BgYaxfgw/KHEJqaRXttZDAVDsA5TBSCmeBQVG5cbyoZ4KmTuJwRE3m1wWHrOiggWFs9vVHo/fPvH/VMcdjw+g64fnlHl4OhyfhexFxPzUxD1Cem9s7xOsiy7VVcbopKDZnCAyOQLVhDfZMUE5Nk9hjPkhICXn6TtuKz8ERuwiUgMcFTuu022pTgbjntjlPHvagEbGwSaAmXNh1M+1BoA1yEhSDx2DPykdh3ccSdKpe9D/9NULn9f1p2y7T/HPb5LkS5YYI3jG7DRJKYMkH619X6dEmtRu2ykKBgdWR6rexDn9l6tyMLHOKctWRJ9scaQ/+6Z5FXjVk+/zjn5yBkul52XNP2G2d+jbDRs3wpZosF886zgIHnf4IP4T2Ll7P/ScKbgqqnMbSbCWLCAgg5nWm1S0LepraXoTmk8t6am4yQykbeAPpwYEp8TNwmtSWo6fo5/B2JQSOCgtfjM/kZeD+iqebYtcvi9bMfeBoRJBD43sSGBOTnF897Vdtv7pon/vvrl3uHPlwL1imjrTbzdq0mqDbhHF77/2+0YTJok+Kow2gRAg7L5gQw/v8PaqCA15/YCYqB15+MnqVBi9DGNBN6SNcPoAzH6FZh+oQ5NWwZare9UsPPQ8kM0OLkg8DRlQffv2J1NrbTekENlrvfPhNsqMAMpFZHArRWBTQKA2rUIAPItBIveGHsU+CZL7vfvgBLD4VyYnTEZCjllkHsVtD2YuAiskbY+hNcQ4qD2AtDzmmgAgl0ERwQ/AEO+7KAenCjYGiEAKxhQqtdHUMjFAa/K0EjGaDRhktfP/7/BV33AYqzBGklvMcnwE6rBY3MYBtNocXFjaDGFOh6Cvj0D45FvaMNk8Gf7kZdOBoCoyEwGgKjITAaAqMhMIhCAAC+P4HZvnVG3QAAAABJRU5ErkJggg==";
$filedata = substr($img, strpos($img,",")+1);
file_put_contents("testfile2.png", base64_decode($filedata));
echo "file created";
这里是生成数据的jquery代码。我只是将其从警报复制到此脚本中进行测试:
$("#testclick").click(function() {
var svg = document.getElementById("map").innerHTML; // or whatever you call it
//alert(svg);
$('#load-target').html(svg);
var canvas = $('#load-target svg')[0];
try {
svgAsDataUri(canvas, null, function(uri) {
var image = new Image();
image.src = uri;
image.onload = function() {
var canvas = document.createElement('canvas');
canvas.width = image.width;
canvas.height = image.height;
var context = canvas.getContext('2d');
context.drawImage(image, 0, 0);
var a = document.createElement('a');
a.download = name;
alert(canvas.toDataURL('image/png'));
a.href = canvas.toDataURL('image/png');
document.body.appendChild(a);
a.click();
}
//alert(uri);
$.post("http://www.srqnews.com/maps/create.php",
{
type:"PNG",
datauri:uri
},
function(data,status){
alert("Data: " + data + "\nStatus: " + status);
});
});
} catch(err) {
alert(err.message);
}
});