base64がうまく取得できない

サイト作成の勉強中です。

スマホカメラで撮影してbase64で別ページにPOSTしようとしています。
スマホではconsole.logできないので、PCで実行してconcole.logしたbase64（長い文字列）を以下のサイトでデコードしたところ、真っ白でした。
https://www.en-pc.jp/tech/base64.php#result
ページ上のcanvasには画像は表示されています。

どこが悪いのかアドバイスをお願い致します。

index.php
1<!DOCTYPE html>
2<html>
3<head>
4  <meta charset="UTF-8">
5  <meta http-equiv="X-UA-Compatible" content="IE=edge">
6  <meta name="viewport" content="width=device-width, initial-scale=1.0">
7  <title>Scan</title>
8  <meta http-equiv="Content-Style-Type" content="text/css">
9  <link rel="stylesheet" href="css/styles.css">
10</head>
11<body>
12<header>
13    <img src="../../img/home.png" id="home" onclick="location.href='../index.php'">
14</header>
15<main>
16  <video id="video" muted="muted" autoplay playsinline></video>
17  <canvas id="canvas"></canvas>
18  <audio id="se" preload="auto">
19    <source src="shutter.mp3" type="audio/mp3">
20  </audio>
21</main>
22<footer>
23  <div class="imgbox">
24    <img src="../../img/shutter.png" id="shutter">
25  </div>
26</footer>
27</body>
28<script src="js/main.js"></script>
29</html>

main.js
1var video = document.querySelector('#video');
2var canvas = document.querySelector('#canvas');
3
4navigator.mediaDevices.getUserMedia({
5    video: {
6        // facingMode: { exact: "environment" },
7        facingMode: "user",
8        width: { min: 640 },
9        height: { min: 360 }
10    },
11    audio: false
12})
13.then(function(stream){
14    video.srcObject = stream;
15    video.play();
16    
17})
18.catch(function(e){
19    document.querySelector('#result').textContent = JSON.stringify(e);
20});
21
22document.getElementById("shutter").addEventListener("click", () => {
23    se.play();
24    var cvs = canvas.getContext('2d');
25    cvs.drawImage(video, 0, 0, video.videoWidth, video.videoHeight);
26    var base64 = canvas.toDataURL('image/png');
27    console.log(base64);
28
29    var data = {};
30    data.image = base64;
31
32    // var form = document.createElement('form');
33    // var request = document.createElement('input');
34 
35    // form.method = 'POST';
36    // form.action = 'result.php';
37 
38    // request.type = 'hidden'; //入力フォームが表示されないように
39    // request.name = 'image';
40    // request.value = base64;
41 
42    // form.appendChild(request);
43    // document.body.appendChild(form);
44 
45    // form.submit();
46
47});