从建立在WordPress上的ReactJS应用程序发出POST请求

Question

我正在WordPress后端构建一个ReactJS应用程序。 React App运行在同一个域中，嵌入在WordPress站点中。我一直关注的大部分教程都介绍了如何从WordPress获取数据到React。我在这方面取得了成功，但需要弄清楚如何将数据从我的React应用程序提交到WordPress（最好是通过REST API）。

这将是登录编辑器的自定义管理页面，可以在管理面板中或从前端获得。

作为创建帖子的一个例子，我天真地尝试以下功能：

  saveGrid() {
    const url = "/wp-json/wp/v2/posts";
    const body = JSON.stringify({
      "title":"internet",
      "content":"teapot"
    });

    fetch(url, {
      method: 'POST',
      headers: {
        'Accept': 'application/json',
        'Content-Type': 'application/json',
      },
      body:body

    });
  }    

我收到了401未经授权的回复。授权自己提交POST的最简单方法是什么（首选安全解决方案）？

Answer 1

看起来你走在正确的轨道上。

快速阅读：https://apppresser.com/wp-api-post-submission/告诉我，您所缺少的只是一个“随机数”，以便WP API能够成功识别并验证您的请求。

在上面的指南中，开发人员创建了一个用JQuery编写的JS，它将XHR / AJAX请求发送到WP API，在他们的plugin.php中，他们使用WP中的一些变量对脚本进行入队和本地化，以帮助JS中的请求。

这里的内容是他们使用wp_create_nonce('wp_rest')and将其分配给本地化变量nonce，以便他们可以在JS中稍后引用，并在请求中将nonce分配给他们的X-WP-Nonce头！

如果你进一步研究这个问题，你可能会找到一个合适的替代方案，因为我不完全确定你是如何加载你的JSX文件的，但是这个指南可能会让你排队你的JSX脚本/文件：http://blog.milandinic.com/2015/12/01/using-react-jsx-in-wordpress/

更多信息

https://codex.wordpress.org/Function_Reference/wp_localize_script https://developer.wordpress.org/reference/functions/wp_enqueue_script/

Answer 2

我能够解决这个问题，而不是使用React的直接发布请求，使用React之外的Jquery AJAX提交，它使用React中的表单中的数据。这导致请求包含必要的cookie（我不明白为什么会这样）