一个简单的TensorFlow.js的猫狗识别样例

一个简单的TensorFlow.js的猫狗识别样例

后台代码忽略，只要能够成功传送两个模型文件即可。
代码的猫狗识别模型是一个简单的CNN模型（有残差模块）。

	<%@ page contentType="text/html;charset=UTF-8" language="java" %>
	<html>
	  <title>TensorflowJS</title>
	  <head>
	  <script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs@0.13.3/dist/tf.min.js"> </script>
	  </head>
	  <body>
	  <img id="image" src=""/>
	  <input type="file" onchange="selectImage(this);"/>
	  <input name="button1" type="button" onclick="classifyCatOrDog(this.image)" value="猜猜你放的是猫还是狗">
	  <script>
	      var image = new Image();
	      var inputImage ; // 经过预处理的image
	      image.onload = function(){
	          console.log("image is loaded");
	          inputImage = preprocess(image); // 在读完图片的第一时间将图片转成tensor形式的数据
	      };
	      image.onerror = function(){
	          alert("error!");
	      };
	      var animalList = ["猫","狗"];
	      var catDogModelDir = "http://*******************" ;
	      var catDogModel;
	      tf.loadFrozenModel(
	          catDogModelDir + "tensorflowjs_model.pb",
	          catDogModelDir + "weights_manifest.json").
	          then((model) => {
	              catDogModel = model;
	          });
	
	      // 数据处理 将图片转化成tensorflow需要的形式
	      function preprocess(image){
	          return tf.tidy(() => {
	              let tensor = tf.fromPixels(image);
	              const resized = tf.image.resizeBilinear(tensor, [64, 64]).toFloat();
	                  const batched = resized.expandDims(0);
	                  return batched;
	          })
	      }
	
	      function selectImage(file){ // 获取图片 参考自https://www.cnblogs.com/jcz1206/p/6532667.html
	          if(!file.files || !file.files[0]){
	              return;
	          }
	          var reader = new FileReader();
	          reader.onload = function (evt){
	              document.getElementById('image').src = evt.target.result;
	              image.src = document.getElementById('image').src;
	          };
	          reader.readAsDataURL(file.files[0]); // 展示图片
	      }
	      
	      function classifyCatOrDog(){
	          var beginTime = new Date();
	          var result = catDogModel.predict([tf.ones([]), inputImage]).dataSync();
	          var endTime = new Date();
	          var maxIndex = result.indexOf(Math.max.apply(null,result));
	          alert("TensorFlow.js猜这是一只" + animalList[maxIndex] + "图片\n耗时为" + (endTime - beginTime) + "ms");
	      }
	  </script>
	  </body>
	</html>