Printing a logo on a custom printer TG2480H

Question

I print a receipt using the TG2480-H custom printer. I have all the receipts except the logo.

I have a monochrome .bmp file that represents a logo and has the correct size.

I am extracting the file using different types of answers:

 this.http.get('/assets/images/brand/logo-bnw.bmp', { responseType: ResponseContentType.Blob }).subscribe((response: Response) => { console.log('Blob bytes', this.kiowarePrintService.getBytesFromText(response.text())); }); this.http.get('/assets/images/brand/logo-bnw.bmp', { responseType: ResponseContentType.Text }).subscribe((response: Response) => { console.log('Text bytes', this.kiowarePrintService.getBytesFromText(response.text())); }); this.http.get('/assets/images/brand/logo-bnw.bmp', { responseType: ResponseContentType.ArrayBuffer }).subscribe((response: Response) => { console.log('ArrayBuffer bytes', this.kiowarePrintService.getBytesFromText(response.text())); }); 

Here's the documentation for ResponseContentType and the various meanings it may have.

This is the code for getBytesFromText :

 getBytesFromText(text: string) { const bytes: number[] = []; for (let i = 0; i < text.length; i++) { bytes.push(text.charCodeAt(i)); } return bytes; } 

Converting responses to bytes prints these values:

 Blob bytes (2) [123, 125] Text bytes (951) [66, 77, 65533, 3, 0, 0, 0, 0, 0, 0, 62, 0, 0, 0, 40, 0, 0, 0, 120, 0, 0, 0, 56, 0, 0, 0, 1, 0, 1, 0, 0, 0, 0, 0, 65533, 3, 0, 0, 65533, 14, 0, 0, 65533, 14, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 65533, 65533, 65533, 0, 65533, 65533, 65533, 65533, 65533, 65533, 65533, 65533, 65533, 65533, 65533, 65533, 65533, 65533, 65533, 0, 65533, 65533, 65533, 65533, 65533, 65533, 65533, 65533, 65533, 65533, 65533, 65533, 65533, 65533, 65533, 0, 65533, 65533, 65533, 65533, 65533, 65533…] ArrayBuffer bytes (479) [19778, 958, 0, 0, 0, 62, 0, 40, 0, 120, 0, 56, 0, 1, 1, 0, 0, 896, 0, 3780, 0, 3780, 0, 0, 0, 0, 0, 0, 0, 65535, 255, 65535, 65535, 65535, 65535, 65535, 65535, 65535, 255, 65535, 65535, 65535, 65535, 65535, 65535, 65535, 255, 65535, 65535, 65535, 65535, 65535, 65535, 65535, 255, 65535, 65535, 65535, 65535, 65535, 65535, 65535, 255, 65535, 65535, 65535, 65535, 65535, 65535, 65535, 255, 65535, 65535, 65535, 65535, 65535, 65535, 65535, 255, 65535, 65535, 65535, 65535, 65535, 65535, 65535, 255, 65535, 65535, 65535, 65535, 65535, 65535, 65535, 255, 65535, 65535, 65535, 65535, 65535…] 

It all seems wrong, the number of bytes of Blob is too low, and the other two contain numbers that are larger than bytes (> 255).

I tried sending these bytes to the printer anyway and came up with the following:

• Blob doesn't print anything

• Text

• Arraybuffer

EDIT: tried to add the header 'content-type': 'image/bmp' :

  const headers: Headers = new Headers({'Content-Type': 'image/bmp'}); const options: RequestOptions = new RequestOptions({headers: headers}); this.http.get('/assets/images/brand/logo-bnw.bmp', options).subscribe((response: Response) => { console.log('image/bmp bytes', this.kiowarePrintService.getBytesFromText(response.text())); }); 

Writes this down:

 image/bmp bytes (951) [66, 77, 65533, 3, 0, 0, 0, 0, 0, 0, 62, 0, 0, 0, 40, 0, 0, 0, 120, 0, 0, 0, 56, 0, 0, 0, 1, 0, 1, 0, 0, 0, 0, 0, 65533, 3, 0, 0, 65533, 14, 0, 0, 65533, 14, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 65533, 65533, 65533, 0, 65533, 65533, 65533, 65533, 65533, 65533, 65533, 65533, 65533, 65533, 65533, 65533, 65533, 65533, 65533, 0, 65533, 65533, 65533, 65533, 65533, 65533, 65533, 65533, 65533, 65533, 65533, 65533, 65533, 65533, 65533, 0, 65533, 65533, 65533, 65533, 65533, 65533…] 

Which looks just like a text answer

Answer 1

You use response.text () for ALL return types. In the case of binary data, you should save it as a blob. You can access basic bytes without converting to text with

 response.arrayBuffer() 

This should give you the correct byte array that you expect.

This question also matters: Get images or byte data using http

The top answer takes an approach:

 var blob = new Blob([new Uint8Array(response._body)]