WordPress REST API上传文件

WordPress媒体库操作可通过media接口实现，上传需要用户认证。

上传入口

<input type="file" id="custom-upload-file" onChange={onChange}/>

监听文件输入变化

const onChange = (e) => {
    const file = e.target.files[0];

    //虚拟表单
    var fileData = new FormData();
    fileData.append( 'file', file);

    // WordPress会根据file自动解析属性
    // 可自定义覆盖默认值
    // imageData.append( 'title', 'hello world' );
    // ...

    upload(fileData);
}

上传文件

const upload = (data) => {
    // REST API地址
    const reqUrl = 'https://xxxxx.com/wp-json/wp/v2/media';

    // 认证凭据，此处使用jwt
    const sessionKey = '....';
    const headers = {
        'Authorization': 'Bearer' + sessionKey,
    }

    // 发起请求
    axios.post(reqUrl, data, {
        headers: headers
    })
    .then(function(response) {
        console.log('success', response);
    })
    .catch(function(error) {
        console.error('fail', error);
    });
}

相关资料

1. REST API 认证：jwt-authentication
2. 易用、简洁且高效的http库：axios
3. WordPress REST API Media文档：media