I am trying to download the tar file in node-red.
Following is my JavaScript code to download the file.
downloadTar(sendObj).then(res => {
var bytes = new Uint8Array(byte); // pass your byte response to this constructor
var blob = new Blob([bytes], {type: "application/tar"});
var link = document.createElement('a');
link.href = window.URL.createObjectURL(blob);
var fileName = 'genome.tar';
link.download = fileName;
link.click();
});
function downloadTar(data) {
return new Promise((resolve, reject) => {
$.ajax({
url: nodeRedDownloadTar,
type: 'POST',
data: data,
success: function (result) {
resolve(result);
}
});
});
}
Following is my Node-Red flow, I am reading the file in a single Buffer Object and sending it to the http response
Then following is the response I am getting it from the backend.
The problem is the tar file is not getting downloaded. I am not sure where I am making the problem.
The following flow is working properly, I'm using the headers option in the http-response node to set the content-type to appplication/x-tar
[
{
"id": "6e993a09.f44244",
"type": "file in",
"z": "1c834717.22be01",
"name": "",
"filename": "/home/pi/test.tar",
"format": "",
"chunk": false,
"sendError": false,
"encoding": "none",
"x": 600,
"y": 580,
"wires": [
[
"6e7d5f6f.c9477"
]
]
},
{
"id": "df49df3b.d325b",
"type": "http in",
"z": "1c834717.22be01",
"name": "",
"url": "/tar",
"method": "post",
"upload": false,
"swaggerDoc": "",
"x": 380,
"y": 580,
"wires": [
[
"6e993a09.f44244"
]
]
},
{
"id": "6e7d5f6f.c9477",
"type": "http response",
"z": "1c834717.22be01",
"name": "",
"statusCode": "",
"headers": {
"content-type": "application/x-tar"
},
"x": 800,
"y": 580,
"wires": []
}
]
Related
Help me download the archive, please.
I get this json from the backend.
{
"version": "1.1",
"content": {
"headers": [
{
"key": "Content-Length",
"value": [
"4838778"
]
},
{
"key": "Content-Disposition",
"value": [
"attachment; filename=Archive.zip"
]
},
{
"key": "Content-Type",
"value": [
"application/zip"
]
}
]
},
"statusCode": 200,
"reasonPhrase": "OK",
"headers": [],
"trailingHeaders": [],
"requestMessage": null,
"isSuccessStatusCode": true
}
I am trying to download it like this.
function download(){
axios.defaults.responseType = 'blob'
axios.post('https://localhost:7120/api/Import/UploadFile', {
SipName: 'login',
SipPasw: "password"
})
.then((r)=>{
console.log(r)
var fileURL=window.URL.createObjectURL(new Blob([r.data]));
var fileLink=document.createElement('a');
fileLink.href=fileURL;
fileLink.setAttribute('download', "Archive.zip");
document.body.appendChild(fileLink);
fileLink.click();
})
.catch((e)=>{
console.log(e)
})
}
But the broken archive is downloaded.
In JSON, it can be seen that 4 megabytes are accumulated there, and an archive weighing 332 bytes is downloaded.
As I understand it, I'm not downloading the archive that I sent, but downloading the incoming JSON in zip format. But how to download the archive from the answer?
HTML code:
<div id="filemanager"></div>
javascript code:
$(document).ready(function () {
$("#filemanager").kendoFileManager({
dataSource: {
transport: {
read: function (options) {
$.ajax({
method: "GET",
datatype: "json",
url: Djangourl,
success: function (result) {
console.log(result);
options.success(result);
},
error: function (result) {
options.error(result);
}
});
},
}
}
});
}
JSON returned by server:
[
{
"name": "abc",
"isDirectory": true,
"hasDirectories": true,
"path": "folder",
"extension": "",
"size": 0,
"created": "2022-07-06T11:28:46.932Z",
"createdUtc": "2022-07-06T11:28:46.932Z",
"items": [
{
"name": "abc_123",
"isDirectory": true,
"hasDirectories": true,
"path": "folder/abc_123",
"extension": "",
"size": 0,
"created": "",
"createdUtc": ""
}
],
"modified": null,
"modifiedUtc": null
}
]
Issue: folder 'abc' is displayed but item inside is not getting displayed, on double click on abc again ,ajax is calling the url. I want to display 'abc_123' directory on double click of 'abc' folder as shown in 'https://dojo.telerik.com/UpUgeZOH' example.
Im using the following function to upload an image to our application:
const result = await ImagePicker.launchCameraAsync({
allowsEditing:true,
});
This returns the following object:
Object {
"cancelled": false,
"height": 3200,
"type": "image",
"uri": "file:///data/user/0/host.exp.exponent/cache/ExperienceData/%2540sepbaa%252Frepoflex/ImagePicker/ff4dc82d-f14b-4b23-a81a-30e87c34d7e0.jpg",
"width": 2400,
}
Afterwards we need to upload the image to our backend, but we don't know where the image data is. If we do a fetch to the uri from the previous object, it returns the following:
Object {
"_bodyBlob": Object {
"_data": Object {
"collector": Object {},
"blobId": "c0e241fa-9b39-4aed-9860-793a393408dd",
"lastModified": 0,
"name": "ff4dc82d-f14b-4b23-a81a-30e87c34d7e0.jpg",
"offset": 0,
"size": 4864483,
"type": "image/jpeg",
},
},
"_bodyInit": Object {
"_data": Object {
"collector": Object {},
"blobId": "c0e241fa-9b39-4aed-9860-793a393408dd",
"lastModified": 0,
"name": "ff4dc82d-f14b-4b23-a81a-30e87c34d7e0.jpg",
"offset": 0,
"size": 4864483,
"type": "image/jpeg",
},
},
"bodyUsed": true,
"headers": Object {
"map": Object {
"content-type": "image/jpeg",
},
},
"ok": false,
"status": 0,
"type": "default",
"url": "",
}
We need to send to our backend the raw image bytes. Where is that data stored? How can we retrieve it?
For uploading it to backend you need to do like this
const form = new FormData();
form.append({
name: "SampleImage.jpg", // Name of file
uri: "file:///data/user/0/host.exp.exponent/cache/ExperienceData/%2540sepbaa%252Frepoflex/ImagePicker/ff4dc82d-f14b-4b23-a81a-30e87c34d7e0.jpg", // URI of the file
type: "image/jpg", // MIME type of the file
})
Now you just simply have to perform a POST request with this form as body
Also in the backend you can access it like this
req.file // Depends on the backend you are using ...
I am trying to parse responses back from the following fetch api calls. I am able to display the response as a string, but I would like to get specific properties from the json blob and I am struggling to do so. I am not sure how to access the json object properties inside the Response Object.
This is for a cloudflare worker using ES6.
The Json structure is here: json response
{
"success": true,
"errors": [],
"messages": [],
"result": {
"id": "699d98642c564d2e855e9661899b7252",
"created_on": "2014-01-01T05:20:00.12345Z",
"modified_on": "2014-01-01T05:20:00.12345Z",
"name": "server-1",
"description": "Health check for www.example.com",
"suspended": false,
"notification": {
"suspended": false,
"email_addresses": [
"alert#example.com",
"oncall#example.com"
],
"trigger": "FAIL"
},
"check_regions": [
"WEU",
"ENAM"
],
"type": "HTTPS",
"consecutive_successes": 1,
"consecutive_fails": 1,
"http_config": {
"method": "GET",
"port": 80,
"path": "/health",
"expected_codes": [
"2xx",
"302"
],
"expected_body": "success",
"follow_redirects": false,
"allow_insecure": false,
"header": {
"Host": [
"example.com"
],
"X-App-ID": [
"abc123"
]
}
},
"tcp_config": {
"method": "connection_established",
"port": 80
},
"timeout": 5,
"retries": 2,
"interval": 60,
"address": "www.example.com",
"status": "healthy",
"failure_reason": ""
}
}
const fw1aUrl = "https://api.cloudflare.com/client/v4/zones/<>/healthchecks/<>"
const fw1bUrl = "https://api.cloudflare.com/client/v4/zones/<>/healthchecks/<>"
let temp = {}
async function handleRequest() {
const init = {
headers: {
"content-type": "application/json;charset=UTF-8",
"X-AUTH-EMAIL": CLOUDFLARE_API_EMAIL,
"X-AUTH-KEY": CLOUDFLARE_API_KEY,
},
}
const [fw1aResponse, fw1bResponse] = await Promise.all([
fetch(fw1aUrl,init),
fetch(fw1bUrl,init)
]);
const fw1aresult = await fw1aResponse.json()
const fw1bresult = await fw1bResponse.json()
temp.fw1a = await fw1aresult
temp.fw1b =await fw1bresult
const jsonobj = await JSON.parse(temp)
console.log(jsonobj)
return jsonobj
}
addEventListener("fetch", event => {
const obj = handleRequest()
console.log(obj.fw1a.result)
console.log(obj.fw1b.result)
return event.respondWith(new Response("hello"))
})
})
The back-end generated the data API, and how to fetch data on the front end
ps： I use react
URL: http://localhost:8080/api/barrages
when request the above url, the browser displays as follows.
{
"content": [
{
"key": 12344443434545435,
"text": "绿色走一波",
"time": 500,
"fontFamily": null,
"fontsize": null,
"color": "#0f0",
"video_id": null,
"creationDateTime": "2019-04-08T13:59:51Z"
}
],
"page": 0,
"size": 30,
"totalElements": 1,
"totalPages": 1,
"last": true
}
Front-end: get data
fetch("/api/barrages", { method: 'GET' })
.then(function (res) {
res.json()
.then(function (barrage) {
console.log(barrage);
}
)
})
I want to get the data of content
You would need to do it like this:
fetch("/api/barrages", { method: 'GET' })
.then(function (res) {
return res.json()
}
.then(function(myJson){
console.log(JSON.stringify(myJson))
})
})