JS Load Image onto Canvas

<!DOCTYPE html>
<html>
    <head>
        <title>My Image</title>
    </head>

    <body>
        <canvas id="main" width="800" height="600" style="background-color: black; border: 1px solid black;"></canvas>
        <script type="text/javascript">
            var ctx = document.getElementById("main");
            var c = ctx.getContext("2d");

            var img = new Image();
            img.src = "C:/Users/User/Pictures/four-eyes.jpg";
            //image dl link: https://dl.dropboxusercontent.com/u/33201763/four-eyes.jpg

            img.onload = function() {
                c.drawImage(img, 10, 10);
            }
        </script>
    </body>
</html>