Plugin receiving a 404 from deployed Strapi API (Heroku + Postgres)

[ericwindmill]

• I've successfully deployed strapi to heroku (using postgresql)

• I have updated all permissions on the deployed site to accept client requests

• I can successfully hit the endpoints in my browser (so I know the permissions work)

• BUT when I run my gatsby site (via gatsby develop or. gatsby build), gatsby-source-strapi returns a 404

• I can see gatsby is hitting the correct URL when it starts spinning up.

---

using gatsby-source-strapi ^0.0.12

plugin config

    {
      resolve: 'gatsby-source-strapi',
      options: {
        apiURL: process.env.API_URL || "http://localhost:1337",
        contentTypes: [`tutorial`, `lesson`, `user`, `tag`, `blog-post`],
        singleTypes: [`table-of-contents`],
        queryLimit: 100,
      },
    },

My user permissions in production:

output from gatsby build

success open and validate gatsby-configs - 0.041s
success load plugins - 0.520s
success onPreInit - 0.012s
success delete html and css files from previous builds - 0.013s
success initialize cache - 0.006s
success copy gatsby files - 0.036s
success onPreBootstrap - 0.007s
success createSchemaCustomization - 0.007s
info Starting to fetch data from Strapi - https://flutter-by-example-strapi.herokuapp.com/tutorials?_limit=100
info Starting to fetch data from Strapi - https://flutter-by-example-strapi.herokuapp.com/lessons?_limit=100
info Starting to fetch data from Strapi - https://flutter-by-example-strapi.herokuapp.com/users?_limit=100
info Starting to fetch data from Strapi - https://flutter-by-example-strapi.herokuapp.com/tags?_limit=100
info Starting to fetch data from Strapi - https://flutter-by-example-strapi.herokuapp.com/blog-posts?_limit=100
info Starting to fetch data from Strapi - https://flutter-by-example-strapi.herokuapp.com/table-of-contents?_limit=100

 ERROR #11321  PLUGIN

"gatsby-source-strapi" threw an error while running the sourceNodes lifecycle:

Request failed with status code 404



  Error: Request failed with status code 404
  
  - createError.js:16 createError
    [flutter_by_example_static]/[axios]/lib/core/createError.js:16:15
  
  - settle.js:18 settle
    [flutter_by_example_static]/[axios]/lib/core/settle.js:18:12
  
  - http.js:202 IncomingMessage.handleStreamEnd
    [flutter_by_example_static]/[axios]/lib/adapters/http.js:202:11
  
  - next_tick.js:63 process._tickCallback
    internal/process/next_tick.js:63:19
  

not finished source and transform nodes - 0.625s
not finished Fetched Strapi Data - 0.601s

---

Feel free to visit any of those links that it's fetching data from. In my browser, I can see the JSON response. So, a 404 makes no sense here. Have I configured something wrong? Is there some sort of permissions issue that I'm missing?

[knhn1004]

I think maybe you got something wrong with the API_URL environment variable. Because as for me, I made this mistake. I added an extra \ at the end of my heroku strapi app url and leads to it fetching from the wrong endpoints.

So make sure to check your API_URL if it has any trailing \ or / which could lead to the problem

[jaljo]

@ericwindmill did you finally find this out ? I'm running in exactl the same problem !

[catalina-cimpanu]

I also had this problem, and already in development, not in production :)) I'm afraid of what's gonna happen in production :D

I found a little workaround: I had several contentTypes and one singleType, and I managed to fetch the data after having some entries in all the required fields (in strapi, in the singleType as well as in contentTypes).

Ofc, check first that everything's correct, as @knhn1004 said. I ran into problems so many times because of a comma or some extra character.

There is also an issued opened, I'm gonna follow up on that: https://github.com/strapi/gatsby-source-strapi/issues/145

[NikhilT27]

Hi, if you have given proper permission in strapi-heroku (Role and Permission - findone and find). And in gatsby-config-> gatsby-source-strapi -> used apiURL: "YOUR_STRAPI_NAME.herokuapp.com",(without any / or \). And its giving query result properly.

Then JUST change :- "queryLimit: 5000" (default is queryLimit: 1000) in gatsby-source-strapi.

It worked for me. ;)

Try changing queryLimit value to some higher value.

[CalebYeboah27]

Hi, if you have given proper permission in strapi-heroku (Role and Permission - findone and find). And in gatsby-config-> gatsby-source-strapi -> used apiURL: "YOUR_STRAPI_NAME.herokuapp.com",(without any / or ). And its giving query result properly.

Then JUST change :- "queryLimit: 5000" (default is queryLimit: 1000) in gatsby-source-strapi.

It worked for me. ;)

Try changing queryLimit value to some higher value.

Implementing you solution worked but I wasn't able to query the data using GraphiQl. I kept getting this error message: { "message": "Failed to fetch", "stack": "TypeError: Failed to fetch" }

Could this be as a result of Cross Origin Request, if yes, how do I fix it?

[richardgohcr]

I faced the same error, and after much debugging, I found out that one of my endpoints was not working as expected.

In my case, the global single type was not working correctly, not because I had configured any wrong permissions, but because my fields for the Global single type was empty.

After adding some content to the fields. It started working as usual again.

Hence I suggest for you to click into each of your endpoint manually to check if they are working as expected.

info Starting to fetch data from Strapi - https://myapp.herokuapp.com/articles?_limit=5000 info Starting to fetch data from Strapi - https://myapp.herokuapp.com/categories?_limit=5000 info Starting to fetch data from Strapi - https://myapp.herokuapp.com/writers?_limit=5000 info Starting to fetch data from Strapi - https://myapp.herokuapp.com/homepage?_limit=5000 info Starting to fetch data from Strapi - https://myapp.herokuapp.com/global?_limit=5000

Then check your permissions. Lastly, check your content types to make sure those with required fields are filled. If everything else doesn't work. Then I have no idea.

[NikhilT27]

Only provide valid contentTypes (which returns data, non-empty and has public access permission) in gatsby-config.js. And higher value in queryLimit. It should work, I never faced CROS while working on heroku, strapi and gatsby.

[BriantAnthony]

Another valuable note. You can set your limit as an env variable and have it conditionally render all records from your API if no limit is set like below:

queryLimit: process.env.STRAPI_LIMIT ? process.env.STRAPI_LIMIT : -1,

[jbcrestot]

Hello,

I came across the same error while not using Heroku, maybe it can help.

My issues came from 2 points :

• I added /graphql at the end of my production URL http://myserverip:1337 ~/graphql~
• I used an read-only API token instead of a full-access token from strapi

good luck

[moonmeister]

Thanks for your interest in this project. This plugin is moving into the Gatsby User Collective and this repo will be archived. Please open an issue in that repository, submit a PR if you'd like to see this implemented, or join us on Discord if you have questions!