This article is about fixing Request failed with status code 404 in Strapi Strapi-Examples
  • 25-Jan-2023
Lightrun Team
Author Lightrun Team
Share
This article is about fixing Request failed with status code 404 in Strapi Strapi-Examples

Request failed with status code 404 in Strapi Strapi-Examples

Lightrun Team
Lightrun Team
25-Jan-2023

Explanation of the problem

The problem being reported is that the GraphQL query is not working when using the gatsby-source-strapi plugin with the specified versions of Node.js, npm, Strapi, and operating system. The specific example being referred to is the “allowaccess” section of the “Building a Static Website Using Gatsby and Strapi” blog post on the Strapi website.

Paragraph 2: The current behavior is that when the command “gatsby develop” is run, the following error message is displayed:

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
    [portfolio_v4]/[gatsby-source-strapi]/[axios]/lib/core/createError.js:16:15
  - settle.js:18 settle
    [portfolio_v4]/[gatsby-source-strapi]/[axios]/lib/core/settle.js:18:12
  - http.js:202 IncomingMessage.handleStreamEnd
    [portfolio_v4]/[gatsby-source-strapi]/[axios]/lib/adapters/http.js:202:11
  - task_queues.js:84 processTicksAndRejections
    internal/process/task_queues.js:84:21

Additionally, when trying to access http://localhost:8000/___graphql, the expected behavior is that the method allStrapiblogs would be present, however it is not. It is also mentioned that authentication has been set to public. The author is not providing solution, but only describing the problem.

Troubleshooting with the Lightrun Developer Observability Platform

Getting a sense of what’s actually happening inside a live application is a frustrating experience, one that relies mostly on querying and observing whatever logs were written during development.
Lightrun is a Developer Observability Platform, allowing developers to add telemetry to live applications in real-time, on-demand, and right from the IDE.

  • Instantly add logs to, set metrics in, and take snapshots of live applications
  • Insights delivered straight to your IDE or CLI
  • Works where you do: dev, QA, staging, CI/CD, and production

Start for free today

Problem solution for Request failed with status code 404 in Strapi Strapi-Examples

The error message “Request failed with status code 404” is indicating that the server is unable to find the requested resource. This error can occur due to a number of reasons such as a misconfigured plugin, incorrect endpoint URL, or missing dependencies. To troubleshoot this issue, you can try the following steps:

  1. Check that the gatsby-source-strapi plugin is correctly configured in your gatsby-config.js file. Ensure that the plugin is installed and that the endpoint URL is correct.
  2. Verify that the Strapi server is running and that the endpoint URL is accessible. You can do this by visiting the endpoint URL in your browser and checking for a response from the server.
  3. Ensure that the Strapi API is correctly configured to allow public access to the requested resource. This can be done by checking the permissions and roles settings in the Strapi admin panel.
  4. Make sure that you have all the necessary dependencies installed and updated.
  5. Check the Strapi logs for more information about the error.
  6. If all the above steps fail, you can try deleting the node_modules folder and then running npm install again. This will ensure that you have the latest versions of all dependencies.

It’s also important to note that the problem may be related to the specific version of Strapi you are using. If possible, try updating to the latest version of Strapi and see if that resolves the issue.

Please note that these are general troubleshooting steps and the solution may vary depending on the specific configuration of your project.

Other popular problems with Strapi Strapi-Examples

Problem: “Endpoint URL not found” error when trying to access the Strapi API

When trying to access the Strapi API through the endpoint URL, some users may encounter an error message that states “Endpoint URL not found”. This error indicates that the server is unable to locate the requested resource and is typically caused by a misconfigured endpoint URL or a problem with the Strapi server.

Solution:

To resolve this issue, the first step is to verify that the endpoint URL is correct. Double-check that the URL specified in the gatsby-config.js file is the correct endpoint for your Strapi server. Next, ensure that the Strapi server is running and that the endpoint URL is accessible. This can be done by visiting the endpoint URL in a web browser and checking for a response from the server. If the Strapi server is running and the endpoint URL is correct, then the problem may be related to a plugin or middleware that is blocking access to the API. In this case, you can try disabling any installed plugins or middleware to see if that resolves the issue.

Problem: “CORS policy” error when trying to access the Strapi API

When trying to access the Strapi API, some users may encounter a “CORS policy” error. This error occurs when the browser blocks a request to a different origin (domain) than the one the user is visiting. By default, the Strapi API has CORS enabled, but if the user has disabled it or the server is running on a different origin, this error can occur.

Solution:

To resolve this issue, you can enable CORS on the server by installing the cors plugin. You can do this by running the following command: npm install cors Then, you need to add the following code in the config/environments/development/security.js file

module.exports = ({ env }) => ({
  cors: {
    enabled: true,
    origin: ['http://localhost:3000'],
    methods: ['GET', 'HEAD', 'PUT', 'PATCH', 'POST', 'DELETE'],
    headers: ['Content-Type'],
  },
});

Problem: “Unauthorized” error when trying to access the Strapi API

When trying to access the Strapi API, some users may encounter an “Unauthorized” error. This error occurs when the user is not authorized to access the requested resource. The Strapi API uses a role-based authentication system, and this error indicates that the user does not have the necessary permissions to access the requested resource.

Solution:

To resolve this issue, ensure that the user has the correct role assigned in the Strapi admin panel. If you want to access the Strapi API publicly, you can set the permissions for the resource to “Public” or “Authenticated” in the Strapi admin panel. Alternatively, you can use a token-based authentication system, such as JSON Web Tokens (JWT) to authenticate requests to the Strapi API. You can find more information on how to configure authentication for the Strapi API in the official documentation.

A brief introduction to Strapi Strapi-Examples

Strapi is an open-source content management framework that allows developers to easily build and manage APIs. It is built on top of Node.js, and provides a simple, yet powerful set of features for creating and managing data models, authentication and authorization, and content management. Strapi also provides a user-friendly admin panel that allows non-technical users to manage and update content.

One of the key features of Strapi is its support for GraphQL, which allows for more efficient and flexible data querying. Additionally, it comes with a set of pre-built plugins and integrations, such as support for MongoDB, PostgreSQL, and MySQL, that can be easily installed and configured to work with your application. Strapi also provides a set of Strapi-Examples which are pre-built applications that demonstrate how to use Strapi to build a variety of different types of applications. These examples cover a wide range of use cases, such as e-commerce, blogs, and headless CMS, and can serve as a great starting point for building your own Strapi-powered applications.

Most popular use cases for Strapi Strapi-Examples

  1. Strapi Strapi-Examples can be used to quickly set up and prototype a RESTful API for your application. The examples provide pre-built models, controllers, and routes for common functionality such as user authentication and content management, which can be easily modified to fit the needs of your specific application.
  2. Strapi Strapi-Examples can be used to build a headless CMS for your website or mobile app. By separating the content management and presentation layers, a headless CMS allows for more flexibility in the front-end development and can be easily integrated with a variety of different frameworks and technologies.
  3. Strapi Strapi-Examples can be used to build a GraphQL API for your application. The examples provide pre-built GraphQL schemas and resolvers, which can be easily extended and customized to fit the needs of your specific application.
const { buildSchema } = require("graphql");

const schema = buildSchema(`
  type Query {
    allStrapiBlogs: [StrapiBlog]
  }
  type StrapiBlog {
    id: ID
    title: String
    content: String
  }
`);

This code block is an example of a GraphQL schema for a Strapi blog, which can be used to query a list of blog posts.

Share

It’s Really not that Complicated.

You can actually understand what’s going on inside your live applications.

Try Lightrun’s Playground

Lets Talk!

Looking for more information about Lightrun and debugging?
We’d love to hear from you!
Drop us a line and we’ll get back to you shortly.

By submitting this form, I agree to Lightrun’s Privacy Policy and Terms of Use.