Read /Process image through javascript by passing its URL - Similar to file_get_contents in PHP?

后端未结

关注

 1  1672

夕颜

UPDATE:

For testing purposes, I used

相关标签:

1条回答

你的背包

2020-12-21 16:53

There is some problems that I don't know you have or not in here because it's not your full code and I don't know what exactly you are trying to do. Here a working example of something very close of what you are doing. It loads a image on a canvas (you could use your qrcode stuff instead)

<!DOCTYPE html>
<html>
  <head>
    <script type="text/javascript">
      var gCanvas;
      var gCtx;
      function load(){
        console.log("loaded");
        gCanvas = document.getElementById("mcanvas");
        if (gCanvas.getContext){
          gCtx = gCanvas.getContext("2d");
        } else console.log("no Canvas?");
      }
      function doProcess(f){
          var o=[];
          var reader = new FileReader();
          reader.onload = (function(theFile) {
              var img = new Image();
              img.src = theFile;
              img.onload = function(){
                gCtx.clearRect(0, 0, gCanvas.width, gCanvas.height);
                gCtx.drawImage(img,0,0);
              }
              return;
          })(f);

          console.log(reader);
          reader.readAsDataURL(f);
      }
    </script>
  </head>

  <body onload="load()">
    <input type="text" onClick="doProcess('https://www.google.com.br/logos/2012/clara_schuman-2012-hp.jpg')" />
    <canvas id="mcanvas" height="500" width="500"></canvas>
  </body>
</html>

dont't forget the load function, it grants your javascript to run after body loads.

0 讨论(0)