Merge pull request #4570 from influxdata/cors-fix

Handle cors feed request with fetch api

ui/src/status/actions/index.ts

@@ -8,7 +8,6 @@ import {notify} from 'src/shared/actions/notifications'
 import {notifyJSONFeedFailed} from 'src/shared/copy/notifications'
 
 import {JSONFeedData} from 'src/types'
-import {AxiosResponse} from 'axios'
 
 export enum ActionTypes {
   FETCH_JSON_FEED_REQUESTED = 'FETCH_JSON_FEED_REQUESTED',
@@ -54,7 +53,7 @@ export const fetchJSONFeedAsync = (url: string) => async (
 ): Promise<void> => {
   dispatch(fetchJSONFeedRequested())
   try {
-    const {data} = (await fetchJSONFeedAJAX(url)) as AxiosResponse<JSONFeedData>
+    const data = (await fetchJSONFeedAJAX(url)) as JSONFeedData
     // data could be from a webpage, and thus would be HTML
     if (typeof data === 'string' || !data) {
       dispatch(fetchJSONFeedFailed())

ui/src/status/apis/index.ts

@@ -1,16 +1,8 @@
-import AJAX from 'src/utils/ajax'
-import {JSONFeedData} from 'src/types'
+export const fetchJSONFeed = async (url: string) => {
+  const response = await fetch(url, {
+    method: 'GET',
+    mode: 'cors',
+  })
 
-const excludeBasepath = true // don't prefix route of external link with basepath/
-
-export const fetchJSONFeed = (url: string) =>
-  AJAX<JSONFeedData>(
-    {
-      method: 'GET',
-      url,
-      // For explanation of why this header makes this work:
-      // https://stackoverflow.com/questions/22968406/how-to-skip-the-options-preflight-request-in-angularjs
-      headers: {'Content-Type': 'text/plain; charset=UTF-8'},
-    },
-    excludeBasepath // don't prefix route of external link with basepath
-  )
+  return response.json()
+}