php圖片上傳及javascript插件的使用-php教程-PHP中文網

首頁

後端開發

php教程

php圖片上傳及javascript插件的使用

墨辰丷

Jun 08, 2018 pm 04:26 PM

javascriptphp線上拍照

本篇文章主要介绍php图片上传及javascript插件的使用，感兴趣的朋友参考下，希望对大家有所帮助。

本文实例讲述了PHP+Javascript实现在线拍照功能，具体如下：

我们在一些WEB应用中可能会遇到这样的情况，用户需要自己现场拍照并上传到会员系统。比如驾校采集指纹拍照流程、考试现场采集照片等。我们今天要讲的是如何使用javascript和PHP实现一个简单的在线拍照并上传的功能。

实现这个功能的前提是你的电脑设备上需要安装有摄像头设备，以及你的浏览器需要支持flash

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Javascript+PHP实现在线拍照功能</title>
</head>
<body>
<p id="cam">
<!--调用摄像组件并显示图像-->
<input type=button value="点击这里拍照" class="btn" onclick="take_snapshot()">
http://siteweb.com/sitemaps.xml
</p>
<p id="results">
<!--显示上传结果-->
</p>
</body>
</html>

在body中加入一个用于调用摄像组件的容器id#cam和一个显示上传信息的容器id#results。

Javascript

接下来调用摄像组件，我们先载入webcam.js，用于拍照和上传的js库。

代码如下:

然后在容器id#cam中，加入以下代码：

<script language="JavaScript">
webcam.set_api_url( &#39;action.php&#39; );
webcam.set_quality( 90 ); // 图像质量(1 - 100)
webcam.set_shutter_sound( true ); // 拍照时播放声音
document.write( webcam.get_html(320, 240, 160,120) );
</script>

我们调用了webcam，其中webcam.set_api_url用来设置图像上传交互的php路径，set_quality可设置图像质量，set_shutter_sound设置声音，get_html输出摄像组件，参数即宽度、高度、上传后宽度、上传后高度。

当点击按钮拍照时，需要执行以下代码：

<script language="JavaScript">
webcam.set_hook( &#39;onComplete&#39;, &#39;my_completion_handler&#39; );
function take_snapshot() {
document.getElementById(&#39;results&#39;).innerHTML = &#39;<h4 id="Uploading">Uploading...</h4>&#39;;
webcam.snap();
}
function my_completion_handler(msg) {
if (msg.match(/(http\:\/\/\S+)/)) {
var image_url = RegExp.$1;
document.getElementById(&#39;results&#39;).innerHTML =
&#39;<h4 id="Upload-nbsp-Successful">Upload Successful!</h4>&#39; +
&#39;<img  src="/static/imghwm/default1.png"  data-src="&#39; + image_url + &#39;"  class="lazy"   alt="php圖片上傳及javascript插件的使用" >&#39;;
webcam.reset();
}
else alert("PHP Error: " + msg);
}
</script>

当执行拍照动作时，代码与后台php交互，如果上传图片完成后，则返回相应的信息。

PHP

action.php所做的就是将本地拍照的图像上传到服务器，并将图片路径返回给前端。注意存放图片的路径要给写权限。

$filename = date(&#39;YmdHis&#39;) . &#39;.jpg&#39;;
$result = file_put_contents( &#39;pics/&#39;.$filename, file_get_contents(&#39;php://input&#39;) );
if (!$result) {
print "ERROR: Failed to write data to $filename, check permissions\n";
exit();
}
$url = &#39;http://&#39; . $_SERVER[&#39;HTTP_HOST&#39;] . dirname($_SERVER[&#39;REQUEST_URI&#39;]) . &#39;/pics/&#39; . $filename;
print "$url\n";

总结：以上就是本篇文的全部内容，希望能对大家的学习有所帮助。

相关推荐：

PHP比较运算符的种类

关于PHP类的封装与继承

php实现的猜单词小游戏

以上是php圖片上傳及javascript插件的使用的詳細內容。更多資訊請關注PHP中文網其他相關文章！

陳述

本文內容由網友自願投稿，版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容，請聯絡admin@php.cn

PHP類型提示如何起作用，包括標量類型，返回類型，聯合類型和無效類型？Apr 17, 2025 am 12:25 AM

PHP類型提示提升代碼質量和可讀性。 1)標量類型提示：自PHP7.0起，允許在函數參數中指定基本數據類型，如int、float等。 2)返回類型提示：確保函數返回值類型的一致性。 3)聯合類型提示：自PHP8.0起，允許在函數參數或返回值中指定多個類型。 4)可空類型提示：允許包含null值，處理可能返回空值的函數。

PHP如何處理對象克隆（克隆關鍵字）和__clone魔法方法？Apr 17, 2025 am 12:24 AM

PHP中使用clone關鍵字創建對象副本，並通過\_\_clone魔法方法定制克隆行為。 1.使用clone關鍵字進行淺拷貝，克隆對象的屬性但不克隆對象屬性內的對象。 2.通過\_\_clone方法可以深拷貝嵌套對象，避免淺拷貝問題。 3.注意避免克隆中的循環引用和性能問題，優化克隆操作以提高效率。

PHP與Python：用例和應用程序Apr 17, 2025 am 12:23 AM

PHP適用於Web開發和內容管理系統，Python適合數據科學、機器學習和自動化腳本。 1.PHP在構建快速、可擴展的網站和應用程序方面表現出色，常用於WordPress等CMS。 2.Python在數據科學和機器學習領域表現卓越，擁有豐富的庫如NumPy和TensorFlow。

描述不同的HTTP緩存標頭（例如，Cache-Control，ETAG，最後修飾）。Apr 17, 2025 am 12:22 AM

HTTP緩存頭的關鍵玩家包括Cache-Control、ETag和Last-Modified。 1.Cache-Control用於控制緩存策略，示例：Cache-Control:max-age=3600,public。 2.ETag通過唯一標識符驗證資源變化，示例：ETag:"686897696a7c876b7e"。 3.Last-Modified指示資源最後修改時間，示例：Last-Modified:Wed,21Oct201507:28:00GMT。

說明PHP中的安全密碼散列（例如，password_hash，password_verify）。為什麼不使用MD5或SHA1？Apr 17, 2025 am 12:06 AM

在PHP中，應使用password_hash和password_verify函數實現安全的密碼哈希處理，不應使用MD5或SHA1。1)password_hash生成包含鹽值的哈希，增強安全性。 2)password_verify驗證密碼，通過比較哈希值確保安全。 3)MD5和SHA1易受攻擊且缺乏鹽值，不適合現代密碼安全。

PHP：服務器端腳本語言的簡介Apr 16, 2025 am 12:18 AM

PHP是一種服務器端腳本語言，用於動態網頁開發和服務器端應用程序。 1.PHP是一種解釋型語言，無需編譯，適合快速開發。 2.PHP代碼嵌入HTML中，易於網頁開發。 3.PHP處理服務器端邏輯，生成HTML輸出，支持用戶交互和數據處理。 4.PHP可與數據庫交互，處理表單提交，執行服務器端任務。

PHP和網絡：探索其長期影響Apr 16, 2025 am 12:17 AM

PHP在過去幾十年中塑造了網絡，並將繼續在Web開發中扮演重要角色。 1)PHP起源於1994年，因其易用性和與MySQL的無縫集成成為開發者首選。 2)其核心功能包括生成動態內容和與數據庫的集成，使得網站能夠實時更新和個性化展示。 3)PHP的廣泛應用和生態系統推動了其長期影響，但也面臨版本更新和安全性挑戰。 4)近年來的性能改進，如PHP7的發布，使其能與現代語言競爭。 5)未來，PHP需應對容器化、微服務等新挑戰，但其靈活性和活躍社區使其具備適應能力。