Skip to content

[Analytics] GraphQL CORS error clarification #1322

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
crwaters16 merged 2 commits into from
May 13, 2021
Merged

[Analytics] GraphQL CORS error clarification #1322

Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
231b607
edits based on stephane's PR
crwaters16 May 11, 2021
78d858d
aside type fix
crwaters16 May 11, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
9 changes: 7 additions & 2 deletions ...s/analytics/src/content/graphql-api/tutorials/build-your-own-analytics/index.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,14 +5,19 @@ order: 40

# Build your own Analytics dashboard

In this example, we're going to see how to use the GraphQL Analytics API to build your own dashboard. This tutorial walks you through building a simple line chart for your Cloudflare zone, using a bit of HTML, JavaScript, AJAX and chart.js.
In this example, we're going to see how to use the GraphQL Analytics API to build your own dashboard. This tutorial walks you through building a simple line chart for your Cloudflare zone using a bit of HTML, JavaScript, AJAX, and chart.js.

![GraphQL recipe](../static/graphQL-recipe-cacheVisual.gif)

The following code will build a page with all the requirement to fetch from GraphQL and plot the cached and uncached bandwidth for the given zone. You'll just need to enter your email address, API token, and your zone ID, and then push the `Fetch analytics` button.
The following code will build a page with all the requirements to fetch from GraphQL and plot the cached and uncached bandwidth for the given zone. You'll just need to enter your email address, API token, and your zone ID, and then push the `Fetch analytics` button.

## Code

<Aside type='note' header='Note'>

Cloudflare's [GraphQL endpoint](https://api.cloudflare.com/client/v4/graphql) does not set any CORS headers. Add an endpoint that can proxy the requests back to the API to avoid encountering CORS errors. In the following example, this hostname is referred to as **api.yourdomain.com**.
</Aside>

```html
<!DOCTYPE html>
<html>
Expand Down