401 when trying to create a post in Wordpress API using Oauth 1.0 -

i'm trying create wordpress post through wordpress api v2, oauth 1.0 throwing 401 @ me when axios.post. when axios.get, everything's perfect , result.

i can create or delete posts through postman without problem, configures automatically. nice if copy request somehow postman , put axios code, couldn't find option.

i tried specifying header content-type application/json so:

headers: {     'content-type': 'application/json' } 

as in postman, still no change.

i'm using generator oauth signature , it's working in request pointed out. https://www.npmjs.com/package/oauth-signature

here's code , post requests:

getrequest = () => {     const requestparams = { ...this.state.parameters }     requestparams.oauth_nonce = this.generatenonce()     requestparams.oauth_timestamp = new date()       .gettime()       .tostring()       .slice(0,10)     const encodedsignature = oauthsignature.generate(       'get',       'http://localhost/wordpress-api/wp-json/wp/v2/posts/29',       requestparams,       this.state.consumersecret,       this.state.tokensecret     )      axios({       url: 'http://localhost/wordpress-api/wp-json/wp/v2/posts/29',       method: 'get',       auth: `         oauth oauth_consumer_key="${requestparams.oauth_consumer_key}",         oauth_token="${requestparams.oauth_token}",         oauth_signature_method="${requestparams.oauth_signature_method}",         oauth_timestamp="${requestparams.oauth_timestamp}",         oauth_nonce="${requestparams.oauth_nonce}",         oauth_version="${requestparams.oauth_version}",         oauth_signature="${encodedsignature}"       `     })       .then(res => {         this.setstate({           requestresponse: res         })       })   }  postrequest = (e) => {     e.preventdefault()      const postdata = {       title: this.refs.title.value,       status: 'publish',       content: this.refs.content.value,     }      const requestparams = { ...this.state.parameters }     requestparams.oauth_nonce = this.generatenonce()     requestparams.oauth_timestamp = new date()       .gettime()       .tostring()       .slice(0,10)     const encodedsignature = oauthsignature.generate(       'post',       'http://localhost/wordpress-api/wp-json/wp/v2/posts',       requestparams,       this.state.consumersecret,       this.state.tokensecret     )      axios({       url: 'http://localhost/wordpress-api/wp-json/wp/v2/posts',       method: 'post',       data: postdata,       auth: `         oauth oauth_consumer_key="${requestparams.oauth_consumer_key}",         oauth_token="${requestparams.oauth_token}",         oauth_signature_method="${requestparams.oauth_signature_method}",         oauth_timestamp="${requestparams.oauth_timestamp}",         oauth_nonce="${requestparams.oauth_nonce}",         oauth_version="${requestparams.oauth_version}",         oauth_signature="${encodedsignature}"       `     })       .then(res => {         this.setstate({           requestresponse: res         })       })   } 

finally, i've figured out what's problem. nice if wordpress api had more examples. authorization header not set.

below updated code should used in oauth 1.0 secured requests wordpress api (get, post, put, delete, replace 'post' method in oauthsignature.generate() function , axios request). checked , working properly.

just remember example tokens , secrets in component's state. should store these in backend , pass them front-end after providing credentials.

i've uploaded whole react component code, because i've learnt hard way how many small, unusable snippets of code there on internet instead of whole solution, annoyed me greatly. should more explanatory want have working example.

// dependencies import react, { component } 'react' import axios 'axios' import oauthsignature 'oauth-signature' // components import '../styles/css/moderator.css'  class moderator extends component {   constructor() {     super()     this.state = {       requestresponse: null,       parameters: {         oauth_consumer_key : 'xxxxxxxxxxxxx', // consumer_key         oauth_token : 'xxxxxxxxxxxxxxxxx', // token         oauth_signature_method : 'hmac-sha1',         oauth_timestamp : '',         oauth_nonce : '',         oauth_version : '1.0'       },       consumersecret: 'xxxxxxxxxxxxxxxxxxxxx', // consumer_secret       tokensecret: 'xxxxxxxxxxxxxxxxxxxxx', // token_secret     }   }    generatenonce = () => {     let text = ''     const possible = 'abcdefghijklmnopqrstuvwxyzabcdefghijklmnopqrstuvwxyz0123456789'     (let = 0; < 11; i++) {       text += possible.charat(math.floor(math.random() * possible.length))     }     return text   }    handlesubmit = (e) => {     e.preventdefault()      let postdata = {       title: this.refs.title.value,       status: 'publish',       content: this.refs.content.value,     }      const requestparams = { ...this.state.parameters }     requestparams.oauth_nonce = this.generatenonce() // unique identifier     requestparams.oauth_timestamp = new date()       .gettime()       .tostring()       .slice(0,10) // need first 10 digits current time     const encodedsignature = oauthsignature.generate(       'post',       'http://localhost/wordpress-api/wp-json/wp/v2/posts',       requestparams,       this.state.consumersecret,       this.state.tokensecret     )      const authorizationheader =            'oauth oauth_consumer_key="' + requestparams.oauth_consumer_key           + '",oauth_token="' + requestparams.oauth_token           + '",oauth_signature_method="' + requestparams.oauth_signature_method           + '",oauth_timestamp="' + requestparams.oauth_timestamp           + '",oauth_nonce="' + requestparams.oauth_nonce           + '",oauth_version="' + requestparams.oauth_version           + '",oauth_signature="' + encodedsignature +'"'      axios({       method: 'post',       url: 'http://localhost/wordpress-api/wp-json/wp/v2/posts',       headers: {         'accept': 'application/json',         'content-type': 'application/json',         'authorization': authorizationheader       },       data: postdata     })       .then(res => {         console.log(res)       })   }    render() {     return (       <div classname='moderator'>         <form onsubmit={this.handlesubmit}>           <label>             title             <input type='text' ref='title' />           </label><br />           <label>             content             <textarea ref='content' />           </label>           <input type='submit' value='submit' />         </form>       </div>     )   } }  export default moderator