PC 측 QR 코드 스캔 및 업로드는 최근 개발 분야에서 뜨거운 주제였습니다. 로컬 파일을 서버에 쉽게 업로드할 수 있으며, QR 코드 스캔을 사용하여 기존 업로드 방법을 대체하므로 더욱 편리하고 효율적입니다. . 이 기사에서는 PHP를 사용하여 PC 스캔 및 업로드를 구현하는 방법을 소개합니다.
PC 스캔 및 업로드를 위해서는 먼저 몇 가지 개념을 이해해야 합니다. 첫째는 QR코드 생성 및 스캔의 원리이고, 둘째는 파일업로드를 구현하는 PHP의 기술이다.
QR코드 생성 및 스캔의 원리
QR코드는 많은 양의 정보를 저장할 수 있는 그래픽 코드입니다. 링크, 텍스트, 지도, 연락처 등 다양한 상황에서 활용 가능합니다. QR 코드를 생성하는 방법에는 여러 가지가 있으며, 가장 일반적으로 사용되는 방법은 JavaScript 프레임워크인 QRCode.js를 사용하는 것입니다. 이 프레임워크를 통해 텍스트, URL 및 기타 정보에서 해당 QR 코드를 생성할 수 있습니다.
QR 코드를 스캔할 때 휴대폰 스캔 소프트웨어를 사용하여 휴대폰 카메라를 사용하여 QR 코드를 스캔하고 스캔을 통해 QR 코드가 나타내는 정보를 얻을 수 있습니다. PC 측에서는 Zbar와 같은 QR 코드 스캔 소프트웨어를 사용하여 QR 코드를 스캔할 수도 있습니다.
PHP는 파일 업로드 기술을 구현합니다
PHP는 매우 널리 사용되는 서버 측 스크립팅 언어이며 웹 개발 분야에서 중요한 역할을 합니다. 파일 업로드를 위해 PHP는 매우 편리한 파일 업로드 클래스-업로드 클래스를 제공합니다.
업로드 클래스를 사용하여 파일 업로드를 구현하는 경우 클래스를 인스턴스화하고 해당 메서드를 사용하여 파일을 업로드하기만 하면 됩니다. 그 중 중요한 메소드로는 upload(), getFileName(), getErrorMsg() 등이 있습니다.
PHP는 PC 코드 스캔 및 업로드를 구현합니다
위의 기본 지식을 바탕으로 PC 코드 스캔 및 업로드 기능 구현을 시작할 수 있습니다. 여기서는 백그라운드 파일 처리와 프런트엔드 파일 생성이라는 두 부분으로 나누어 보겠습니다.
백그라운드 파일 처리
1. 파일 업로드 인터페이스
먼저 프론트 데스크에서 전송되는 파일 스트림과 업로드해야 하는 파일 정보를 처리하는 데 사용되는 파일 업로드용 인터페이스를 구현해야 합니다. 다양한 파일 유형과 파일 크기의 경우 업로드된 이미지의 크기와 유형을 제한하는 등 특별한 처리를 수행해야 합니다.
코드 예:
<code class="php"><?php
header('Content-type: application/json');
$FILE_BASE = './files/';
$MAX_SIZE = 10 * 1024 * 1024;//10M
$ALLOW_FILE_SUFFIX = ['png', 'jpg', 'jpeg', 'bmp', 'gif'];//允许上传的文件类型
$max_size_POST = ini_get('post_max_size');
$max_size_UPLOAD = ini_get('upload_max_filesize');
$max_size = min($MAX_SIZE, getBytes($max_size_POST), getBytes($max_size_UPLOAD));
$filename = $_POST['filename'];
if (empty($filename)) {
echo json_encode(['status' => 'error', 'msg' => 'filename is empty']);
return;
}
if(empty($_FILES) || empty($_FILES['file'])){
echo json_encode(['status' => 'error', 'msg' => 'file is empty']);
return;
}
$file_size = $_FILES['file']['size'];
if($file_size > $max_size){
echo json_encode(['status' => 'error', 'msg' => 'file size is too big']);
return;
}
$file_type = strtolower(pathinfo($_FILES["file"]["name"], PATHINFO_EXTENSION));
if(!in_array($file_type, $ALLOW_FILE_SUFFIX)){
echo json_encode(['status' => 'error', 'msg' => 'file type is not allowed']);
return;
}
if(!is_dir($FILE_BASE)){
mkdir($FILE_BASE, 0777, true);
}
$file_path = $FILE_BASE.$filename;
if(move_uploaded_file($_FILES["file"]["tmp_name"], $file_path)){
echo json_encode(['status' => 'success', 'msg' => 'upload success']);
}else{
echo json_encode(['status' => 'error', 'msg' => 'upload fail']);
}
function getBytes($val)
{
$val = trim($val);
$last = strtolower($val[strlen($val) - 1]);
$val = preg_replace('/[^0-9]/', '', $val);
switch ($last) {
case 'g':
$val *= 1024 * 1024 * 1024;
break;
case 'm':
$val *= 1024 * 1024;
break;
case 'k':
$val *= 1024;
break;
}
return $val;
}
?></code>2. QR 코드 생성
QR 코드 생성은 QRCode.js 프레임워크를 사용하여 수행할 수 있습니다. 업로드할 파일명과 관련 정보를 QR코드 정보로 변환한 후 해당 QR코드를 생성해야 합니다.
코드 예:
<code class="php"><?php $filename = $_POST['filename']; $path = 'http://localhost/'; //服务器地址 $text = urlencode(json_encode(['filename' => $filename, 'path' => $path])); $url = "http://qr.liantu.com/api.php?text=" . $text; echo $url; //返回二维码地址 ?></code>
프런트엔드 파일 생성
프런트엔드에서는 QR 코드를 생성하여 오른쪽 미리보기 상자에 표시해야 합니다. 또한 파일 업로드를 위한 작업 버튼과 해당 프롬프트도 추가해야 합니다.
코드 샘플:
<code class="html"><!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>PC扫码上传</title>
<style type="text/css">
.upload {
display: inline-block;
background: #1B96F3;
color: #fff;
padding: 8px 12px;
border-radius: 4px;
cursor: pointer;
outline: none;
}
.upload:hover {
background-color: #2A87CB;
}
.img-preview {
width: 200px;
height: 200px;
overflow: hidden;
display: flex;
justify-content: center;
align-items: center;
}
.img-preview img {
max-width: 100%;
max-height: 100%;
object-fit: contain;
}
</style>
</head>
<body>
<div class="wrapper">
<div class="qrcode-container">
<div class="qrcode"></div>
</div>
<div class="upload-container">
<input type="file" id="file" style="display:none" onchange="uploadFile(this)"/>
<button class="upload" onclick="document.getElementById('file').click()">上传文件</button>
<div class="alert"></div>
</div>
<div class="img-preview-container">
<h4>预览</h4>
<div class="img-preview"></div>
</div>
</div>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/qrcodejs/1.0.0/qrcode.min.js"></script>
<script type="text/javascript">
function createQrcode(url) {
var qrcode = new QRCode(document.querySelector('.qrcode'), {
text: url,
width: 200,
height: 200,
colorDark: "#000000",
colorLight: "#ffffff",
correctLevel: QRCode.CorrectLevel.H
});
}
function showPreview(file) {
var fr = new FileReader();
fr.onload = function () {
$('<img>').attr('src', fr.result).appendTo('.img-preview');
}
fr.readAsDataURL(file);
}
function uploadFile(obj) {
var file = obj.files[0];
var fd = new FormData();
fd.append('file', file);
fd.append('filename', file.name);
$.ajax({
url: '/upload.php',
type: 'POST',
data: fd,
processData: false,
contentType: false,
success: function (data) {
if (data.status == 'success') {
createQrcode(data.msg);
showPreview(file);
$('.alert').text('上传成功');
} else {
$('.alert').text('上传失败');
}
},
error: function () {
$('.alert').text('上传失败');
}
});
}
</script>
</body>
</html></code>결론적으로 PC 스캔코드 업로드 개발을 성공적으로 완료했습니다. 이 과정에서 우리는 QR 코드 생성 및 스캔의 원리와 PHP를 사용한 파일 업로드 기술을 배웠고, 이 두 가지를 결합하여 PC 코드 스캔 및 업로드 기능 구현을 완료했습니다. 개발자들에게는 더욱 편리하고 효율적인 업로드 방식이 개발에 있어서 뜨거운 화두이자 수요가 될 것입니다.
위 내용은 PC 스캔 코드 업로드 PHP 구현의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!
![[웹 프런트엔드] Node.js 빠른 시작](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
