0

我已经使用 ember-plupload 来上传图片。现在我为此编写了一个组件。我可以从我的机器上打开并选择图片。但是我不知道下一步该做什么。我必须将发布请求发送到我的服务器端点带有正文参数 { photo_file: image file }。我的代码如下。

组件.hbs

{{#pl-uploader extensions="jpg jpeg png gif" for="upload-image" onfileadd="uploadImage" as |queue features|}}
  <div class="dropzone" id={{dropzone.id}}>
    <a id="upload-image">Add an Image.</a>
  </div>
{{/pl-uploader}}

组件.js

actions:{
        uploadImage:function(file){
        console.log(file)
        let filename = file.get('name');
        file.read().then(function (url) {
         console.log(filename)
         console.log(url)
        }
      }

我能够获取文件名并编码 base64 值。但不确定如何将请求发送到服务器端点。

http://example.com/api/addphoto and it require body with parameter photo_file and choosed file.

我能够从邮递员应用程序发出正确的请求。在请求的正文中，我选择了文件选项，它直接让我可以选择从那里选择一个文件。请求成功，照片被添加到当我选择图像并发送请求时的端点

我应该如何在我的应用程序中执行此操作？

4

1 回答 1

0

您可以使用 XMLHttpRequest

uploadImage:function(files){
        var file = files[0];
        var request = new XMLHttpRequest();
        request.open('post', "target url", true);
        var formData = new FormData();
        var fieldName = 'file';
        formData.append(fieldName, file);
        request.onreadystatechange = Ember.run.bind(this, function () {
            if (request.readyState === 4 && request.status !== 0) {
               //success
            }
        });

        request.send(formData);
    }
于 2016-01-19T12:42:17.023 回答