feat(gatsby-source-wordpress): allow users to obtain JWT Token to make authenticated requests

[ghost]

This fixes #6879.

[pieh]

Something is wrong with formatting here - seems like you pasted built file to source file? Changes itself are fine, but formatting need to be fixed

[ghost]

@pieh Whoops! I noticed that I accidently worked on the built file, pasted it into the source file, saw no linting errors and assumed it was fine. I'm gonna fix that.

[pieh]

Hmmm, just reading more about it - we should hit /wp-json/jwt-auth/v1/token to grab a token to use (similiar to what we use for wp.com hosting) and not set this token in config as it will expire?

[ghost]

We could do so, too. I'll look into it and try to implement getting the token as well.

[pieh]

We could do so, too. I'll look into it and try to implement getting the token as well.

Please check how this is done for wordpress.com:

gatsby/packages/gatsby-source-wordpress/src/fetch.js

Lines 157 to 184 in c3910a5

	/**
	* Gets wordpress.com access token so it can fetch private data like medias :/
	*
	* @returns
	*/
	async function getWPCOMAccessToken(_auth) {
	let result
	const oauthUrl = `https://public-api.wordpress.com/oauth2/token`
	try {
	let options = {
	url: oauthUrl,
	method: `post`,
	data: querystring.stringify({
	client_secret: _auth.wpcom_app_clientSecret,
	client_id: _auth.wpcom_app_clientId,
	username: _auth.wpcom_user,
	password: _auth.wpcom_pass,
	grant_type: `password`,
	}),
	}
	result = await axios(options)
	result = result.data.access_token
	} catch (e) {
	httpExceptionHandler(e)
	}
	return result
	}

This probably will be very similar for jwt-authentication-for-wp-rest-api plugin (maybe same function for getting access token can work for both)

[ghost]

@pieh Thanks! I have already found that function as a starting point. 👍

[watzing]

Thanks for this! We need to expose drafts for a preview server. I'm struggling to reference this pull request in my package json to begin using it now, is that even possible? Appreciate if someone can point me in the right direction. Cheers.

[pieh]

@watzing it's not possible to reference PR like that, but you can npm pack inside packages/gatsby-source-wordpress to create .tgz file that you can reference in your project (either upload it somewhere or commit to your repo)

[pieh]

@watzing also one thing - this adds support for jwt authorization - but it doesn't change endpoints that this plugin use.

F.e. we grab posts using /wp-json/wp/v2/posts route (which even with authorization will only show published posts). To get also drafts we would need to use /wp-json/wp/v2/posts?status=any or /wp-json/wp/v2/posts?status=publish,future,draft,pending (not really that familiar with some available options that wp-json shows):

publish, future, draft, pending, private, trash, auto-draft, inherit, request-pending, request-confirmed, request-failed, request-completed, any

But right now wordpress plugin doesn't support applying filters like that - this would need to be implemented separately

[pieh]

@openmedi I thought (hoped) that grabbing token function/request wouldn't need special cases like that. I think it makes sense to have separate functions after all for wp.com on jwt plugin. Sorry for adding more work :(

[watzing]

but you can npm pack inside packages/gatsby-source-wordpress to create .tgz

@pieh Thanks for the help, I'll give that a go.

But right now wordpress plugin doesn't support applying filters like that - this would need to be implemented separately

Ahh, I thought I would be able to add the filters to the includedRoutes config item - I'll dig a bit deeper into the plugin code

[pieh]

Ahh, I thought I would be able to add the filters to the includedRoutes config item - I'll dig a bit deeper into the plugin code

includedRoutes only filters routes we get from main /wp-json endpoint (it can't add new routes).

Check https://github.com/gatsbyjs/gatsby/blob/master/packages/gatsby-source-wordpress/src/fetch.js in particular getPages which is function that actually make content requests - we would want to modify this

gatsby/packages/gatsby-source-wordpress/src/fetch.js

Lines 302 to 305 in a55bc13

	url: `${url}?${querystring.stringify({
	per_page: _perPage,
	page: page,
	})}`,

to apply status filter. But we would only do this for content types (posts, pages and any custom post types) and not for other endpoints (tags, categories, media/images(?), users/authors, ACF (if someone is using that)). And also we would only want to apply that filter if user want us too (if you apply this filter without authorization you will get 400 forbidden response)

---edit:
sorry @openmedi for hijacking this PR comments. @watzing we should move our discussion elsewhere - if you will have further questions please create new issue and reference our comments here

[ghost]

What do you think, @pieh?

[pieh]

I will be looking to test it locally today, already created wordpress instance with JWT plugin.

One thing that I think we could simplify is change

    if (_useJWT && _accessToken) {
      options.headers = {
        Authorization: `Bearer ${_accessToken}`,
      }
    }

    if (_hostingWPCOM && _accessToken) {
      options.headers = {
        Authorization: `Bearer ${_accessToken}`,
      }
    }

to just

    if (_accessToken) {
      options.headers = {
        Authorization: `Bearer ${_accessToken}`,
      }
    }

We want to apply authorization header same way if there is any access token and at that point it doesn't matter if it's wp.com or site with jwt plugin (there are 2 places where we can change that)

[ghost]

@pieh Alright. I implemented the changes that you suggested.

[pieh]

I think we can also get away with explicit useJWT flag (if user has defined auth.jwt_user and/or auth.jwt_pass - I'll just apply that change and get this merged in (already checked with my test wordpress instance and working as expected :) )

[pieh]

@openmedi enjoy first PR against your gatsby fork :) https://github.com/openmedi/gatsby/pull/1

[pieh]

Thanks @openmedi!

[sarahannnicholson]

---edit:
sorry @openmedi for hijacking this PR comments. @watzing we should move our discussion elsewhere - if you will have further questions please create new issue and reference our comments here

Created a new feature request for adding drafted content #10982