如何使用WordPress REST API创建文章？请求报错排查

代码核心问题分析 #

• 变量未定义错误：headers中直接使用username和password，但这两个是$.ajax的配置属性而非局部变量，会触发ReferenceError。
• 数据格式不匹配API要求：WordPress REST API要求title、content、excerpt需以raw字段包裹的对象形式传递，而非直接传字符串。
• contentType大小写错误：Application/json需改为小写的application/json，避免部分环境解析失败。
• 缺少错误回调：未捕获请求失败信息，无法排查具体报错原因。

修复后的完整代码 #

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script>
$(document).ready(function(){
    // 定义认证信息变量
    const wpUsername = "siva";
    const wpPassword = "siva";

    var ourPostData = {
        "title": { "raw": "siva" },
        "content": { "raw": "Hi this welcome" },
        "status": "publish",
        "excerpt": { "raw": "Read this awesome post" },
        "password": "siva",
        "slug": "new-test-post"
    };

    $.ajax({
        type: "POST",
        url: "http://127.0.0.1/wordpress/wp-json/wp/v2/posts",
        data: JSON.stringify(ourPostData),
        dataType: "json",
        contentType: "application/json",
        headers: {
            "Authorization": "Basic " + btoa(wpUsername + ":" + wpPassword)
        },
        success: function(callback){
            console.log("文章创建成功：", callback);
        },
        error: function(xhr, status, error){
            console.error("请求失败：", status, error);
            console.error("响应内容：", xhr.responseText);
        }
    });
});
</script>
</head>
<body>

</body>
</html>

额外注意事项 #

• 用户权限验证：用于认证的WordPress用户必须拥有publish_posts权限（至少为编辑角色）。
• 跨域处理：若前端页面与WordPress站点不在同一域名/端口，需在WordPress后台配置跨域规则，比如在主题functions.php中添加允许跨域的代码，或安装WP CORS类插件。
• HTTPS环境适配：若站点使用HTTPS，btoa生成的认证字符串无需额外处理，但需确保请求URL为HTTPS协议。

内容的提问来源于stack exchange，提问作者siva