如何将文件附加到FormData()?

时间:2017-04-06 04:22:12

标签: javascript xmlhttprequest multipartform-data filereader form-data

fd.append("upload", file)收益,

------WebKitFormBoundaryJnjpATRkxe2Duwwu
Content-Disposition: form-data; name="userid"

8022171621665209152
------WebKitFormBoundaryJnjpATRkxe2Duwwu
Content-Disposition: form-data; name="upload"; filename="sample.csv"
Content-Type: text/csv


------WebKitFormBoundaryJnjpATRkxe2Duwwu--

fd.append("upload", evt.target.result)收益,

------WebKitFormBoundaryITfVxS7FbNWfk3Ty
Content-Disposition: form-data; name="userid"

8022171621665209152
------WebKitFormBoundaryITfVxS7FbNWfk3Ty
Content-Disposition: form-data; name="upload"

"Healthy1.jpg","1","3","1","5"
"Unhealthy1.jpg","0","2","1","2"
"Water1.jpg","2","2","1","3"
------WebKitFormBoundaryITfVxS7FbNWfk3Ty--

但我需要这个,

------WebKitFormBoundaryITfVxS7FbNWfk3Ty
Content-Disposition: form-data; name="userid"

8022171621665209152
------WebKitFormBoundaryITfVxS7FbNWfk3Ty
Content-Disposition: form-data; name="upload"; filename="sample.csv"
Content-Type: text/csv

"Healthy1.jpg","1","3","1","5"
"Unhealthy1.jpg","0","2","1","2"
"Water1.jpg","2","2","1","3"
------WebKitFormBoundaryITfVxS7FbNWfk3Ty--

这是我的代码:

app.ports.uploadFile.subscribe(function(userid){
    var file = document.getElementById("csv").files[0];
    var fr = new FileReader();
    fr.readAsText(file, "UTF-8");
    fr.onload = function (evt) {
        console.log(evt.target.result);
        var fd = new FormData();
        fd.append("userid", userid)
        fd.append("upload", file) // <<<<< WHAT DO I PUT HERE?
        var xhr = new XMLHttpRequest()
        xhr.open('post', "http://localhost:8668/upload/ugimgset", true)
        xhr.setRequestHeader("Content-Type", "multipart/form-data")
        xhr.setRequestHeader("Authorization", "Bearer " + token() )
        xhr.send(fd)
    }
})

1 个答案:

答案 0 :(得分:3)

我找到了我的错误来源

  1. 我只需要<?php include("connect.php"); include("check.php"); include("image.php"); $postbody = ""; $posts = ""; //$postimg = ""; if (isset($_POST['post'])) { // $time = connect::query('SELECT posted_at FROM dry_posts WHERE id=:postid', array(':postid'=>$_GET['id'])); //$postimg = $_POST['postimg'] //if(isset($_POST['postimg'])) { //$id = connect::query('SELECT id FROM dry_posts WHERE id=:id', array(':id'=>$_GET['id'])); if ($_FILES['postimg']['size'] == 0) { $postbody = $_POST['postbody']; $loggedInUserId = check::isLoggedIn(); if (strlen($postbody) > 160 || strlen($postbody) < 1) { die('Incorrect length!'); } connect::query('INSERT INTO dry_posts VALUES (null, :postbody, NOW(), 0)', array(':postbody'=>$postbody)); } else { //$postid = Post::createImgPost($_POST['postbody']); if (strlen($postbody) > 160) { die('Incorrect length!'); } connect::query('INSERT INTO dry_posts VALUES (null, :postbody, NOW(), 0)', array(':postbody'=>$postbody)); $postid = connect::query('SELECT id FROM dry_posts ORDER BY ID DESC LIMIT 1'); Image::uploadImage('postimg', "UPDATE dry_posts SET postimg=:postimg WHERE id=:postid", array(':postid'=>$postid)); } } if (isset($_GET['postid'])) { //Post::likePost($_GET['postid']); if (!connect::query('SELECT post_id FROM post_likes WHERE post_id=:postid', array(':postid'=>$_GET['postid']))) { connect::query('UPDATE dry_posts SET likes=likes+1 WHERE id=:postid', array(':postid'=>$_GET['postid'])); connect::query('INSERT INTO post_likes VALUES (null, :postid)', array(':postid'=>$_GET['postid'])); } else { connect::query('UPDATE dry_posts SET likes=likes-1 WHERE id=:postid', array(':postid'=>$_GET['postid'])); connect::query('DELETE FROM post_likes WHERE post_id=:postid', array(':postid'=>$_GET['postid'])); } } // $posts = Post::displayPosts(); $dbposts = connect::query('SELECT * FROM dry_posts ORDER BY id DESC'); $posts = ""; if(isset($_FILE['postimg'])){ foreach($dbposts as $p) { if (!connect::query('SELECT post_id FROM post_likes WHERE post_id=:postid', array(':postid'=>$p['id']))) { $posts .="<img src='".$p['postimg']."'>".htmlspecialchars($p['body'])." <form action='dry.php?postid=".$p['id']."' method='post'> <input type='submit' name='like' value='Like'> <span>".$p['likes']." likes</span> </form> <hr /></br /> "; } else { $posts .="<img src='".$p['postimg']."'>".htmlspecialchars($p['body'])." <form action='dry.php?postid=".$p['id']."' method='post'> <input type='submit' name='unlike' value='Unlike'> <span>".$p['likes']." likes</span> </form> <hr /></br /> "; } } } ?> <form action="try.php" method="post" class = "forum" enctype="multipart/form-data"> <textarea name="postbody" rows="4" cols="60" class = "text"></textarea> <br />Upload an image: <input type="file" name="postimg"> <input type="submit" name="post" value="Post"> </form> - 它会处理文件和隐藏字段。
  2. 我覆盖了FormData()。当我这样做时,表格边界丢失了:
  3. `xhr.setRequestHeader(“Content-Type”,“multipart / form-data”)

    更正的代码如下(以及一些上下文):

    Content-Type