我正在try 使用表格数据上传图像.但表单域服务器所需的名称无法识别.

Warning: Undefined array key "photo"

以下是我的代码:

index.html

html>
<head>
 <script type = "text/javascript" src="index.js"></script>
</head>
<body>
<button onclick="uploadImage()">upload an Image</button>
</body>
</html>

index.js

async function uploadImage(){
    const data = new FormData()
    data.append('photo',{
        name: 'timg', 
        type: 'image/jpeg', 
        uri: 'C:\Users\mea\Downloads\testimg.jpeg'
    })
    return await fetch('upload_image.php',{
        method: 'POST',
        body: data,
        headers: {
            'Content-Type': 'multipart/form-data'
        }
    })
}

upload_image.php

<?php
    header('Access-Control-Allow-Origin: *');
    $target_dir = "../../images";
    $target_file = $target_dir .'/'.basename($_FILES['photo']['name']);
    $name = $_FILES['photo']['name'];
      if(move_uploaded_file($_FILES['photo']['tmp_name'], $target_file)) {
        echo json_encode (
        array('message' => 'Image uploaded Successfully'));}
    else{
        echo json_encode (
        array('message' => 'Upload failed!'));
    }
?>

我try 了所有可用的解决方案,但仍找不到原因.

推荐答案

方法上有问题.$_FILE将返回空,因为这不是从HTML表单上传的文件.我已经创造了一个更好的方法,你可以try .

Index.html

<html>
<head>
</head>
<body>
    <button onclick="uploadImage()">Upload</button>
<script type = "text/javascript">
    async function uploadImage(){
        image_url = "https://www.google.com/images/branding/googlelogo/1x/googlelogo_color_272x92dp.png";
        var formData = new FormData();
        formData.append("image_url", image_url);
        formData.append("image_name", "googlelogo");
        formData.append("image_type", "png");
        
        var request = new XMLHttpRequest();
        request.open("POST", "/Upload_Image.php");
        request.send(formData);
        console.log(request.responseText);
    }
</script>

</body>
</html>

Upload_Image.php

<?php
try {
    $image_url = $_POST['image_url'];
    $image_name = $_POST['image_name'];
    $image_type = $_POST['image_type'];

    $target_dir = "uploads/";
    $target_file = $target_dir . $image_name . "." . $image_type;
    // save image to uploads folder
    file_put_contents($target_file, file_get_contents($image_url));
    echo "Image uploaded successfully";
} catch (Exception $e) {
    echo 'Caught exception: ',  $e->getMessage(), "\n";
}
?>

并始终使用try catch语句来查找错误.try语句允许您定义一个代码块,以便在执行该代码块时对其进行错误测试.

Javascript相关问答推荐

有Angular 的material .未应用收件箱中的价值变化

如何粗体匹配的字母时输入搜索框使用javascript?

无法检测卡片重叠状态的问题

还原器未正确更新状态

为什么useState触发具有相同值的呈现

Ember.js 5.4更新会话存储时如何更新组件变量

如何迭代叔父元素的子HTML元素

是否可以在Photoshop CC中zoom 路径项?

Node.js错误: node 不可单击或不是元素

MongoDB中的嵌套搜索

本地损坏的Java脚本

我怎样才能点击一个元素,并获得一个与 puppeteer 师导航页面的URL?

JQuery使用选项填充HTMLSELECT并设置默认结果,默认结果显示为空

如何在Web项目中同步语音合成和文本 colored颜色 更改

如何向内部有文本输入字段的HTML表添加行?

在范围数组中查找公共(包含)范围

如何在Firebase中读取对象的特定字段?

React数组查找不读取变量

Firebase函数中的FireStore WHERE子句无法执行

如何在不获取其子元素的文本内容的情况下获取元素的文本内容?