保存生成的二維碼 png 但收到 404 Not Found 錯誤消息

Question

我正在嘗試從 HTML 輸入元素的值生成 QR 碼：

HTML、CSS、JS代碼：

index.php

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <link rel="icon" href="https://codingbirdsonline.com/wp-content/uploads/2019/12/cropped-coding-birds-favicon-2-1-192x192.png" type="image/x-icon">
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.bundle.min.js" integrity="sha384-LtrjvnR4Twt/qOuYxE721u19sVFLVSA4hf/rRt6PrZTmiPltdZcI7q7PXQBYTKyf" crossorigin="anonymous"></script>
    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.2/css/all.css">
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js" integrity="sha384-B4gt1jrGC7Jh4AgTPSdUtOBvfO8shuf57BaghqFfPlYxofvL8/KUEfYiJOMMV+rV" crossorigin="anonymous"></script>

    <title>Send Email Example</title>
    <style>
        .center-block {
            display: block;
            margin-left: auto;
            margin-right: auto;
        }
    </style>
</head>
<body>
  <div class="container">
    <div class="row">
        <div class="col-sm-9 col-md-7 col-lg-5 mx-auto">
            <div class="card card-signin my-5">
                <div class="card-body">
                    <h5 class="card-title text-center">Generate QR Code</h5>

                    <form id="generateQrForm" class="form-signin">
                        <div class="form-label-group">
                            <label for="inputEmail">Text For QR <span style="color: #FF0000">*</span></label>
                            <input type="text" name="qrText" id="qrText" class="form-control" required placeholder="Enter something to generate QR">
                        </div> <br/>
                       <div id="generatedQr text-center">
                            <img src="" id="generatedQrImg" class="center-block">
                        </div> <br/>
                        <button type="submit" name="generateQrBtn" id="generateQrBtn" class="btn btn-lg btn-primary btn-block text-uppercase" >Generate QR</button>
                    </form>
                </div>
            </div>
        </div>
    </div>
  </div>
  <script type="text/javascript" src="generate_qr_js.js"></script>
  </script>

</body>

jQuery 代碼：

generate_qr_js.js

$("form#generateQrForm").on("submit",function (e) {
   e.preventDefault();
    var qrText = $("#qrText").val();
    $.post("generate_qr_script.php",{generateQr:'generateQr',qrText:qrText},function (response) {
    var data = response.split('^');
    var generateQrImgPath = data[1];
    $("#generatedQrImg").attr("src",generateQrImgPath);
    })
});

PHP 代碼：

generate_qr_script.php

<?php
include "library/phpqrcode/qrlib.php";
if (isset($_POST['generateQr']) == 'generateQr')
{
    $qrText = $_POST['qrText']; // receive the text for QR
    $directory = "generated_qr/"; // folder where to store QR
    $fileName = 'QR'.rand().'.png'; // generate random name of QR image
    QRcode::png($qrText, $directory.$fileName, 'L', 4, 2); // library function to generate QR
    echo "success^".$directory.$fileName; // returns the qr-image path
}
?>

我在一個文件夾下運行這 3 個代碼以及在generate_qr_script.php文件中導入的phpqrcode庫。 當我 go 到 index.php 網站使用 XAMPP 服務器時，我收到一條錯誤消息“404 Not Found”，如下所示：

當我檢查源代碼時，圖像源已成功生成，但它沒有顯示在 web 上。

我要做的是生成一個二維碼，該二維碼捕獲用戶輸入到用 HTML 代碼編寫的文本框中的內容。 理想情況下，最好將條形碼存儲到同一文件夾中的本地計算機文件中，但代碼不會加載所需的二維碼 png。

如果有人對我哪里出錯有任何建議或有更好的想法來生成條形碼，請告訴我。

Answer 1

我想我通過更改我想以某種方式保存圖像的文件權限來修復它！

保存生成的二維碼 png 但收到 404 Not Found 錯誤消息

問題描述

1 個解決方案

解決方案1
0 已采納 2021-03-03 19:01:34

保存生成的二維碼 png 但收到 404 Not Found 錯誤消息

問題描述

1 個解決方案

解決方案1 0 已采納 2021-03-03 19:01:34

解決方案1
0 已采納 2021-03-03 19:01:34