Merge pull request #150 from nspcc-dev/fix/122-loading_object

Error loading object

.env

@@ -3,7 +3,6 @@ REACT_APP_WC_PROJECT_ID=8e39af16af0819871be6f2da61a3a038
 
 REACT_APP_URL=https://panel.fs.neo.org/
 REACT_APP_RESTGW=https://rest.fs.neo.org/v1
-REACT_APP_HTTPGW=https://http.fs.neo.org
 
 # Mainnet NeoFS contract
 REACT_APP_NETWORK=mainnet

README.md

@@ -42,8 +42,6 @@ Set variables in `.env` file
 - `REACT_APP_URL` - Web application url
 - `REACT_APP_RESTGW` - [NeoFS REST Gateway](https://github.com/nspcc-dev/neofs-rest-gw), which we use to manage
   containers and object in neofs (control path)
-- `REACT_APP_HTTPGW` - [NeoFS HTTP Gateway](https://github.com/nspcc-dev/neofs-http-gw), which we use to get objects (
-  data path)
 - `REACT_APP_NETWORK` - Network of the Neo (might be `mainnet`, `testnet`)
 - `REACT_APP_NEOFS_ACCOUNT` - Neo3 address of the NeoFS contract
 
@@ -69,7 +67,6 @@ You need to update the parameters in the `.env` file to make it work:
 
 ```env
 REACT_APP_RESTGW=http://localhost:8090/v1
-REACT_APP_HTTPGW=http://localhost:8081
 ```
 
 # Make instructions

src/App.css

@@ -128,7 +128,7 @@ label.is-error {
 }
 
 .input_caption {
-    font-size: .75rem;
+    font-size: .75rem !important;
     font-weight: 400;
     border-left: 2px solid #ffd781;
     margin-top: 1em;

src/App.js

@@ -39,7 +39,6 @@ export const App = () => {
 
 	const [params] = useState({
 		rest_gw: process.env.REACT_APP_RESTGW ? process.env.REACT_APP_RESTGW : 'https://rest.t5.fs.neo.org/v1',
-		http_gw: process.env.REACT_APP_HTTPGW ? process.env.REACT_APP_HTTPGW : 'https://http.t5.fs.neo.org',
 	});
 
 	const [attributes, setAttributes] = useState([]);

src/Components/TreeView/TreeView.js

@@ -174,11 +174,16 @@ const File = ({
 									className="manage_icon"
 									onClick={() => {
 										onModal('loading');
-										api('GET', `${params.http_gw}/get/${containerItem.containerId}/${objectItem.address.objectId}`, {}, {
+										api('GET', `/get/${containerItem.containerId}/${objectItem.address.objectId}`, {}, {
 											[ContentTypeHeader]: "application/json",
-											[AuthorizationHeader]: `Bearer ${walletData.tokens.object.GET.bearer}`,
+											[AuthorizationHeader]: `Bearer ${walletData.tokens.object.GET.token}`,
+											[BearerOwnerIdHeader]: walletData.account,
+											[BearerSignatureHeader]: walletData.tokens.object.GET.signature,
+											[BearerSignatureKeyHeader]: walletData.publicKey,
 										}).then((data) => {
-											if (data.header.indexOf("image/") !== -1 || data.header === 'text/plain; charset=utf-8') {
+										  if (data.status !== 200) {
+												onModal('failed', 'Object is not accessible without a token');
+											} else if (data.header.indexOf("image/") !== -1 || data.header === 'text/plain; charset=utf-8') {
 												const fileURL = URL.createObjectURL(data.res);
 												window.open(fileURL, '_blank');
 												onModal();
@@ -202,12 +207,47 @@ const File = ({
 									height={40}
 									alt="get an object by link"
 								/>
+								<img
+									src="/img/icons/manage/unlock.png"
+									className="manage_icon"
+									onClick={() => {
+										onModal('loading');
+										api('GET', `/get/${containerItem.containerId}/${objectItem.address.objectId}`, {}, {
+											[ContentTypeHeader]: "application/json",
+											[AuthorizationHeader]: `Bearer ${walletData.tokens.object.GET.bearer}`,
+										}).then((data) => {
+											if (data.status !== 200) {
+												onModal('failed', 'Something went wrong, try again');
+											} else if (data.header.indexOf("image/") !== -1 || data.header === 'text/plain; charset=utf-8') {
+												const fileURL = URL.createObjectURL(data.res);
+												window.open(fileURL, '_blank');
+												onModal();
+											} else {
+												const a = document.createElement('a');
+												document.body.appendChild(a);
+												const url = window.URL.createObjectURL(data.res);
+												a.href = url;
+												a.download = name;
+												a.target = '_blank';
+												a.click();
+												setTimeout(() => {
+													onModal();
+													window.URL.revokeObjectURL(url);
+													document.body.removeChild(a);
+												}, 0);
+											}
+										});
+									}}
+									width={40}
+									height={40}
+									alt="get an object by bearer"
+								/>
 								<img
 									src="/img/icons/manage/download.png"
 									className="manage_icon"
 									onClick={() => {
 										onModal('loading');
-										api('GET', `${params.http_gw}/get/${containerItem.containerId}/${objectItem.address.objectId}`, {}, {
+										api('GET', `/get/${containerItem.containerId}/${objectItem.address.objectId}`, {}, {
 											[ContentTypeHeader]: "application/json",
 											[AuthorizationHeader]: `Bearer ${walletData.tokens.object.GET.bearer}`,
 										}).then((data) => {

src/api.js

@@ -1,5 +1,4 @@
 const rest_gw = process.env.REACT_APP_RESTGW ? process.env.REACT_APP_RESTGW : 'https://rest.t5.fs.neo.org/v1';
-const http_gw = process.env.REACT_APP_HTTPGW ? process.env.REACT_APP_HTTPGW : 'https://http.t5.fs.neo.org';
 
 async function serverRequest(method, url, params, headers) {
 	const json = {
@@ -31,10 +30,10 @@ export default function api(method, url, params = {}, headers = {}) {
 				});
 			} else {
 				let res = response;
-				if (method === 'GET' && url.indexOf(`${http_gw}/get/`) !== -1) {
+				if (method === 'GET' && url.indexOf(`/get/`) !== -1) {
 					res = await response.blob();
 					const header = response.headers.get('Content-Type');
-					resolve({ header, res });
+					resolve({ header, res, status: response.status });
 				} else if (response.status === 413) {
 					reject('413 Request Entity Too Large');
 				} else if (response) {