Authenticate via javascript fetch for REST API

Hi Kevin – Thanks for writing the plugin.

Yes, the fetch request works fine when the plugin is turned off.

Also the same request via curl works fine. So this is most likely a CORS issues and am just hoping you might have tried this yourself.

The fetch request looks something like this

fetch(endpoint, {
  headers: new Headers {
    'Authenticate': 'Basic user:password'
  },
  redirect: 'follow'
})
.then(res => res.json())
.then(json => console.log(json));

Looking at the fetch documentation, I am now seeing I didn’t set a mode key value, I will try that. Will also follow up with more specific error messages.

• This reply was modified 7 years, 8 months ago by atomicadam.

I was able to resolve this – though I’m not sure I’m 100% happy with always returning 200 on a OPTIONS request (the redirect to readme.html will return a 200 in the OPTIONS preflight request). But here is the fetch request and .htaccess setup that works with Force Login turned on.

fetch(endpoint, {
      headers: new Headers({
         'Authorization': 'Basic ' + Buffer.from('user:pass').toString('base64'),
         'Content-Type': 'application/json; charset=utf-8'
  }),
  credentials: 'include',
  mode: 'cors',
  method: 'GET',
  redirect: 'follow'
})
.then(res => res.json())
.then(json => console.log(json))

and

<IfModule mod_headers.c>
Header unset Access-Control-Allow-Origin
Header always set Access-Control-Allow-Origin "http://localhost:3000"
Header always set Access-Control-Allow-Methods "POST, GET, OPTIONS, PUT, DELETE"
Header always set Access-Control-Allow-Headers "Origin,Content-Type,Accept,Authorization,X-Requested-With"
Header unset Access-Control-Allow-Credentials
Header always set Access-Control-Allow-Credentials true
</IfModule>

<IfModule mod_rewrite.c>
RewriteEngine On                  
RewriteCond %{REQUEST_METHOD} OPTIONS 
RewriteRule ^(.*)$ readme.html [QSA,L]  
</IfModule>

<LimitExcept OPTIONS>
AuthType Basic
AuthName "API Service"
AuthUserFile .htpasswd
Require valid-user
</LimitExcept>

I have not tried this with pretty URL rewrites – yet – so the endpoint looks like: http://api.site.com/?rest_route=/wp/v2/pages/2/

• This reply was modified 7 years, 8 months ago by atomicadam.
• This reply was modified 7 years, 8 months ago by atomicadam.
• This reply was modified 7 years, 8 months ago by atomicadam.