Jump to content

Welcome! You're currently a Guest.

If you'd like to join in the Discussion, or access additional features in our forums, please sign in with your Evernote Account here. Have an Evernote Account but forgot your password? Reset it! Don't have an account yet? Create One! You'll need to set your Display Name before your first post.

Photo

Adding an image or PDF attachment retrieved via XMLHttpRequest


  • Please log in to reply
4 replies to this topic

#1 bausk

bausk

  • Pip
  • Title: Member
  • Group: Members
  • 15 posts

Posted 07 December 2012 - 10:26 AM

Hi,

in a Chrome extension, I am trying to create a note with an attachment retrieved from the web. I tried multiple ways to add the binary data as described in the web API help but the attachment won't show properly.

I retrieve the attachment as a string using code:

function getLink(url, callback) {
var xhr = new XMLHttpRequest();
xhr.open('GET', document.getElementById('url1').value, true);
xhr.responseType = 'blob';
// xhr.overrideMimeType('text/plain; charset=x-user-defined');
xhr.onload = function(e) {
if (this.status == 200) {
	 // Note: .response instead of .responseText
	 var blob = new Blob([this.response], {type: 'application/octet-stream'});
	 //blob = this.response;
	 var reader = new FileReader();
	 reader.readAsBinaryString(blob);
	 reader.onload = function(e) {
	 var contents = e.target.result;
		 AddNote1(url, contents, function(response) {
		 document.getElementById('result').innerHTML += String(response).replace(/\n/g, "<br/>") + "<br/>";
		 document.getElementById('result').innerHTML += contents.slice(1, 10);
		 } );
	 }
	 }
};
xhr.send();
}

I tried to override the mime type with plaintext, image/jpeg, and leave it as-is, but none seem to work.
Then I construct the Note object and this is where the string format doesn't seem to work:

function AddNote1(Name, ContentFile, callback)
{
var noteStore = get_NoteStore();
var note = new Note();
note.title = Name;
var na = new NoteAttributes();
//na.author = "someone";
na.sourceURL = Name;
na.source = "web.clip";
note.attributes = na;
var data = new Data();
var resource = new Resource();
data.size = ContentFile.length;
alert(ContentFile.length);
data.bodyHash = raw_md5(ContentFile);
data.body = ContentFile;
resource.mime = "image/jpeg";
resource.data = data;
var resAttributes = new ResourceAttributes();
resAttributes.fileName = String(Name).replace(/^.*[\/\\]/g, '');
resource.attributes = resAttributes;
note.resources = Array(resource);
//important to set correct content
var content = "<?xml version=\"1.0\" encoding=\"UTF-8\"?>"
	 + "<!DOCTYPE en-note SYSTEM \"http://xml.evernote.com/pub/enml2.dtd\"><en-note>";
content += String("Oi Wei").replace(/\n/g, "<br/>") + "<br/>";
content += "<en-media type=\"image/jpeg\" hash=\"" + md5(ContentFile) + "\"/>";
content += "</en-note>";
note.content = content;
//response is a created note
//callback function process response
var response = noteStore.createNote(Eventnote.Auth.get_auth_token(), note);
if (callback !== undefined) {
	 callback(response);
	 }

The byte length of attachment string seems to equal the actual file. I think there is a problem with encoding.
Is there any way to get the proper encoding or retrieve the file properly to attach it to a note?

#2 bausk

bausk

  • Pip
  • Title: Member
  • Group: Members
  • 15 posts

Posted 07 December 2012 - 10:02 PM

I managed to make sure via debug that the data gets into the Note structure uncorrupted. This fragment works well with PDF files:

data.body = binaryData;
resource.mime = "application/pdf";
resource.data = data;
...
note.resources = Array(resource);
//important to set correct content
...
//response is a created note
//callback function process response
var response = noteStore.createNote(Eventnote.Auth.get_auth_token(), note);

The problem is, however, that when I retrieve the uploaded file from Evernote, it comes strangely corrupted.
Here are the two files, the original uploaded file and the file that ends up in Evernote:

1. original.pdf, 2898 bytes.
2. evernote.pdf, 3018 bytes.

Here is the illustrated corrupted fragment (there are more like that in the file) and the files for comparison:
http://www.evernote....de3fb944142fb43

#3 bausk

bausk

  • Pip
  • Title: Member
  • Group: Members
  • 15 posts

Posted 08 December 2012 - 01:46 AM

I figured out the problem resides in the Kanda Software's Evernote SDK library. The resources data gets encoded with UTF and remains garbled.
Can I just tweak thrift and types to bypass the UTF encoding for resource body? It doesn't seem to work.

#4 bausk

bausk

  • Pip
  • Title: Member
  • Group: Members
  • 15 posts

Posted 09 December 2012 - 08:48 AM

Um, okay...
After I posted this on Stackoverflow, http://stackoverflow...s-garbled-after, it became apparent that the only way to cope with this is to decode the file before it is processed.
Still, my conversion leaves higher-order unicode characters botched. Woul you recommend any utf8-decode Javascript implementation that doesn't have this problem?

#5 bausk

bausk

  • Pip
  • Title: Member
  • Group: Members
  • 15 posts

Posted 17 December 2012 - 02:46 PM

I have come to conclusion that adding a resource correctly is impossible in Javascript. I moved this functionality over to a Python-based backend.




0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users

Clip to Evernote