Ajax call from external website - Response 200 but no posts

[c0derabbit]

Hi all,
I’d like to fetch blog posts into my website client-side.
When I fetch posts, I get this response:

ok: true
redirected: false
status: 200
statusText: "OK"
type: "cors"
url: "http://my_website/ghost/api/v0.1/posts/?limit=3&client_id=ghost-frontend&client_secret=MY_SECRET

And no response body, no posts. :(
I get the same response from localhost, and that’s not added to client_trusted_domains.

I have followed the recommended steps here, created an entry in client_trusted_domains table.
clients table:

id: GHOST_FE_ID
uuid: many_numbers_and_letters
name: Ghost Frontend
slug: ghost-frontend
secret: MY_SECRET
redirecton_uri: NULL
client_uri: NULL
auth_uri: NULL
logo: NULL
status: enabled
type: ua
description: NULL

created_at …etc is probably not necessary info:)

client_trusted_domains table:

id: random_generated_id
client_id: GHOST_FE_ID
trusted_domain: http://my_website

I curled the same request and got the posts no problem. Can you please help out?

Ghost version: 1.25.1
Ghost CLI: 1.8.1
Config: Ubuntu 16.04.5, mysql, running on aws ec2, t2.micro
Browser: Chrome 67.0.3396.99

[Kevin]

Hey @c0derabbit It would be useful to post the code you’re using to make the request in the browser, how you’re logging the response and so on. Without that there’s very little information here to help you.

[c0derabbit]

Hi @Kevin,
looks like a Chrome issue. I just checked the network tab in Safari (should have done that earlier, as it logs the unfinished response just like chrome does), it works fine there. So it’s most probably not Ghost-related.

RE the request, it’s just a simple fetch. But I’m actually checking the network tab for the response.

fetch(ghost.url.api('posts', {limit: 3})).then(
  res => console.warn(res),
  err => console.warn(err)
);

Thanks for your response, will post a solution here anyway once I find it.

[Kevin]

@c0derabbit if you’re using fetch then you probably want to log the response content rather than the response object:

fetch(ghost.url.api('posts', {limit: 3})).then(
 res => res.json().then(json => console.warn(json)),
 err => console.warn(err)
);

That’s a very simplistic example, you’ll need additional error checking because a “successful” request that was actually an error won’t have the res.json() method. This is a good overview of the fetch API: Serving

[c0derabbit]

Yes this is much better! Weird why it’s not even finishing the network request if I don’t call .json().
Thanks for your help