吳佳鑫
社會觀察者、社會企業家、教育創新者、遊戲人、媒體人、廚師，小人物與您分享眼見耳聞的生活大小事。
Anything will understand slightly a spot, life more color spots
檢舉內容圖形辨識~尋寶遊戲
檢舉內容
構想上，前端簡單的使用Google Map 做定位，並寫入SQL做第一段比對經緯度。接著前端有一個php上傳圖片的功能(沒有 https 所以就不做網頁開相機的方式)。經過上傳至伺服器後，python 圖形辨識，比對上傳的圖片，若比對成功或相似度差異不大，則判定正確，寫入SQL，端頁面顯示奪寶成功。Firebase部分則為即時聊天(有空在搞...)
前端頁面 index.php
<!DOCTYPE html><html><head><title>尋寶遊戲</title><meta name="viewport" content="initial-scale=1.0, user-scalable=no"><meta charset="utf-8"><style>/* Always set the map height explicitly to define the size of the div* element that contains the map. */#map {height: 100%;}/* Optional: Makes the sample page fill the window. */html, body {height: 100%;margin: 0;padding: 0;}#bg{position:absolute;left:0px;top:0px;z-index:9;margin:0px auto;width:200px;height:140px;display: flex;/* 水平置中 */justify-content: center;/* 垂直置中 */align-items: center;background:rgba(0,255,204,0.2);border-style:dotted;border-color:#FF0000;padding:1px;}#cc{z-index:99;}</style></head><body><?if (isset($_GET["a"]) && $_GET["a"]=="ok"){?><div id="bg"><div id="cc"><b>找到了~</b></div></div><?}if (isset($_GET["a"]) && $_GET["a"]=="ng"){?><div id="bg"><div id="cc"><b>沒找到唷~</b></div></div><?}?><div id="map"></div><script>// Note: This example requires that you consent to location sharing when// prompted by your browser. If you see the error "The Geolocation service// failed.", it means you probably did not give permission for the browser to// locate you.var map, infoWindow;var la,lo;function initMap() {map = new google.maps.Map(document.getElementById('map'), {center: {lat: -34.397, lng: 150.644},zoom: 18});/*var contentString = 'lat: '+la+' , '+'lon: '+lo;//infoWindow = new google.maps.InfoWindow;infowindow = new google.maps.InfoWindow({content: contentString});*/// Try HTML5 geolocation.if (navigator.geolocation) {navigator.geolocation.getCurrentPosition(function(position) {var pos = {lat: position.coords.latitude,lng: position.coords.longitude};la=position.coords.latitude;lo=position.coords.longitude;contentString = '<div>尋寶Game</div>'+'<form method="post" enctype="multipart/form-data" action="upload.php">'+'<input name="file" type="file"><input name="upload" type="submit" value="上傳">'+'</form>'+'lat: '+la+' , '+'lon: '+lo;infowindow = new google.maps.InfoWindow({content: contentString});var marker = new google.maps.Marker({position: pos,//icon:'marker.png',map: map});marker.addListener('click', function() {infowindow.open(map, marker);});map.setZoom(17);map.setCenter(pos);//infoWindow.setPosition(pos);//infoWindow.setContent('Location found.');//infoWindow.open(map);//map.setCenter(pos);}, function() {handleLocationError(true, infoWindow, map.getCenter());});} else {// Browser doesn't support GeolocationhandleLocationError(false, infoWindow, map.getCenter());}}function handleLocationError(browserHasGeolocation, infoWindow, pos) {infoWindow.setPosition(pos);infoWindow.setContent(browserHasGeolocation ?'Error: The Geolocation service failed.' :'Error: Your browser doesn\'t support geolocation.');infoWindow.open(map);}</script><scriptsrc="https://maps.googleapis.com/maps/api/js?key=AIzaSyB41DRUbKWJHPxaFjMAwdrzWzbVKartNGg&callback=initMap&v=weekly"defer></script></body></html>
圖檔上傳 upload.php
<?phpprint_r($_POST);print_r($_FILES);//或使用var_dump//試著理解以下內容與差異echo $_FILES["file"]["name"]."<br/>"; //原檔案名稱echo $_FILES["file"]["tmp_name"]."<br/>";//暫存路徑echo $_FILES["file"]["size"]."<br/>";//檔案byte, max 2mb，除非要改php上傳限制echo $_FILES["file"]["type"]."<br/>";//檔案類型//將檔案儲存到伺服器位置的方式為//copy($_FILES["file"]["tmp_name"],"./".$_FILES["file"]["name"]); // copy(from,to)//上傳檔案時也可以改名//$newname=date("YmdHis")."_".$_FILES["file"]["name"];//copy($_FILES["file"]["tmp_name"],"./".$newname); // copy(from,to)copy($_FILES["file"]["tmp_name"],"1.jpg"); // copy(from,to)//unlink("upload/".$newname); //刪除網路空間內的檔案sleep(2);$txt_file = fopen('output.txt','r');$line = fgets($txt_file);fclose($txt_file);echo $line;header("Location: index.php?a=".$line);?><!--<form method="post" enctype="multipart/form-data"><input type="file" name="mypic"><input type="submit" value="上傳"></form>-->
Python 檔案是否存在
import os# 要檢查的檔案路徑filepath = "0.jpg"# 檢查檔案是否存在if os.path.isfile(filepath):print("檔案存在。")else:print("檔案不存在。")
安裝 Pillow
pip install Pillow
Python 圖形辨識 相似度
# -*- coding:utf-8 -*-from functools import reducefrom PIL import Image# 計算圖片的局部哈希值--pHashdef phash(img):""":param img: 圖片:return: 返回圖片的局部hash值"""img = img.resize((8, 8), Image.ANTIALIAS).convert('L')avg = reduce(lambda x, y: x + y, img.getdata()) / 64.hash_value=reduce(lambda x, y: x | (y[1] << y[0]), enumerate(map(lambda i: 0 if i < avg else 1, img.getdata())), 0)print(hash_value)return hash_value# 計算漢明距離:def hamming_distance(a, b):""":param a: 圖片1的hash值:param b: 圖片2的hash值:return: 返回兩個圖片hash值的漢明距離"""hm_distance=bin(a ^ b).count('1')print(hm_distance)return hm_distance# 計算兩個圖片是否相似:def is_imgs_similar(img1,img2):""":param img1: 圖片1:param img2: 圖片2:return: True 圖片相似 False 圖片不相似"""return True if hamming_distance(phash(img1),phash(img2)) <= 5 else Falseif __name__ == '__main__':# 讀取圖片sensitive_pic = Image.open("0.jpg")target_pic = Image.open("2.jpg")# 比較圖片相似度result=is_imgs_similar(target_pic, sensitive_pic)print(result)
Python 偵測檔案 + 比對相似度
# -*- coding:utf-8 -*-from functools import reducefrom PIL import Imageimport osimport pymysql# 計算圖片的局部哈希值--pHashdef phash(img):""":param img: 圖片:return: 返回圖片的局部hash值"""img = img.resize((8, 8), Image.ANTIALIAS).convert('L')avg = reduce(lambda x, y: x + y, img.getdata()) / 64.hash_value=reduce(lambda x, y: x | (y[1] << y[0]), enumerate(map(lambda i: 0 if i < avg else 1, img.getdata())), 0)#print(hash_value)return hash_value# 計算漢明距離:def hamming_distance(a, b):""":param a: 圖片1的hash值:param b: 圖片2的hash值:return: 返回兩個圖片hash值的漢明距離"""hm_distance=bin(a ^ b).count('1')#print(hm_distance)return hm_distance# 計算兩個圖片是否相似:def is_imgs_similar(img1,img2):""":param img1: 圖片1:param img2: 圖片2:return: True 圖片相似 False 圖片不相似"""return True if hamming_distance(phash(img1),phash(img2)) <= 5 else False# 資料庫設定db_settings = {"host": "127.0.0.1","port": 3306,"user": "root","password": "資料庫管理員密碼","db": "test2022","charset": "utf8"}if __name__ == '__main__':while True:# 要檢查的檔案路徑filepath = "1.jpg"# 檢查檔案是否存在if os.path.isfile(filepath):#print("檔案存在。")# 讀取圖片#fp = open(filepath,'rb')sensitive_pic = Image.open("0.jpg")target_pic = Image.open(filepath)# 比較圖片相似度result=is_imgs_similar(target_pic, sensitive_pic)a=resultprint(a)path = 'output.txt'if a==True:#print("ok")f = open(path, 'w')f.write('ok')f.close()else:#print("ng")f = open(path, 'w')f.write('ng')f.close()else:print("檔案不存在。")
原本打算用SQL處理，不過有點懶...所以就用文字檔的方式處理...以後有空在搞囉~
贊助支持創作者，成為他繼續創作的動力吧！
留言0
查看全部
吳佳鑫 的其他內容
你可能也想看
領取見面禮
只要設定追蹤作者，即可享有 48小時
Premium 閱讀權限
Premium 閱讀權限