db에 저장된 음악재생하기 > 그누보드5 스킨

그누보드5 스킨

좋은 댓글과 좋아요는 제작자에게 큰힘이 됩니다.

db에 저장된 음악재생하기 정보

레이아웃 db에 저장된 음악재생하기

첨부파일

praise.zip (6.9M) 8회 다운로드 2025-01-25 17:51:06 포인트 차감10

본문

음악관련 사항을 db에 저장한 후에 웹에서 재생하는 스킨입니다.

장수, 제목, 음악, 사진, 영상, 가사첫줄, 전체가사를 db에 저장한 후에 웹에서 관련된 사항을 표시하고 제목을 클릭하면 모달창으로 사진위에 영상이 재생되면서 음악이 재생되는 방법입니다.

index.php로 처음에 접속하면 pc, mobile을 자동으로 감지하여서 pc는 select.php로, mobile은 select_mobile로 연결이 됩니다.

praise 폴더를 풀면 uploads폴더가 나오고 그안에 image, music, video폴더가 있습니다.

서버에 이미지, 음악, 비디오가 저장되는 경로입니다.

사진: uploads/images/1.png

음악: uploads/music/1.mp3

영상: uploads/video/1.mp4

그리고 db연결을 담당하는 connect_pdo.php, connect_mysqli.php 등이 있습니다.

 

database에 관련테이블(예: aa_praise)을 만들어줍니다.

create.php


<?php
// create_score.php
// 데이터베이스 연결 파일 포함
include 'connect_pdo.php';
echo"<br>";
try {
    // SQL to create table
    $sql = "CREATE TABLE aa_praise (
    id INT AUTO_INCREMENT PRIMARY KEY,
    chapter VARCHAR(50) NOT NULL,
    title VARCHAR(255) NOT NULL,
    mp3 VARCHAR(255) NOT NULL,
    photo VARCHAR(255) NOT NULL,
    video VARCHAR(255),
    first VARCHAR(255) NOT NULL,
    lyrics TEXT NOT NULL
    )";
    // 테이블 생성 쿼리 실행
    $conn->exec($sql);
    echo "테이블 aa_praise가 성공적으로 생성되었습니다.";
} catch (PDOException $e) {
    echo "테이블 생성 실패: " . $e->getMessage();
}
// 데이터베이스 연결 닫기
$conn = null;
?>

 

 

처음에 index.php로 접속하면 pc, mobile로 분기됩니다.


<?php
// index.php
// 디바이스 감지를 위한 함수
function isMobile() {
    return preg_match(
        '/(android|iphone|ipad|ipod|blackberry|iemobile|opera mini)/i',
        $_SERVER['HTTP_USER_AGENT']
    );
}
// 모바일 기기일 경우 select_mobile.php로 리디렉션
if (isMobile()) {
    header("Location: select_mobile.php");
    exit();
} else {
    // PC일 경우 select.php로 리디렉션
    header("Location: select.php");
    exit();
}
?>

 

2106540763_1737794677.1053.png

 

insert.php로 db에 데이타을 입력합니다. 이것은 image, mp3, mp4를 미리 업로드한 후에 경로를 입력합니다.


<?php
// 데이터베이스 연결 파일 포함
include('connect_pdo.php');
try {
    // SQL 쿼리 준비
    $sql = "INSERT INTO aa_praise (chapter, title, mp3, photo, video, first, lyrics) VALUES 
        ('592장', '산마다 불이 탄다 고운 단풍에', 'uploads/music/592.mp3', 'uploads/image/4.png', 'uploads/video/1.mp4', '산마다 불이 탄다 고운단풍에', 
'1. 산마다 불이 탄다 고운 단풍에 골마다 흘러간다 맑은 물줄기
황금빛 논과 밭에 풍년이 왔다 드맑은 하늘가에 노래 퍼진다
2. 씨 뿌린 논밭마다 기름 고이고 심겨진 과원마다 열매 맺으리 
비바람 고운 햇빛 주님 선물로 가꿔온 손길마다 복이 넘친다
3. 이른 봄 갈고 헤친 귀한 논밭에 구슬땀 흘려 적신 착한 농부는
풍성한 추수 때에 상 받으리라 약속한 은총으로 기름 지리라
4. 말씀에 굳게 서서 씨를 뿌리면 날마다 단비 내려 가꿔 주시리
황무지 갈고 헤쳐 쉬지 않으면 풍성한 추수 때는 감사뿐이라
후렴: 눈이 닿는 우주 공간에 손이 닿는 구석구석에 우리 주님 주신 열매 
우리 주님 주신 알곡 감사하자 찬송하자 감사하자 찬송하자 아멘
')";
    // 쿼리 실행
    $stmt = $conn->prepare($sql);
    $stmt->execute();
    echo "데이터가 성공적으로 삽입되었습니다.";
} catch (PDOException $e) {
    echo "데이터 삽입 실패: " . $e->getMessage();
}
// 연결 해제
$conn = null;
?>

 

2106540763_1737794373.3523.png

insert_praise.php는 웹에서 파일을 업로드 하는 방법으로 db에 데이타를 저장합니다.

이방법은 <form>에서 post방법을 사용하여 데이타를 전송해서 입력하는 방법인데요. 서버마다 post로 업로드할 수있는 용량이 정해저 있습니다.

제가 사용하는 호스팅은 8mb까지 업로드가능합니다.

즉 가사, 사진, 음악, 영상파일의 합계가 8mb미만이어야 업로드가 됩니다.


<?php
// insert_praise.php
// 데이터베이스 연결 파일 포함
include('connect_pdo.php');
// 파일 업로드 디렉토리 설정
$musicDir = 'uploads/music/';
$imageDir = 'uploads/image/';
$videoDir = 'uploads/video/';
// 업로드 디렉토리가 존재하지 않으면 생성
foreach ([$musicDir, $imageDir, $videoDir] as $dir) {
    if (!is_dir($dir)) {
        mkdir($dir, 0755, true);
    }
}
// 폼이 제출되었는지 확인
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
    // 입력 데이터 수집 및 유효성 검사
    $chapter = trim($_POST['chapter']);
    $title = trim($_POST['title']);
    $first = trim($_POST['first']);
    $lyrics = trim($_POST['lyrics']);
    $errors = [];
    // 필수 입력 필드 확인
    if (empty($chapter)) $errors[] = "장 정보를 입력하세요.";
    if (empty($title)) $errors[] = "제목을 입력하세요.";
    if (empty($first)) $errors[] = "가사의 첫 줄을 입력하세요.";
    if (empty($lyrics)) $errors[] = "가사를 입력하세요.";
    // 파일 업로드 처리 함수
    function handleFileUpload($file, $dir, $allowedTypes, $maxSize = 10485760) { // maxSize 기본 10MB
        if ($file['error'] === UPLOAD_ERR_NO_FILE) {
            return ['', '']; // 파일 업로드 안 함
        }
        if ($file['error'] !== UPLOAD_ERR_OK) {
            return ['', "파일 업로드 중 오류가 발생했습니다."];
        }
        // 파일 크기 검사
        if ($file['size'] > $maxSize) {
            return ['', "파일 크기가 너무 큽니다. 최대 " . ($maxSize / 1048576) . "MB까지 업로드 가능합니다."];
        }
        // MIME 타입 검사
        $finfo = new finfo(FILEINFO_MIME_TYPE);
        $mime = $finfo->file($file['tmp_name']);
        if (!in_array($mime, $allowedTypes)) {
            return ['', "허용되지 않은 파일 형식입니다."];
        }
        // 고유한 파일 이름 생성
        $ext = pathinfo($file['name'], PATHINFO_EXTENSION);
        $basename = bin2hex(random_bytes(8)) . '.' . $ext;
        $targetPath = $dir . $basename;
        // 파일 이동
        if (!move_uploaded_file($file['tmp_name'], $targetPath)) {
            return ['', "파일을 서버에 저장하는 데 실패했습니다."];
        }
        return [$targetPath, ''];
    }
    // 음악 파일 업로드
    list($mp3Path, $mp3Error) = handleFileUpload(
        $_FILES['mp3'],
        $musicDir,
        ['audio/mpeg', 'audio/mp3', 'audio/wav']
    );
    if ($mp3Error) $errors[] = "음악 파일: " . $mp3Error;
    // 사진 파일 업로드
    list($photoPath, $photoError) = handleFileUpload(
        $_FILES['photo'],
        $imageDir,
        ['image/jpeg', 'image/png', 'image/gif']
    );
    if ($photoError) $errors[] = "사진 파일: " . $photoError;
    // 비디오 파일 업로드
    list($videoPath, $videoError) = handleFileUpload(
        $_FILES['video'],
        $videoDir,
        ['video/mp4', 'video/webm', 'video/ogg']
    );
    if ($videoError) $errors[] = "비디오 파일: " . $videoError;
    // 오류가 없으면 데이터베이스에 삽입
    if (empty($errors)) {
        try {
            $sql = "INSERT INTO aa_praise (chapter, title, mp3, photo, video, first, lyrics) 
                    VALUES (:chapter, :title, :mp3, :photo, :video, :first, :lyrics)";
            $stmt = $conn->prepare($sql);
            $stmt->execute([
                ':chapter' => $chapter,
                ':title' => $title,
                ':mp3' => $mp3Path,
                ':photo' => $photoPath,
                ':video' => $videoPath,
                ':first' => $first,
                ':lyrics' => $lyrics
            ]);
            $successMessage = "데이터가 성공적으로 삽입되었습니다.";
        } catch (PDOException $e) {
            $errors[] = "데이터 삽입 실패: " . $e->getMessage();
        }
    }
}
?>
<!DOCTYPE html>
<html lang="ko">
<head>
    <meta charset="UTF-8">
    <title>찬양 데이터 입력 - PC 전용</title>
    <style>
        /* PC 전용 스타일 */
        body {
            font-family: Arial, sans-serif;
            background-color: #f8f9fa;
            padding: 20px;
        }
        h1 {
            text-align: center;
            color: #343a40;
            margin-bottom: 30px;
        }
        form {
            max-width: 800px;
            margin: 0 auto;
            background-color: #ffffff;
            padding: 25px;
            border-radius: 8px;
            box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
        }
        table {
            width: 100%;
            border-collapse: collapse;
        }
        td {
            padding: 10px 15px;
            vertical-align: top;
        }
        td.label {
            width: 20%;
            font-weight: bold;
            background-color: #f1f1f1;
        }
        input[type="text"],
        textarea,
        input[type="file"] {
            width: 100%;
            padding: 8px;
            border: 1px solid #ced4da;
            border-radius: 4px;
            box-sizing: border-box;
        }
        textarea {
            resize: vertical;
            height: 100px;
        }
        .submit-btn {
            text-align: center;
            margin-top: 20px;
        }
        input[type="submit"] {
            background-color: #007bff;
            color: #ffffff;
            padding: 10px 25px;
            border: none;
            border-radius: 4px;
            cursor: pointer;
            font-size: 16px;
        }
        input[type="submit"]:hover {
            background-color: #0056b3;
        }
        .error-message {
            color: red;
            margin-bottom: 15px;
        }
        .success-message {
            color: green;
            margin-bottom: 15px;
        }
    </style>
</head>
<body>
    <h1>찬양 데이터 입력</h1>
    <form action="insert_praise.php" method="POST" enctype="multipart/form-data">
        <?php if (!empty($errors)): ?>
            <div class="error-message">
                <ul>
                    <?php foreach ($errors as $error): ?>
                        <li><?= htmlspecialchars($error) ?></li>
                    <?php endforeach; ?>
                </ul>
            </div>
        <?php endif; ?>
        <?php if (!empty($successMessage)): ?>
            <div class="success-message">
                <?= htmlspecialchars($successMessage) ?>
            </div>
        <?php endif; ?>
        <table>
            <tr>
                <td class="label"><label for="chapter">장</label></td>
                <td>
                    <input type="text" id="chapter" name="chapter" required 
                           value="<?= isset($_POST['chapter']) ? htmlspecialchars($_POST['chapter']) : '' ?>">
                </td>
            </tr>
            <tr>
                <td class="label"><label for="title">제목</label></td>
                <td>
                    <input type="text" id="title" name="title" required 
                           value="<?= isset($_POST['title']) ? htmlspecialchars($_POST['title']) : '' ?>">
                </td>
            </tr>
            <tr>
                <td class="label"><label for="mp3">음악 파일 (MP3)</label></td>
                <td>
                    <input type="file" id="mp3" name="mp3" accept=".mp3,audio/*">
                </td>
            </tr>
            <tr>
                <td class="label"><label for="photo">사진 파일 (이미지)</label></td>
                <td>
                    <input type="file" id="photo" name="photo" accept=".jpg,.jpeg,.png,.gif,image/*">
                </td>
            </tr>
            <tr>
                <td class="label"><label for="video">비디오 파일 (MP4)</label></td>
                <td>
                    <input type="file" id="video" name="video" accept=".mp4,video/*">
                </td>
            </tr>
            <tr>
                <td class="label"><label for="first">가사의 첫 줄</label></td>
                <td>
                    <input type="text" id="first" name="first" required 
                           value="<?= isset($_POST['first']) ? htmlspecialchars($_POST['first']) : '' ?>">
                </td>
            </tr>
            <tr>
                <td class="label"><label for="lyrics">가사</label></td>
                <td>
                    <textarea id="lyrics" name="lyrics" required><?= isset($_POST['lyrics']) ? htmlspecialchars($_POST['lyrics']) : '' ?></textarea>
                </td>
            </tr>
        </table>
        <div class="submit-btn">
            <input type="submit" value="데이터 삽입">
        </div>
    </form>
</body>
</html>

 

select.php로 db에 저장된  데이타를 가지고와서 웹에서 재생해줍니다.

감사합니다


<?php
// select.php
// 데이터베이스 연결 파일 포함
include('connect_pdo.php');
try {
    // SQL 쿼리 작성
    $sql = "SELECT id, chapter, title, mp3, photo, video, first, lyrics FROM aa_praise ORDER BY id ASC";
    $stmt = $conn->prepare($sql);
    $stmt->execute();
    // 데이터 가져오기
    $praises = $stmt->fetchAll(PDO::FETCH_ASSOC);
} catch (PDOException $e) {
    die("쿼리 오류: " . $e->getMessage());
}
?>
<!DOCTYPE html>
<html lang="ko">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Praise List</title>
    <style>
        /* 기본 스타일 */
        body {
            font-family: Arial, sans-serif;
            margin: 20px;
            background-color: #f0f0f0;
            text-align: center;
        }
        h1 {
            color: #333;
        }
        table {
            width: 100%;
            max-width: 1000px;
            margin: 0 auto;
            border-collapse: collapse;
            background-color: white;
            box-shadow: 0 0 10px rgba(0,0,0,0.1);
        }
        th, td {
            padding: 15px;
            border: 1px solid #ddd;
            text-align: center;
        }
        th {
            background-color: #4CAF50;
            color: white;
        }
        img {
            max-width: 100px;
            height: auto;
            border-radius: 5px;
        }
        .title-link {
            color: #007BFF;
            text-decoration: none;
            font-weight: bold;
            cursor: pointer;
        }
        .title-link:hover {
            text-decoration: underline;
        }
        /* 모달 스타일 */
        .modal {
            display: none; /* 기본적으로 숨김 */
            position: fixed;
            z-index: 1000;
            left: 0;
            top: 0;
            width: 100%;
            height: 100%;
            overflow: auto; /* 스크롤 가능 */
            background-color: rgba(0,0,0,0.5); /* 반투명 배경 */
        }
        .modal-content {
            background-color: #fefefe;
            margin: 5% auto; /* 수직 중앙 정렬 */
            padding: 20px;
            border: 1px solid #888;
            width: 90%;
            max-width: 800px;
            border-radius: 10px;
            position: relative;
            text-align: left;
        }
        .close {
            color: #aaa;
            position: absolute;
            top: 15px;
            right: 25px;
            font-size: 30px;
            font-weight: bold;
            cursor: pointer;
        }
        .close:hover,
        .close:focus {
            color: black;
            text-decoration: none;
        }
        .media-container {
            position: relative;
            width: 720px;
            height: 405px;
            margin: 0 auto;
        }
        .background-image {
            width: 100%;
            height: 100%;
            background-size: cover;
            background-position: center;
        }
        .overlay-video {
            width: 100%;
            height: 100%;
            position: absolute;
            top: 0;
            left: 0;
            mix-blend-mode: screen;
            display: none; /* 기본적으로 숨김 */
        }
        .modal-lyrics {
            margin-top: 20px;
            white-space: pre-wrap;
        }
        /* 반응형 디자인 */
        @media (max-width: 768px) {
            th, td {
                padding: 10px;
            }
            .modal-content {
                width: 95%;
            }
            .media-container {
                width: 100%;
                height: auto;
            }
            .background-image, .overlay-video {
                height: auto;
                padding-top: 56.25%; /* 16:9 비율 */
            }
        }
        @media (max-width: 480px) {
            th, td {
                padding: 8px;
            }
            .modal-content {
                width: 98%;
            }
            .media-container {
                width: 100%;
            }
        }
        /* 디버깅 메시지 스타일 */
        .debug-message {
            color: red;
            font-weight: bold;
            margin-top: 10px;
        }
    </style>
</head>
    
<body>
    <h1>Praise List</h1>
    <?php if (!empty($praises)): ?>
        <table>
            <thead>
                <tr>
                    <th>장</th>
                    <th>제목</th>
                    <th>사진</th>
                    <th>음악</th>
                    <th>가사 첫 줄</th>
                </tr>
            </thead>
            
            <tbody>
                <?php foreach ($praises as $praise): ?>
                    <tr>
                        
                        <td><?= htmlspecialchars($praise['chapter']) ?></td>
                        
                        <td>
                            <a href="#" class="title-link" 
                               data-title="<?= htmlspecialchars($praise['title']) ?>" 
                               data-mp3="<?= htmlspecialchars($praise['mp3']) ?>" 
                               data-photo="<?= htmlspecialchars($praise['photo']) ?>" 
                               data-video="<?= htmlspecialchars($praise['video']) ?>" 
                               data-lyrics="<?= htmlspecialchars($praise['lyrics']) ?>">
                               <?= htmlspecialchars($praise['title']) ?>
                            </a>
                        </td>
                        
                        <td>
                            <?php
                                // 이미지 파일 경로 설정
                                $photoPath = __DIR__ . '/' . $praise['photo'];
                                $photoURL = $praise['photo']; // 웹 URL 경로 (상대 경로)
                                
                                // 디버깅을 위해 절대 경로와 웹 URL 경로 출력
                              //  echo '<div>절대 경로: ' . htmlspecialchars($photoPath) . '</div>';
                              //  echo '<div>웹 URL 경로: ' . htmlspecialchars($photoURL) . '</div>';
                                
                                if (file_exists($photoPath)) {
                                    echo '<img src="' . htmlspecialchars($photoURL) . '" alt="' . htmlspecialchars($praise['title']) . ' 사진">';
                                } else {
                                    echo '<div class="debug-message">사진 파일을 찾을 수 없습니다: ' . htmlspecialchars($praise['photo']) . '</div>';
                                }
                            ?>
                        </td>
                        
                        <td>
                            <?php
                                // 음악 파일 경로 설정
                                $mp3Path = __DIR__ . '/' . $praise['mp3'];
                                $mp3URL = $praise['mp3']; // 웹 URL 경로 (상대 경로)
                                
                                // 디버깅을 위해 절대 경로와 웹 URL 경로 출력
                              //  echo '<div>절대 경로: ' . htmlspecialchars($mp3Path) . '</div>';
                              //  echo '<div>웹 URL 경로: ' . htmlspecialchars($mp3URL) . '</div>';
                                
                                if (file_exists($mp3Path)) {
                                    echo '<audio class="row-audio" controls>';
                                    echo '<source src="' . htmlspecialchars($mp3URL) . '" type="audio/mpeg">';
                                    echo 'Your browser does not support the audio element.';
                                    echo '</audio>';
                                } else {
                                    echo '<div class="debug-message">음악 파일을 찾을 수 없습니다: ' . htmlspecialchars($praise['mp3']) . '</div>';
                                }
                            ?>
                        </td>
                        
                        <td><?= htmlspecialchars($praise['first']) ?></td>
                    </tr>
                <?php endforeach; ?>
            </tbody>
        </table>
    <?php else: ?>
        <p>데이터가 없습니다.</p>
    <?php endif; ?>
    <!-- 모달 창 -->
    <div id="myModal" class="modal">
        <div class="modal-content">
            <span class="close">×</span>
            <h2 id="modalTitle">제목</h2>
            
            <div class="media-container">
                <div class="background-image" style="background-image: url('');"></div>
                <video class="overlay-video" 
                       src="" 
                       autoplay 
                       loop 
                       muted 
                       playsinline>
                    Your browser does not support the video tag.
                </video>
            </div>
            
            <p id="modalLyrics" class="modal-lyrics">가사가 여기에 표시됩니다.</p>
            <audio id="modalAudio" controls>
                <source id="audioSource" src="" type="audio/mpeg">
                Your browser does not support the audio element.
            </audio>
            <div id="modalDebug" class="debug-message"></div>
        </div>
    </div>
    <script>
        // 모달 요소 가져오기
        const modal = document.getElementById("myModal");
        const modalTitle = document.getElementById("modalTitle");
        const backgroundImage = document.querySelector('.background-image');
        const overlayVideo = document.querySelector('.overlay-video');
        const modalLyrics = document.getElementById("modalLyrics");
        const modalAudio = document.getElementById("modalAudio");
        const audioSource = document.getElementById("audioSource");
        const closeBtn = document.getElementsByClassName("close")[0];
        const modalDebug = document.getElementById("modalDebug");
        // 모든 제목 링크에 클릭 이벤트 추가
        const links = document.querySelectorAll('.title-link');
        links.forEach(link => {
            link.addEventListener('click', async (event) => {
                event.preventDefault(); // 기본 링크 동작 방지
                // 데이터 속성에서 정보 가져오기
                const title = link.getAttribute('data-title');
                const mp3 = link.getAttribute('data-mp3');
                const photo = link.getAttribute('data-photo');
                const video = link.getAttribute('data-video');
                const lyrics = link.getAttribute('data-lyrics');
                // 모달 내용 초기화
                modalTitle.textContent = title;
                backgroundImage.style.backgroundImage = "url('')";
                overlayVideo.style.display = "none";
                overlayVideo.src = "";
                modalAudio.style.display = "none";
                modalDebug.innerHTML = "";
                // 사진 설정 및 존재 여부 확인
                if (photo && photo !== '') {
                    if (await fileExists(photo)) { // 상대 경로
                        backgroundImage.style.backgroundImage = `url('${photo}')`;
                    } else {
                        modalDebug.innerHTML += `사진 파일을 찾을 수 없습니다: ${photo}<br>`;
                    }
                }
                // 비디오 설정 및 존재 여부 확인
                if (video && video !== '') {
                    if (await fileExists(video)) { // 상대 경로
                        overlayVideo.src = video;
                        overlayVideo.style.display = "block";
                        overlayVideo.play();
                    } else {
                        modalDebug.innerHTML += `비디오 파일을 찾을 수 없습니다: ${video}<br>`;
                    }
                }
                // 가사 설정
                modalLyrics.textContent = lyrics;
                // 오디오 설정 및 존재 여부 확인
                if (mp3 && mp3 !== '') {
                    if (await fileExists(mp3)) { // 상대 경로
                        audioSource.src = mp3;
                        modalAudio.load();
                        modalAudio.style.display = "block";
                        modalAudio.play();
                    } else {
                        modalDebug.innerHTML += `음악 파일을 찾을 수 없습니다: ${mp3}<br>`;
                    }
                }
                // 모달 표시
                modal.style.display = "block";
                // 기존에 재생 중인 오디오가 있다면 일시 정지
                const audios = document.querySelectorAll('audio');
                audios.forEach(audio => {
                    if (audio !== modalAudio) {
                        audio.pause();
                        audio.currentTime = 0;
                    }
                });
            });
        });
        // 닫기 버튼 클릭 시 모달 닫기
        closeBtn.onclick = function() {
            modal.style.display = "none";
            modalAudio.pause();
            audioSource.src = "";
            overlayVideo.pause();
            overlayVideo.src = "";
            modalDebug.innerHTML = "";
        }
        // 모달 외부 클릭 시 모달 닫기
        window.onclick = function(event) {
            if (event.target == modal) {
                modal.style.display = "none";
                modalAudio.pause();
                audioSource.src = "";
                overlayVideo.pause();
                overlayVideo.src = "";
                modalDebug.innerHTML = "";
            }
        }
        // 모든 오디오 요소에 이벤트 리스너 추가하여 하나만 재생되도록 함
        const allAudios = document.querySelectorAll('audio');
        allAudios.forEach(audio => {
            audio.addEventListener('play', () => {
                allAudios.forEach(otherAudio => {
                    if (otherAudio !== audio) {
                        otherAudio.pause();
                        otherAudio.currentTime = 0;
                    }
                });
            });
        });
        // JavaScript로 파일 존재 여부 확인 함수 (비동기)
        async function fileExists(url) {
            try {
                const response = await fetch(url, { method: 'HEAD' });
                return response.ok;
            } catch (e) {
                return false;
            }
        }
    </script>
</body>
</html>

 

추천
9

댓글 전체

database와 관련이 되면 괜히 어렵다는 생각이 들 수가 있습니다.

저도 초보지만 db를 잘 다루면 많은 것을 할수있다는 생각이듭니다.

감사합니다.

전체 2,580 |RSS
그누보드5 스킨 내용 검색

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT