fr-wvjs.html 1.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142
  1. <!DOCTYPE html>
  2. <html lang="zh">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6. <title>wvjs</title>
  7. </head>
  8. <body>
  9. <script type="text/javascript" src="./uni.webview.1.5.5.js"></script>
  10. <script type="text/javascript">
  11. // 初始化时候抛送
  12. uni.webView.postMessage({data: {isInitialize: true}});
  13. /**
  14. * 响应 web-view png 数据
  15. * @param {Object} svg svg格式参数,不能是svg图片
  16. */
  17. function onPostMessage(type,resourceId,resource) {
  18. // 转化svg为png时的类型
  19. if (type == "svg") {
  20. svgTurnPng(resourceId,resource);
  21. };
  22. };
  23. /**
  24. * svg转png
  25. * @param {Object} svg vg格式参数,不能是svg图片
  26. */
  27. function svgTurnPng(id,svg) {
  28. const src = `data:image/svg+xml;charset=utf-8,${encodeURIComponent(svg)}`;
  29. const img = new Image();
  30. img.src = src;
  31. img.onload = () => {
  32. const canvas = document.createElement('canvas');
  33. canvas.width = img.width;
  34. canvas.height = img.height;
  35. const context = canvas.getContext('2d');
  36. context.drawImage(img, 0, 0);
  37. uni.webView.postMessage({data: {id: id,result: canvas.toDataURL('image/png')}});
  38. };
  39. };
  40. </script>
  41. </body>
  42. </html>