无法使用 React Native 将图像上传到 wp/v2/media [英] Cannot get images to upload to wp/v2/media with React Native

问题描述

我一直在这里和https://github.com/WP-API/WP-API/ 和 https://wordpress.org/ 并且找不到任何人在谈论这.我可以使用邮递员并选择文件来使其工作，但是我无法将其作为multipart/form"或image/png"提交.

I've been all over here and https://github.com/WP-API/WP-API/ and https://wordpress.org/ and cannot find anyone talking about this. I can get it working using postman and selecting the file, however i cannot get it work submitting it as either "multipart/form" or "image/png".

我也找不到任何详细说明请求应该如何显示的内容.我可以创建附件，但它们是使用 base64 数据作为帖子正文的正确大小的空图像.我觉得我错过了一些简单的东西，但无法弄清楚它是什么.我正在使用邮递员来抽象出其他干扰，我的标题是:

I also cannot find anything detailing exactly how the request should look. I can create attachments but they're empty images of the correct size using base64 data as the post body. I feel like I'm missing something simple but cannot figure out what it is. I'm using postman to abstract out other distractions, my headers are:

POST /wp-json/wp/v2/media
Content-Type: image/png
Content-Disposition: attachment;filename=image_1.png
Cache-Control: no-cache
Authorization: Bearer {JWT_Auth_token}

身体只是

{
    data:image/png;base64,{base64_string_here}
}

我得到一个返回的响应，就像它创建了一个附件，但是当我在 wp admin 中签入时，它是一个空白文件，这似乎是正确的 kb 大小，但没有显示.我错过了什么???

I get a returned response like it created an attachment, but when I check in the wp admin it's an blank file, that appears to be the correct kb size but doesn't display. What am I missing???

推荐答案

终于想通了！借助此 WP Trac 问题 https://core.trac.wordpress.org/ticket/41774.

Finally figured it out! With the help of this WP Trac issue https://core.trac.wordpress.org/ticket/41774.

所以我的请求现在看起来像这样:

So my request looks like this now:

async function uploadImageAsync(urlbase, uri, base64, token) {
    let apiUrl = urlbase + '/wp-json/wp/v2/media';
    let formData = new FormData();

    //dynamically get file type
    let uriParts = uri.split('.');
    let fileType = uriParts[uriParts.length - 1];

    //generate some random number for the filename
    var randNumber1 = Math.floor(Math.random() * 100);
    var randNumber2 = Math.floor(Math.random() * 100);

    formData.append('file', {
        base64,
        name: `photo-${randNumber1}-${randNumber2}.${fileType}`,
        type: `image/${fileType}`,
    });

    let options = {
        method: 'POST',
        body: formData,
        headers: {
            Accept: 'application/json',
            'Authorization' : 'Bearer ' + token, 
            'Content-Type': 'multipart/form-data',
            'Cache-Control' : 'no-cache',           
        },
    };

    console.log('header options: ',options);
    console.log('form-data options: ',formData);

    return fetch(apiUrl, options);

}

当 base64 出现时，它的格式简单地为 base64:{base64-string}.不是 data:image/type，因为它是在表单数据中指定的.这里的另一件事是将表单的键设置为文件".

When base64 comes in it's formatted simply as base64: {base64-string}. Not data:image/type, since that is specified in the form data. The other thing that's key here is setting the key of form to 'file'.

这篇关于无法使用 React Native 将图像上传到 wp/v2/media的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！