1- <?php if (!$ fullGraphiQL?>
1+ <?php if (!$ fullGraphiQL?>
22 <style>
33 .AdminThemeDefault #graphiql {
44 margin-top: 30px;
3737<?php endif ; ?>
3838<div id="graphiql">Loading...</div>
3939<script>
40- /**
41- * The below code is a copy from
42- * https://github.com/graphql/graphiql/blob/master/packages/graphiql-examples/cdn/index.html
43- * The only thing that's changed is the graphiql request url and added an X-Requested-With header.
44- */
45- // Parse the search string to get url parameters.
46- var search = window.location.search;
47- var parameters = {};
48- search.substr(1).split('&').forEach(function (entry) {
49- var eq = entry.indexOf('=');
50- if (eq >= 0) {
51- parameters[decodeURIComponent(entry.slice(0, eq))] =
52- decodeURIComponent(entry.slice(eq + 1));
53- }
54- });
55- // If variables was provided, try to format it.
56- if (parameters.variables) {
57- try {
58- parameters.variables =
59- JSON.stringify(JSON.parse(parameters.variables), null, 2);
60- } catch (e) {
61- // Do nothing, we want to display the invalid JSON as a string, rather
62- // than present an error.
63- }
64- }
65- // When the query and variables string is edited, update the URL bar so
66- // that it can be easily shared.
67- function onEditQuery(newQuery) {
68- parameters.query = newQuery;
69- updateURL();
70- }
71- function onEditVariables(newVariables) {
72- parameters.variables = newVariables;
73- updateURL();
74- }
75- function onEditOperationName(newOperationName) {
76- parameters.operationName = newOperationName;
77- updateURL();
78- }
79- function updateURL() {
80- var newSearch = '?' + Object.keys(parameters).filter(function (key) {
81- return Boolean(parameters[key]);
82- }).map(function (key) {
83- return encodeURIComponent(key) + '=' +
84- encodeURIComponent(parameters[key]);
85- }).join('&');
86- history.replaceState(null, null, newSearch);
87- }
88- // Defines a GraphQL fetcher using the fetch API. You're not required to
89- // use fetch, and could instead implement graphQLFetcher however you like,
90- // as long as it returns a Promise or Observable.
91- function graphQLFetcher(graphQLParams) {
92- // When working locally, the example expects a GraphQL server at the path /graphql.
93- // In a PR preview, it connects to the Star Wars API externally.
94- // Change this to point wherever you host your GraphQL server.
95- return fetch(config.ProcessGraphQL.GraphQLServerUrl, {
96- method: 'post',
97- headers: {
98- 'Accept': 'application/json',
99- 'Content-Type': 'application/json',
100- 'X-Requested-With': 'XMLHttpRequest',
40+ function graphQLFetcher(graphQLParams, options ) {
41+ const headers = options.headers || {};
42+ return fetch(
43+ window.config?.ProcessGraphQL?.GraphQLServerUrl || '',
44+ {
45+ method: 'post',
46+ headers: Object.assign({
47+ Accept: 'application/json',
48+ 'Content-Type': 'application/json',
49+ 'X-Requested-With': 'XMLHttpRequest',
50+ }, headers),
51+ body: JSON.stringify(graphQLParams),
52+ credentials: 'include',
10153 },
102- body: JSON.stringify(graphQLParams),
103- credentials: 'include',
104- }).then(function (response) {
105- return response.text();
106- }).then(function (responseBody) {
107- try {
108- return JSON.parse(responseBody);
109- } catch (error) {
110- return responseBody;
111- }
54+ ).then(function (response) {
55+ return response.json().catch(function () {
56+ return response.text();
57+ });
11258 });
11359 }
114- // Render <GraphiQL /> into the body.
115- // See the README in the top level of this module to learn more about
116- // how you can customize GraphiQL by providing different values or
117- // additional child elements.
60+
11861 ReactDOM.render(
11962 React.createElement(GraphiQL, {
12063 fetcher: graphQLFetcher,
121- query: parameters.query,
122- variables: parameters.variables,
123- operationName: parameters.operationName,
124- onEditQuery: onEditQuery,
125- onEditVariables: onEditVariables,
12664 defaultVariableEditorOpen: true,
127- onEditOperationName: onEditOperationName
12865 }),
129- document.getElementById('graphiql')
66+ document.getElementById('graphiql'),
13067 );
13168</script>
0 commit comments