javascript - 无法在服务器中打开上传的文件

标签 javascript php jquery image file-upload

背景:

用户上传图像并单击“保存”按钮。

我成功地将图像保存到服务器中。我给了文件夹 777 权限....

enter image description here

问题:

我尝试打开图像,但它无法正常显示:Image url

enter image description here

HTML

<button class ="save" onclick="test()">Save image to server</button>

脚本:

function test(){
var canvas  = document.getElementById("0");
var dataURL = canvas.toDataURL();  // THE BASE 64 DATA
var dataFileName = document.getElementById('fileup').value.replace(/.*(\/|\\)/, ''); // GET THE FILE NAME THAT USER CHOSE
var dataFileType = dataFileName.split('.').pop();

$.ajax({
  type: "POST",
  url: "tamaker.php",
  data: { 
     imgBase64: dataURL,
     imgFileName: dataFileName,
     imgFileType: dataFileType
  }
}).done(function(o, imgFileName) {

  console.log(o);  
  var response = JSON.parse(o);
  console.log(response);

  $('body').prepend('<img src="' + dataFileName+ '" style="height: 200px; width: auto;">');

});
}

保存.php

<?php

ini_set('display_errors', 1);
ini_set('display_startup_errors', 1);
error_reporting(E_ALL);

if( isset($_POST['imgBase64']) && isset($_POST['imgFileName']) && isset($_POST['imgFileType']) ){

    $fname = filter_input(INPUT_POST, 'imgFileName'); // THE FILENAME THE USER CHOSE IS RECEIVED VIA POST
    $img = filter_input(INPUT_POST, 'imgBase64');  // THE BASE64 ENCODING RECEIVED VIA POST
    $imgtype = filter_input(INPUT_POST, 'imgFileType');  // THE FILE TYPE / EXTENSION IS RECEIVED VIA POST

    // STRIP OFF THE BEGINNING OF THE BASE64 DATA, BUT DEPENDS ON THE IMAGE TYPE.  
    // I COULD HAVE SIMPLIFIED THIS BUT USED IF STATEMENTS.
    if ( $imgtype === 'png'){
        $img = str_replace('data:image/png;base64,', '', $img);
    };
    if ( $imgtype === 'jpg' || $imgtype === 'jpeg'){
        $img = str_replace('data:image/jpeg;base64,', '', $img);
    };
    if ( $imgtype === 'gif'){
        $img = str_replace('data:image/gif;base64,', '', $img);
    };

    // REPLACE ALL SPACES IN THE IMAGE DATA WITH PLUS SYMBOL
    $img = str_replace(' ', '+', $img); 
    // CONVERT THE DATA FROM BASE64 ENCODING
    $img = base64_decode($img); 

    // SAVE THE FILE WITH NAME SYNTAX OF:  /images/clientlogos/[ACCOUNT ID]_[FILE NAME]
    file_put_contents('/var/www/html/ecom1/site/test/screen/'.$fname, $img);

    echo "Image has been saved successfully!<p>";
}
?>

这里是 pastebin 中的完整 html 代码

最佳答案

尝试将您的 apache 版本更新到 2.4。

这对这个家伙来说是成功的:https://stackoverflow.com/a/33033946/11722161

关于javascript - 无法在服务器中打开上传的文件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57072987/

相关文章:

javascript - 如何将帖子分享到 linkedin

javascript - 向 jQuery 的 .first() 方法添加谓词

php - 如何在数学类中创建减法方法?

php - 如何根据数据库查询加载特定文件/url

jquery - 设置在 jQuery 中访问链接

javascript - 是否可以在页面加载后立即强制下载文件(如 pdf)

Javascript - 从字符串获取数组值

Javascript 将图像排列成一堆卡片

php - 将 MYSQL 查询转换为 PHP 查询

javascript - 使用 jQuery 只允许文本框包含字母?