Mixing
convert byte array to image in angular6
0
I have sent the image file in a byte array from the server. Now I have to convert that into a jpeg file and display it in a webpage.
Code:
app.get('/getPhoto/:hash',function(req, res){
console.log(req.params.hash);
invoke = require('/Users/sanjeev.natarajan/ipfs/file1.js');
invoke.getfile(req.params.hash).then((str)=>{
console.log("resu",str)
res.send({"Result":str});
})
.catch((error) => {
res.send({"Error":"error in fetching the file through the hashcode"});
})
});
I am receiving the data from the backend; now I need to convert this into an image in angular6
angular typescript ipfs
edited Nov 20 '18 at 10:52
sh0ber
19.9k74153
asked Nov 20 '18 at 10:06
Sanjeev KumarSanjeev Kumar
106
add a comment |
0
I have sent the image file in a byte array from the server. Now I have to convert that into a jpeg file and display it in a webpage.
Code:
app.get('/getPhoto/:hash',function(req, res){
console.log(req.params.hash);
invoke = require('/Users/sanjeev.natarajan/ipfs/file1.js');
invoke.getfile(req.params.hash).then((str)=>{
console.log("resu",str)
res.send({"Result":str});
})
.catch((error) => {
res.send({"Error":"error in fetching the file through the hashcode"});
})
});
I am receiving the data from the backend; now I need to convert this into an image in angular6
angular typescript ipfs
edited Nov 20 '18 at 10:52
sh0ber
19.9k74153
asked Nov 20 '18 at 10:06
Sanjeev KumarSanjeev Kumar
106
What have you already tried?
– Mathyn
Nov 20 '18 at 10:54
Does this help you maybe? stackoverflow.com/questions/48781966/…
– Teun van der Wijst
Nov 20 '18 at 10:56
no that answer doesnt work because i am sending the buffer data to front end
– Sanjeev Kumar
Nov 22 '18 at 6:06
add a comment |
0
0
0
I have sent the image file in a byte array from the server. Now I have to convert that into a jpeg file and display it in a webpage.
Code:
app.get('/getPhoto/:hash',function(req, res){
console.log(req.params.hash);
invoke = require('/Users/sanjeev.natarajan/ipfs/file1.js');
invoke.getfile(req.params.hash).then((str)=>{
console.log("resu",str)
res.send({"Result":str});
})
.catch((error) => {
res.send({"Error":"error in fetching the file through the hashcode"});
})
});
I am receiving the data from the backend; now I need to convert this into an image in angular6
angular typescript ipfs
edited Nov 20 '18 at 10:52
sh0ber
19.9k74153
asked Nov 20 '18 at 10:06
Sanjeev KumarSanjeev Kumar
106
I have sent the image file in a byte array from the server. Now I have to convert that into a jpeg file and display it in a webpage.
Code:
app.get('/getPhoto/:hash',function(req, res){
console.log(req.params.hash);
invoke = require('/Users/sanjeev.natarajan/ipfs/file1.js');
invoke.getfile(req.params.hash).then((str)=>{
console.log("resu",str)
res.send({"Result":str});
})
.catch((error) => {
res.send({"Error":"error in fetching the file through the hashcode"});
})
});
I am receiving the data from the backend; now I need to convert this into an image in angular6
angular typescript ipfs
angular typescript ipfs
edited Nov 20 '18 at 10:52
sh0ber
19.9k74153
asked Nov 20 '18 at 10:06
Sanjeev KumarSanjeev Kumar
106
edited Nov 20 '18 at 10:52
sh0ber
19.9k74153
asked Nov 20 '18 at 10:06
Sanjeev KumarSanjeev Kumar
106
edited Nov 20 '18 at 10:52
sh0ber
19.9k74153
edited Nov 20 '18 at 10:52
sh0ber
19.9k74153
edited Nov 20 '18 at 10:52
sh0ber
19.9k74153
19.9k74153
asked Nov 20 '18 at 10:06
Sanjeev KumarSanjeev Kumar
106
asked Nov 20 '18 at 10:06
Sanjeev KumarSanjeev Kumar
106
asked Nov 20 '18 at 10:06
Sanjeev KumarSanjeev Kumar
106
106
What have you already tried?
– Mathyn
Nov 20 '18 at 10:54
Does this help you maybe? stackoverflow.com/questions/48781966/…
– Teun van der Wijst
Nov 20 '18 at 10:56
no that answer doesnt work because i am sending the buffer data to front end
– Sanjeev Kumar
Nov 22 '18 at 6:06
add a comment |
What have you already tried?
– Mathyn
Nov 20 '18 at 10:54
Does this help you maybe? stackoverflow.com/questions/48781966/…
– Teun van der Wijst
Nov 20 '18 at 10:56
no that answer doesnt work because i am sending the buffer data to front end
– Sanjeev Kumar
Nov 22 '18 at 6:06
What have you already tried?
– Mathyn
Nov 20 '18 at 10:54
What have you already tried?
– Mathyn
Nov 20 '18 at 10:54
Does this help you maybe? stackoverflow.com/questions/48781966/…
– Teun van der Wijst
Nov 20 '18 at 10:56
Does this help you maybe? stackoverflow.com/questions/48781966/…
– Teun van der Wijst
Nov 20 '18 at 10:56
no that answer doesnt work because i am sending the buffer data to front end
– Sanjeev Kumar
Nov 22 '18 at 6:06
no that answer doesnt work because i am sending the buffer data to front end
– Sanjeev Kumar
Nov 22 '18 at 6:06
add a comment |
1 Answer
1
active
oldest
votes
1
You can convert a byte array to a Base64-encoded string using the btoa function, and then use a Data URL to display the image. You will need to known the image's MIME type though:
var bytes = [ ... ]; // get from server
var uints = new UInt8Array(bytes);
var base64 = btoa(String.fromCharCode(null, uints));
var url = 'data:image/jpeg;base64,' + base64; // use this in <img src="..."> binding
answered Nov 20 '18 at 11:03
ImpworksImpworks
1,05631437
but this shows some parse error
– Sanjeev Kumar
Nov 22 '18 at 4:34
@SanjeevKumar which error exactly and where? I assume you replaced the[...]placeholder with actual code that gets the byte array from server?
– Impworks
Nov 22 '18 at 8:15
yes i have replaced
– Sanjeev Kumar
Nov 22 '18 at 11:05
@SanjeevKumar sorry, my bad - please see the updated answer
– Impworks
Nov 22 '18 at 11:14
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
draft saved
draft discarded
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53390580%2fconvert-byte-array-to-image-in-angular6%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
1
You can convert a byte array to a Base64-encoded string using the btoa function, and then use a Data URL to display the image. You will need to known the image's MIME type though:
var bytes = [ ... ]; // get from server
var uints = new UInt8Array(bytes);
var base64 = btoa(String.fromCharCode(null, uints));
var url = 'data:image/jpeg;base64,' + base64; // use this in <img src="..."> binding
answered Nov 20 '18 at 11:03
ImpworksImpworks
1,05631437
but this shows some parse error
– Sanjeev Kumar
Nov 22 '18 at 4:34
@SanjeevKumar which error exactly and where? I assume you replaced the[...]placeholder with actual code that gets the byte array from server?
– Impworks
Nov 22 '18 at 8:15
yes i have replaced
– Sanjeev Kumar
Nov 22 '18 at 11:05
@SanjeevKumar sorry, my bad - please see the updated answer
– Impworks
Nov 22 '18 at 11:14
add a comment |
1
You can convert a byte array to a Base64-encoded string using the btoa function, and then use a Data URL to display the image. You will need to known the image's MIME type though:
var bytes = [ ... ]; // get from server
var uints = new UInt8Array(bytes);
var base64 = btoa(String.fromCharCode(null, uints));
var url = 'data:image/jpeg;base64,' + base64; // use this in <img src="..."> binding
answered Nov 20 '18 at 11:03
ImpworksImpworks
1,05631437
but this shows some parse error
– Sanjeev Kumar
Nov 22 '18 at 4:34
@SanjeevKumar which error exactly and where? I assume you replaced the[...]placeholder with actual code that gets the byte array from server?
– Impworks
Nov 22 '18 at 8:15
yes i have replaced
– Sanjeev Kumar
Nov 22 '18 at 11:05
@SanjeevKumar sorry, my bad - please see the updated answer
– Impworks
Nov 22 '18 at 11:14
add a comment |
1
1
1
You can convert a byte array to a Base64-encoded string using the btoa function, and then use a Data URL to display the image. You will need to known the image's MIME type though:
var bytes = [ ... ]; // get from server
var uints = new UInt8Array(bytes);
var base64 = btoa(String.fromCharCode(null, uints));
var url = 'data:image/jpeg;base64,' + base64; // use this in <img src="..."> binding
answered Nov 20 '18 at 11:03
ImpworksImpworks
1,05631437
You can convert a byte array to a Base64-encoded string using the btoa function, and then use a Data URL to display the image. You will need to known the image's MIME type though:
var bytes = [ ... ]; // get from server
var uints = new UInt8Array(bytes);
var base64 = btoa(String.fromCharCode(null, uints));
var url = 'data:image/jpeg;base64,' + base64; // use this in <img src="..."> binding
answered Nov 20 '18 at 11:03
ImpworksImpworks
1,05631437
edited Nov 23 '18 at 8:33
answered Nov 20 '18 at 11:03
ImpworksImpworks
1,05631437
answered Nov 20 '18 at 11:03
ImpworksImpworks
1,05631437
answered Nov 20 '18 at 11:03
ImpworksImpworks
1,05631437
1,05631437
but this shows some parse error
– Sanjeev Kumar
Nov 22 '18 at 4:34
@SanjeevKumar which error exactly and where? I assume you replaced the[...]placeholder with actual code that gets the byte array from server?
– Impworks
Nov 22 '18 at 8:15
yes i have replaced
– Sanjeev Kumar
Nov 22 '18 at 11:05
@SanjeevKumar sorry, my bad - please see the updated answer
– Impworks
Nov 22 '18 at 11:14
add a comment |
but this shows some parse error
– Sanjeev Kumar
Nov 22 '18 at 4:34
@SanjeevKumar which error exactly and where? I assume you replaced the[...]placeholder with actual code that gets the byte array from server?
– Impworks
Nov 22 '18 at 8:15
yes i have replaced
– Sanjeev Kumar
Nov 22 '18 at 11:05
@SanjeevKumar sorry, my bad - please see the updated answer
– Impworks
Nov 22 '18 at 11:14
but this shows some parse error
– Sanjeev Kumar
Nov 22 '18 at 4:34
but this shows some parse error
– Sanjeev Kumar
Nov 22 '18 at 4:34
@SanjeevKumar which error exactly and where? I assume you replaced the
[...] placeholder with actual code that gets the byte array from server?– Impworks
Nov 22 '18 at 8:15
@SanjeevKumar which error exactly and where? I assume you replaced the
[...] placeholder with actual code that gets the byte array from server?– Impworks
Nov 22 '18 at 8:15
yes i have replaced
– Sanjeev Kumar
Nov 22 '18 at 11:05
yes i have replaced
– Sanjeev Kumar
Nov 22 '18 at 11:05
@SanjeevKumar sorry, my bad - please see the updated answer
– Impworks
Nov 22 '18 at 11:14
@SanjeevKumar sorry, my bad - please see the updated answer
– Impworks
Nov 22 '18 at 11:14
add a comment |
draft saved
draft discarded
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
draft saved
draft discarded
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53390580%2fconvert-byte-array-to-image-in-angular6%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
What have you already tried?
– Mathyn
Nov 20 '18 at 10:54
Does this help you maybe? stackoverflow.com/questions/48781966/…
– Teun van der Wijst
Nov 20 '18 at 10:56
no that answer doesnt work because i am sending the buffer data to front end
– Sanjeev Kumar
Nov 22 '18 at 6:06