Encode/Decode a picture in Hex - javascript

A client (a job board) has asked me to do the following :
Create a form, gather informations and create an xml file containing all those informations everytime a user fills out the form, easy enough.
So the client sent me an xml model and within this xml file there is an encoded picture and an encoded CV, both are encoded (it seems in HEX), and i cannot understand how to decode (or even encode under the same format for that matter) the piece of HEX.
Here are pieces of the xml fiel, I cannot post it entirely, you'll surely understand why.
<photo>
FFD8FFE10A1845786966000049492A000800000008000F010200040000004854430010010200150000006E0000001201030001000000010[.............]EF6A57F5A8E41EE594D62075FF8F77CFF00B1FF00D7A7C17D13B7FA99157FE0269C60E22E4D4DAB38A09E24788F5FF80D5B5B5FEE9ACE32E518AB6DFEDAD1F653FC2D57700FB23FFB1F9D5DB64289B4
</photo>
<cv>
255044462D312E340D0A25C8C9CACB0D0A372030206F626A0D0A3C3C2F54797065202F506167652F506172656E742033203020522F436F6E74656E74.......
</cv>
<extensionCv>.pdf</extensionCv>
And just to make it harder here are several points to take into consideration :
This file is to be used to import informations into a software which has been developed especially for this company, I do not have access to it, and cannot get in touch with the company that designed it. The xml file has been created by this software as an export of a candidat file.
I cannot encode it in base64 (it'd be too easy), it needs to be the same encoding.
I need to be able to encode it in either js, or php (once im sure the software can decode if, i'll only need to encode, I won't need to decode anything).
Thank you.

You can use bin2hex PHP function to convert binary data into HEX string. Please check PHP documentation where you can find an example of bin2hex with reading a binary file

Related

Convert binary / unicode string to image

I am using a library to recieve attachments (image) from salesforce using OAuth and a proxy. Without the library (and the proxy) I am able to the same using XHR, but I have to use the library because I need the proxy.
In chrome debugger I can see image is downloaded fine, but I can't get it to work in my code. Data looks like:
So far methods I have tried:
btoa(unescape(encodeURIComponent(file.body)));- produces a base64 that does not work. decoding it using online tools gives me back the same string.
escape(file.body) - using this as base64 also does not work.
Converting to a blob.
var blob = new Blob([file.body], {type : "image/png"});
urlCreator.createObjectURL(blob);
The url it points to displays nothing, and if I remove {type : "image/png"} the url points to a page displaying same binary string.
Long story short this looks like someone read the image with readAsText() which mangles ("interprets") binary into utf8, instead of utf16. You need to get the server to return the data in arraybuffer or blob format ideally, or even base64, these preserve binary.
Long version with snippet. (those question marks symbols in the snippet show the lost information, compare it to the binary where they are not question marks in utf16):
https://stackoverflow.com/a/56523118/2962797
I would create an <img /> element, equal its src attribute to the image data you received. Now you have the image.
If you want to extract it or convert it to PNG, I would apply this another answer process.

Node.js: How to send file text-content to user with russian symbols (I need utf8)?

I am develop in node.js
I get file text-content using fs-module. This is .txt file
Привет мир
Hello world
Hello world
...
After I want to send this content to user to show using res.end(fileString)
But my browser can't decode russian symbols. Only english words are correct.
First and foremost, be sure that the browser is set correctly to use UTF-8 encoding.
If the text still does not show correctly, you can try an alternate encoding for sending the data, depending on how you're doing this.
As an example, you can encode the Russian in base64 prior to sending it over to the browser, and decode it on the browser side.
On the NodeJS side, you can use Buffer to encode the utf8 string to base64. Reference this thread for examples and more details.
On the client/browser side, the atob() and btoa() functions are used rather than Buffer. Here is the documentation for these functions. Use atob() in order to decode the base64 to utf8, and the browser will be able to show this correctly.

how to get data from a base64 encoding of a .pptx file in javascript

I get data from a server of the .pptx file in base64 encoding now i would like to get the text that is present inside the base64 data.
Is there any third party java script library to do this especially scanning in base64 code rather than taking the file path and i would like insert these strings into a power point using office js.
Client side would be preferred.
thanks
Seems that what you need is a JavaScript decoder for base64 files, there are many projects in Github Doing this, for instance here is one https://github.com/mathiasbynens/base64.
That said, I am not sure about your scenario, and what types of files are been base64-encoded. Base64 at the end of the day is a text "representation" of usually a binary file, like an image or a compressed zip file. I wonder if once you decode it you will get what you expect. And if you are expecting text, i wonder why your service is even encoding it like this.
Anyways... once you have whatever text you want to insert, you can use the setSelectedDataAsync method of our Office.js in PPT to write it in your presentation's active selection. https://dev.office.com/reference/add-ins/shared/document.setselecteddataasync

javascript sendfile binary data to web service

At work we are trying to upload files from a web page to a web service using html 5/javascript in the browser end and C# in the web service. But have some trouble with encoding of some sort.
As for the javascript we get the file's binary data with help from a FileReader.
var file = ... // gets the file from an input
var fileReader = new FileReader();
fileReader.onload = dataRecieved;
fileReader.readAsBinaryString(file);
function dataRecieved() {
// Here we do a normal jquery ajax post with the file data (fileReader.result).
}
Wy we are posting the data manually and not with help from XmlHttpRequest (or similar) is for easier overall posting to our web service from different parts of the web page (it's wrapped in a function). But that doesn't seem to be the problem.
The code in the Web Service looks like this
[WebMethod]
public string SaveFileValueFieldValue(string value)
{
System.Text.UnicodeEncoding encoder = new UnicodeEncoding();
byte[] bytes = encoder.GetBytes(value);
// Saves file from bytes here...
}
All works well, and the data seems to be normal, but when trying to open a file (an image as example) it cannot be opened. Very basic text files seems to turn out okay. But if I upload a "binary" file like an image and then open both the original and the uploaded version in a normal text editor as notepad to see what differs, it seems to be wrong with only a few "invisible" characters and something that displays as a new line a few bytes in from from the start.
So basicly, the file seems to encode just a few bytes wrong somewhere in the conversions.
I've also tried to create an int array in javascript from the data, and then again transformed to a byte[] in the web service, with the exact same problem. If I try to convert with anything else than unicode (like UTF-8), the data turns out completly different from the original, so I think om on the right track here, but with something slightly wrong.
The request itself is text, so binary data is lost if you send the wrong enc-type.
What you can do is encode the binary to base64 and decode it on the other side.
To change the enc-type to multi-part/mixed and set boundaries (just like an e-mail or something) you'd have to assemble the request yourself.

Write non ASCII char with PhoneGap Javascript Image

Here is what I'm doing :
In javascript I ask for an image with AJAX.
The server php execute the following code :
readfile($pathfile);
Then the javascript receive the data, and with Phonegap I try to write it to a file :
var writer = new FileWriter();
writer.fileName = "./../Documents/" + nameFile;
writer.write(dataReceived);
In fact, it works with ASCII chars, but the function "write" fail with the content of the image received (png format). So I tried to encode the transferred data in Base64, in Hexadécimal and it works. But I don't want to store encoded data because I want to use it later in "img" tags (html tag). And make something like :
<img src='./../Documents/createdFile.png' />
Do you have any idea on how to write any characters in Phonegap to a file? Or what I'm doing wrong with the FileWriter of PhoneGap ? I know the way to do something like src='Image.php', but I have to store files on the device.
I've got the version 0.9x of Phonegap (included with Dreamweaver). Thanks in advance.
I finally found the explication. To begin I want to say that I just learned javascript ;) .So I asked the question to "macdonst" on github and he answered me :
"Sadly, you will be unable to write binary data with the FileWriter. JavaScript can't handle binary data very well and we can't pass binary data from the JavaScript side to the Native side so it is a limitation we have to live with.
However, once you've written you've gotten your base64 image data you can display it like this:
<img src="data:image/gif;base64,{this is where your base64 data goes}" />
"
Thanks to "macdonst", I posted his answer because I hope it will help beginners like me.

Categories

Resources