[FIXED] How to use json api specs in ajax?

Issue

How should my data be and how can I use JSON API specification with ajax to fetch data from an endpoint. Thanks in advance

is the format of my data correct?

photo link:https://drive.google.com/file/d/1j6At0x3kX3wAQ178IBVG4tOHOMUrpxcw/view?usp=drivesdk

Solution

The format of the data as shown in the screenshot included in your comment is not a valid JSON:API document. A JSON:API document must follow a specific schema as described in the JSON:API specification.

For example the JSON shown in your screenshot validates this requirement of the specification:

A document MUST contain at least one of the following top-level members:

• data: the document’s “primary data”
• errors: an array of error objects
• meta: a meta object that contains non-standard meta-information.

https://jsonapi.org/format/#document-top-level

Also each object representing a resource violates several requirements of the JSON:API specification, for example:

A resource object MUST contain at least the following top-level members:

• id
• type

[...]

In addition, a resource object MAY contain any of these top-level members:

• attributes: an attributes object representing some of the resource’s data.
• relationships: a relationships object describing relationships between the resource and other JSON:API resources.
• links: a links object containing links related to the resource.
• meta: a meta object containing non-standard meta-information about a resource that can not be represented as an attribute or relationship.

https://jsonapi.org/format/#document-resource-objects

The JSON:API specification contains several examples of well-formed JSON:API documents. I would recommend to have a look at them to understand the specification better.

Answered By - jelhan

Answer Checked By - Clifford M. (PHPFixing Volunteer)