From 1965d1663135b880b9774bca2630260e6f28d198 Mon Sep 17 00:00:00 2001 From: ilanap Date: Thu, 4 Jan 2018 11:34:59 +0200 Subject: Replace restful-js with Axios Change-Id: If47c5b7708885e84d632255557543d292f3ccd69 Issue-ID: SDC-869 Signed-off-by: ilanap --- .../src/nfvo-utils/ErrorResponseHandler.js | 22 +-- openecomp-ui/src/nfvo-utils/RestAPIUtil.js | 188 ++++++++++++--------- openecomp-ui/src/nfvo-utils/ShowFileSaveDialog.js | 49 ++++++ 3 files changed, 164 insertions(+), 95 deletions(-) create mode 100644 openecomp-ui/src/nfvo-utils/ShowFileSaveDialog.js (limited to 'openecomp-ui/src/nfvo-utils') diff --git a/openecomp-ui/src/nfvo-utils/ErrorResponseHandler.js b/openecomp-ui/src/nfvo-utils/ErrorResponseHandler.js index d58a2454b6..146d5285d9 100644 --- a/openecomp-ui/src/nfvo-utils/ErrorResponseHandler.js +++ b/openecomp-ui/src/nfvo-utils/ErrorResponseHandler.js @@ -1,17 +1,17 @@ -/*! - * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. +/* + * Copyright © 2016-2017 European Support Limited * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * - * http://www.apache.org/licenses/LICENSE-2.0 + * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express - * or implied. See the License for the specific language governing - * permissions and limitations under the License. + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. */ import store from 'sdc-app/AppStore.js'; import React from 'react'; @@ -54,15 +54,15 @@ function parseATTExceptionObject(responseJSON) { return {title, msg}; } -var errorResponseHandler = (xhr/*, textStatus, errorThrown*/) => { +var errorResponseHandler = (error) => { let errorData; - if (xhr.responseJSON) { - errorData = parseATTExceptionObject(xhr.responseJSON); + if (error.data) { + errorData = parseATTExceptionObject(error.data); } else { errorData = { - title: xhr.statusText, - msg: xhr.responseText, + title: error.statusText, + msg: error.responseText, }; } store.dispatch({ diff --git a/openecomp-ui/src/nfvo-utils/RestAPIUtil.js b/openecomp-ui/src/nfvo-utils/RestAPIUtil.js index c878c9e673..01819844c7 100644 --- a/openecomp-ui/src/nfvo-utils/RestAPIUtil.js +++ b/openecomp-ui/src/nfvo-utils/RestAPIUtil.js @@ -1,45 +1,70 @@ -/*! - * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. +/* + * Copyright © 2016-2017 European Support Limited * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * - * http://www.apache.org/licenses/LICENSE-2.0 + * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express - * or implied. See the License for the specific language governing - * permissions and limitations under the License. + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. */ -import {RestfulAPI} from 'restful-js'; import uuid from 'uuid-js'; import md5 from 'md5'; +import axios from 'axios'; import store from 'sdc-app/AppStore.js'; import {actionTypes as LoaderConstants} from 'nfvo-components/loader/LoaderConstants.js'; import Configuration from 'sdc-app/config/Configuration.js'; import errorResponseHandler from './ErrorResponseHandler.js'; +//methods +const GET = 'GET'; +const POST = 'POST'; +const PUT = 'PUT'; +const DELETE = 'DELETE'; + +// content-types +const APPLICATION_JSON = 'application/json'; +const MULTIPART_FORM_DATA = 'multipart/form-data'; + +const BINARY = 'binary'; + const AUTHORIZATION_HEADER = 'X-AUTH-TOKEN'; const STORAGE_AUTH_KEY = 'sdc-auth-token'; const REQUEST_ID_HEADER = 'X-ECOMP-RequestID'; const CONTENT_MD5_HEADER = 'Content-MD5'; +function applySecurity(options, data) { + let headers = options.headers || (options.headers = {}); + let authToken = localStorage.getItem(STORAGE_AUTH_KEY); + if (authToken) { + headers[AUTHORIZATION_HEADER] = authToken; + } -function applyMD5Header(options, data) { + let attApiHeaders = Configuration.get('ATTApiHeaders'), + attUidHeader = attApiHeaders && attApiHeaders.userId; + if (attUidHeader) { + headers[attUidHeader.name] = attUidHeader.value; + } + + headers[REQUEST_ID_HEADER] = uuid.create().toString(); if (options.md5) { let headers = options.headers; headers[CONTENT_MD5_HEADER] = window.btoa(md5(JSON.stringify(data)).toLowerCase()); } } -function handleResponse(xhr) { - let authToken = xhr.getResponseHeader(AUTHORIZATION_HEADER); - let prevToken = this && this.headers && this.headers[AUTHORIZATION_HEADER]; + +function handleSuccess(responseHeaders, requestHeaders) { + let authToken = responseHeaders[AUTHORIZATION_HEADER]; + let prevToken = requestHeaders && requestHeaders[AUTHORIZATION_HEADER]; if (authToken && authToken !== prevToken) { if (authToken === 'null') { localStorage.removeItem(STORAGE_AUTH_KEY); @@ -49,94 +74,89 @@ function handleResponse(xhr) { } } +class RestAPIUtil { + handleRequest(url, type, options = {}, data){ + if (DEBUG) { + console.log('axios --> Making REST call (' + type + '): ' + url); + } -class RestAPIUtil extends RestfulAPI { + applySecurity(options, data); - applySecurity(options, data) { - let headers = options.headers || (options.headers = {}); + // TODO see ig necessary or in transformrequest funtion + if (type === POST || type === PUT) { + if (data instanceof FormData) { + options.headers.contentType = MULTIPART_FORM_DATA; + } + else { + options.headers.contentType = APPLICATION_JSON; +// config.data = JSON.stringify(data); + } - let authToken = localStorage.getItem(STORAGE_AUTH_KEY); - if (authToken) { - headers[AUTHORIZATION_HEADER] = authToken; + } else { + data = null; } - let attApiHeaders = Configuration.get('ATTApiHeaders'), - attUidHeader = attApiHeaders && attApiHeaders.userId; - if (attUidHeader) { - headers[attUidHeader.name] = attUidHeader.value; + let config = { + method: type, + url: url, + headers : options.headers, + data : data + }; + + store.dispatch({type: LoaderConstants.SEND_REQUEST, url: url}); + if (options.dataType === BINARY) { + config.responseType = 'arraybuffer'; + return axios(config). + then(result => { + store.dispatch({type: LoaderConstants.RECEIVE_RESPONSE, url : result.config.url}); + return ({ + blob : new Blob([result.data] ), + headers : result.headers + }); + }).catch(error => { + store.dispatch({type: LoaderConstants.RECEIVE_RESPONSE, url : error.config.url}); + errorResponseHandler(error.response); }); + } else { + return axios(config). + then(result => { + store.dispatch({type: LoaderConstants.RECEIVE_RESPONSE, url : result.config.url}); + handleSuccess(result.headers, result.config.headers); + return result.data; + }).catch(error => { + store.dispatch({type: LoaderConstants.RECEIVE_RESPONSE, url : error.config.url}); + errorResponseHandler(error.response); + throw {responseJSON: error.response.data}; + }); } - headers[REQUEST_ID_HEADER] = uuid.create().toString(); - applyMD5Header(options, data); } - handleRequest(url, type, options = {}, data){ - let success = options.success; - options.success = function (resp, textStatus, xhr) { - handleResponse.call(this, xhr); - if (success) { - success.call(options.context, {...resp}, textStatus, xhr); - } - }; + fetch(url, options) { + return this.handleRequest(url, GET, options); + } - if (DEBUG) { - console.log('--> Making REST call (' + type + '): ' + url); - } - return super.handleRequest(url, type, options, data); + get(url, options) { + return this.fetch(url, options); } -} + post(url, data, options) { + return this.handleRequest(url, POST, options, data); + } -const instance = new RestAPIUtil({ - errorResponseHandler, - ajaxStartHandler: () => store.dispatch({type: LoaderConstants.SHOW}), - ajaxStopHandler: () => store.dispatch({type: LoaderConstants.HIDE}) -}); - -// jQuery binary transport to download files through XHR -// http://www.henryalgus.com/reading-binary-files-using-jquery-ajax/ -// https://github.com/henrya/js-jquery/tree/master/BinaryTransport -instance.$.ajaxTransport('+binary', function (options/*, originalOptions , jqXHR*/) { - // check for conditions and support for blob / arraybuffer response type - if (window.FormData && ((options.dataType && (options.dataType === 'binary')) || - (options.data && ((window.ArrayBuffer && options.data instanceof ArrayBuffer) || - (window.Blob && options.data instanceof Blob)))) - ) { - return { - // create new XMLHttpRequest - send: function (headers, callback) { - // setup all letiables - let xhr = new XMLHttpRequest(), - url = options.url, - type = options.type, - async = options.async || true, - // blob or arraybuffer. Default is blob - dataType = options.responseType || 'blob', - data = options.data || null, - username = options.username || null, - password = options.password || null; - - xhr.addEventListener('load', function () { - let data = {}; - data[options.dataType] = xhr.response; - // make callback and send data - callback(xhr.status, xhr.statusText, data, xhr.getAllResponseHeaders()); - }); + put(url, data, options) { + return this.handleRequest(url, PUT, options, data); + } - xhr.open(type, url, async, username, password); + destroy(url, options) { + return this.handleRequest(url, DELETE, options); + } + + + +} + +const instance = new RestAPIUtil(); - // setup custom headers - for (let i in headers) { - xhr.setRequestHeader(i, headers[i]); - } - xhr.responseType = dataType; - xhr.send(data); - }, - abort: function () { - } - }; - } -}); export default instance; diff --git a/openecomp-ui/src/nfvo-utils/ShowFileSaveDialog.js b/openecomp-ui/src/nfvo-utils/ShowFileSaveDialog.js new file mode 100644 index 0000000000..bddd49c700 --- /dev/null +++ b/openecomp-ui/src/nfvo-utils/ShowFileSaveDialog.js @@ -0,0 +1,49 @@ +/* + * Copyright © 2016-2017 European Support Limited + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +function getTimestampString() { + let date = new Date(); + let z = n => n < 10 ? '0' + n : n; + return `${date.getFullYear()}-${z(date.getMonth())}-${z(date.getDate())}_${z(date.getHours())}-${z(date.getMinutes())}`; +} + + +export default function showFileSaveDialog({blob, headers, defaultFilename, addTimestamp}) { + let filename; + let contentDisposition = headers['content-disposition'] ? headers['content-disposition'] : ''; + let match = contentDisposition ? contentDisposition.match(/filename=(.*?)(;|$)/) : false; + if (match) { + filename = match[1]; + } else { + filename = defaultFilename; + } + + if (addTimestamp) { + filename = filename.replace(/(^.*?)\.([^.]+$)/, `$1_${getTimestampString()}.$2`); + } + + let link = document.createElement('a'); + let url = URL.createObjectURL(blob); + link.href = url; + link.download = filename; + link.style.display = 'none'; + document.body.appendChild(link); + link.click(); + setTimeout(function(){ + document.body.removeChild(link); + URL.revokeObjectURL(url); + }, 0); +}; -- cgit 1.2.3-korg