Fetch wordpress posts of custom post type using the WP Rest API javascript Client (backbonejs)

Question

I am developing a reactjs backend using the WP REST API. I am now trying to take advantage of the built-in javascript client so I have installed the wpapi node package in my project (https://www.npmjs.com/package/wpapi).

I have enabled the corresponding behavior and endpoints to my CPTs:

...
'show_in_rest'       => true,
'rest_base'          => 'mycptslug',//sustituye a posts
'rest_controller_class' => 'WP_REST_Posts_Controller',
...

and they work perfectly when accessing directly (postman, jquery, browser address bar...).

When replicating the samples of the official npm wpapi module they also work as expected in my installation.

The issue is that I am unable to know how to fetch the posts of my custom post types using the clientjs provided by the wp rest api community. I have not found any working sample on a simple node project. In the official documentation there is no specific information about how to achieve this (for someone with my js skills :)).

I have already tried:

https://github.com/WP-API/WP-API/issues/1299

and follow:

https://bay-a.co.uk/wordpress-tips/wp-api-v2-tips/

but i cannot get it working (eg: Cannot read property 'models' of undefined).

Thank you for your time. I guess it is something a lot of people have already done...

Edit (suggested by Andreyco): My code is like the one pointed in the github issue:

var WPAPI = require('wpapi' );
var wp = new WPAPI({ endpoint: 'http://myurl/wp-json'});
var pI = wp.api.models.Post.extend({
                  urlRoot: 'http://myurl/wp-json/wp/v2/' + '/pi',
                             defaults: {
                                 type: 'my-cpt'
                             }
                         });
var MyPI = wp.api.collections.Posts.extend({
                           url: 'http://myurl/wp-json/wp/v2/' + 'pis',
                             model: pI
                         });

var thePI = new MyPI();

thePI.fetch({
             filter: {
                      nopaging: true
                      }
            }).done( function() {
                             thePI.each( function( mypi ) {
                                 console.log( mypi.attributes );
                             });
                         });

But it gives the following error: Uncaught TypeError: Cannot read property 'models' of undefined. Note that I hard coded the urls because the wpApiSettings constant gave me also undefined error...

Show us the code use to fetch data from WP API.

Andreyco
– Andreyco

2016-12-25 21:24:42 +00:00
Commented Dec 25, 2016 at 21:24 — Andreyco
– Andreyco, Commented Dec 25, 2016 at 21:24

K. Adam · Accepted Answer · 2017-07-12 18:05:52Z

2

Here's a direct link to the documentation that arose from the aforementioned GitHub issue: http://wp-api.org/node-wpapi/custom-routes/ That page documents how to use the wpapi library's registerRoute method to set up custom endpoint handler factories for your own custom post types.

answered Jul 12, 2017 at 18:05

K. Adam

9435 silver badges11 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

mcartur · Accepted Answer · 2016-12-26 17:14:09Z

1

Thanks to sdgluck user in github, who gave the solution.

https://github.com/WP-API/node-wpapi/issues/283

I thought the node-wpapi was a node package containing the backbone.js client of the wp rest api, and it is not. So I kept getting errors applying the backbonejs client functions to the installed node-wpapi package.

Hope it helps to any beginner.

answered Dec 26, 2016 at 17:14

mcartur

3373 silver badges14 bronze badges

Collectives™ on Stack Overflow

Fetch wordpress posts of custom post type using the WP Rest API javascript Client (backbonejs)

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related