当前位置：极客笔记 > PHP > PHP 精选教程 > 使用PHP和MySQL创建图像库CRUD

使用PHP和MySQL创建图像库CRUD

使用PHP和MySQL创建图像库CRUD

在本节中，我们将学习图像库的CURD。我们将使用PHP和MySQL来完成这个任务。有时用户、学生、员工、管理员等需要图像库、删除模块和插入更新的选项。因此，我们需要为他们创建这些功能。为了实现轻松上传照片并通过验证删除照片，我们将使用相册。在我们的应用程序中，我们将使用Bootstrap创建一个具有吸引力的图像库布局。

在这里，我们将使用基础代码来制作具有吸引力布局的相册。通过这种方式，我们可以很容易地将其与我们的应用程序一起构建起来。在我们的应用程序中，我们将使用会话来执行适当的验证，并显示成功和错误消息。如果成功插入图像，我们将得到适当的成功消息。我们的示例将创建一个名为”image_gallery”的新表，其中包含主标题和图像列。为了显示表单、验证、错误消息等，我们还将创建文件。制作相册的逐步过程如下所述：

步骤1：

在此步骤中，我们将 创建image_gallery表 。在这里，我们将使用我们的数据库来创建此表。为了创建这个表，我们将使用一些SQL查询，描述如下：

项目表：

CREATE TABLE `image_gallery` (
  `id` int(10) UNSIGNED NOT NULL,
  `title` varchar(255) COLLATE utf8mb4_unicode_ci NOT NULL,
  `image` varchar(255) COLLATE utf8mb4_unicode_ci NOT NULL,
  `created_at` timestamp NULL DEFAULT NULL,
  `updated_at` timestamp NULL DEFAULT NULL
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_unicode_ci;

步骤2：

在这一步中，我们要 创建DB配置文件 。为此，我们需要在数据库中设置一些细节，例如数据库名称、phpmyadmin数据库的用户名和密码。在设置完成后，我们将使用我们的根目录创建一个名为“db_config.php”的新文件。然后，我们将像下面这样将以下代码添加到文件中：

db_config.php

<?php

define (DB_USER, "root");
define (DB_PASSWORD, "root");
define (DB_DATABASE, "sole");
define (DB_HOST, "localhost");

$mysqli = new mysqli(DB_HOST, DB_USER, DB_PASSWORD, DB_DATABASE);
?>

步骤3：

在这一步中，我们将创建index.php文件。该文件用于显示带有删除按钮的显示图像，并显示图像的标题。现在我们将使用我们的根目录，并创建一个名为”index.php”的文件。之后，我们将像下面这样在文件中添加以下代码：

index.php

<?php
  session_start();
?>

<!DOCTYPE html>
<html>
<head>
    <title>Image Gallery Example</title>
    <!-- Latest CSS which is minified and compiled -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
    <!-- References: https://github.com/fancyapps/fancyBox -->
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/fancybox/2.1.5/jquery.fancybox.min.css" media="screen">
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/fancybox/2.1.5/jquery.fancybox.min.js"></script>

    <style type="text/css">
    .gallery
    {
        display: inline-block;
        margin-top: 20px;
    }
    .close-icon{
    border-radius: 50%;
        position: absolute;
        right: 5px;
        top: -10px;
        padding: 5px 8px;
    }
        .form-image-upload{
            background: #e8e8e8 none repeat scroll 0 0;
            padding: 15px;
        }
    </style>
</head>
<body>

<div class="container">

    <h3> Example of Image Gallery CRUD using PHP MySQL </h3>
    <form action="/imageUpload.php" class="form-image-upload" method="POST" enctype="multipart/form-data">

        <?php if(!empty(_SESSION['error'])){ ?>
            <div class="alert alert-danger">
                <strong>Whoops!</strong> Our input faces some problems. <br><br>
                <ul>
                    <li><?php echo_SESSION['error']; ?></li>
                </ul>
            </div>
        <?php unset(_SESSION['error']); } ?>

        <?php if(!empty(_SESSION['success'])){ ?>
        <div class="alert alert-success alert-block">
            <button type="button" class="close" data-dismiss="alert">?</button>
                <strong><?php echo _SESSION['success']; ?></strong>
        </div>
        <?php unset(_SESSION['success']); } ?>

        <div class="row">
            <div class="col-md-5">
                <strong>Title:</strong>
                <input type="text" name="title" class="form-control" placeholder="Title">
            </div>
            <div class="col-md-5">
                <strong>Image:</strong>
                <input type="file" name="image" class="form-control">
            </div>
            <div class="col-md-2">
                <br/>
                <button type="submit" class="btn btn-success">Upload</button>
            </div>
        </div>

    </form> 

    <div class="row">
    <div class='list-group gallery'>

            <?php
            require('db_config.php');

            sql = "SELECT * FROM image_gallery";images = mysqli->query(sql);

            while(image =images->fetch_assoc()){

            ?>
                <div class='col-sm-4 col-xs-6 col-md-3 col-lg-3'>
                    <a class="thumbnail fancybox" rel="ligthbox" href="/uploads/<?php echo image['image'] ?>">
                        <img class="img-responsive" alt="" src="/uploads/<?php echoimage['image'] ?>" />
                        <div class='text-center'>
                            <small class='text-muted'><?php echo image['title'] ?></small>
                        </div> <!-- text-center / end -->
                    </a>
                    <form action="/imageDelete.php" method="POST">
                    <input type="hidden" name="id" value="<?php echoimage['id'] ?>">
                    <button type="submit" class="close-icon btn btn-danger"><i class="glyphicon glyphicon-remove"></i></button>
                    </form>
                </div> <!-- col-6 / end -->
            <?php } ?>

        </div> <!-- list-group / end -->
    </div> <!-- row / end -->
</div> <!-- container / end -->

</body>

<script type="text/javascript">
    (document).ready(function(){(".fancybox").fancybox({
            openEffect: "none",
            closeEffect: "none"
        });
    });
</script>
</html>

步骤4：

在这一步骤中，我们将 创建一个imageUpload.php文件 . 这个文件用于验证使用会话、插入数据库代码和图片上传代码。所以我们将使用根目录并创建一个名为”imageUpload.php”的新文件。然后，我们将像以下这样将以下代码添加到文件中：

imageUpload.php

<?php

session_start();
require('db_config.php');

if(isset(_POST) && !empty(_FILES['image']['name']) && !empty(_POST['title'])){name = _FILES['image']['name'];
    list(txt, ext) = explode(".",name);
    image_name = time().".".ext;
    tmp =_FILES['image']['tmp_name'];

    if(move_uploaded_file(tmp, 'uploads/'.image_name)){

        sql = "INSERT INTO image_gallery (title, image) VALUES ('"._POST['title']."', '".image_name."')";mysqli->query(sql);_SESSION['success'] = 'Uploading of image is successfully.';
        header("Location: http://localhost:8000");
    }else{
        _SESSION['error'] = 'Uploading of image is failed';
        header("Location: http://localhost:8000");
    }
}else{_SESSION['error'] = 'Please Select Image or Write title';
    header("Location: http://localhost:8000");
}

?>

步骤5：

在这一步中，我们将 创建一个 imageDelete.php 文件 。这个文件用于从数据库中删除记录。因此，我们将使用我们的根目录，并创建一个名为 “imageDelete.php” 的新文件。在之后，我们将像下面这样，将以下代码添加到文件中：

imageDelete.php

<?php

session_start();
require('db_config.php');

if(isset(_POST) && !empty(_POST['id'])){

        sql = "DELETE FROM image_gallery WHERE id = "._POST['id'];
        mysqli->query(sql);

        _SESSION['success'] = 'Deletion of image is successfully.';
        header("Location: http://localhost:8000");
}else{_SESSION['error'] = 'Please Select Image or Write title';
    header("Location: http://localhost:8000");
}

?>

现在我们上面的图片库示例已经准备好运行了。为了运行这个示例，我们将使用我们的根目录并创建一个名为”upload”的新文件夹。在继续之前，我们希望完全拥有权限，因为upload文件夹将保存所有的图片。现在我们将使用我们的根目录并运行以下命令：

php -S localhost:8000

现在我们可以使用浏览器打开下面的URL：

http://localhost:8000/

打开后，我们可以看到以下输出:

使用PHP和MySQL创建图像库CRUD

Camera课程

Camera API2 教程

API2 教程
Camera 性能教程

Perf 教程
Camera Native Framework 教程

Native FW 教程
Camera QCOM ISP 教程

ISP 教程
Camera QCOM Sensor 教程

Sensor 教程

Python教程

Python 教程

Python 教程
NumPy 教程

NumPy 教程
Django 教程

Django 教程

Java教程

Java 教程

Java 教程

Web教程

JavaScript 教程

JavaScript 教程
jQuery 教程

jQuery 教程
CSS 教程

CSS 教程
PHP 教程

PHP 教程
Laravel 教程

Laravel 教程
TypeScript 教程

TypeScript 教程
WordPress 教程

WordPress 教程

数据库教程

SQL 教程

SQL 教程
SQLite 教程

SQLite 教程
MySQL 教程

MySQL 教程
PL/SQL 教程

PL/SQL 教程
MongoDB 教程

MongoDB 教程

图形图像教程

OpenCV 教程

OpenCV 教程

办公软件教程

Excel 教程

Excel 教程

Linux教程

Linux命令全集

Linux命令全集
Linux内核API

Linux内核API
LVGL 教程

LVGL 教程

计算机教程

操作系统 教程

操作系统 教程
计算机网络 教程

计算机网络 教程
C语言 教程

C语言 教程
C++ 教程

C++ 教程
Swift 教程

Swift 教程

大数据教程

Hadoop 教程

Hadoop 教程
Spark 教程

Spark 教程
Scala 教程

Scala 教程

开发工具教程

Git 教程

Git 教程
Jenkins 教程

Jenkins 教程
ChatGPT 教程

ChatGPT 教程
IntelliJ 教程

IntelliJ 教程

PHP 精选教程