使用 Vue.js 调用 WordPress REST API V2 时出错

Question

当我使用 Vue.js 和 axios 调用 WP REST API 时出现以下错误。

XMLHttpRequest 无法加载 http://my-wordpress-site.com/wp-json/wp/v2/posts。 “Access-Control-Allow-Origin”标头的值“http://null”不等于提供的原点。 因此，不允许访问 Origin 'null'。

当我使用带有 GET 方法的 Postman 时，它工作正常。

问题出在哪里？

var app = new Vue({
  el: '#app',
  data: {
    posts: [],
  },
  mounted: function() {
    this.getPosts()
  },
  methods: {
    getPosts: function() {
      var app = this

      axios.get('http://my-wordpress-site.com/wp-json/wp/v2/posts')
      .then(function (response) {
        app.posts = response.data.title.rendered
      })
      .catch(function (error) {
        console.log(error)
      })
    }
  }
});

<div id="app">
  <div class="section">
    <ul>
      <li v-for="post in posts">{{ post }}</li>
    </ul>
    <h3></h3>
  </div>
</div>

Answer 1

我通过在 wp-includes/rest-api.php 文件中更改一行来解决它，
在 rest_send_cors_headers() 函数中：

header( 'Access-Control-Allow-Origin: *');