thiendangit / react-native-thermal-receipt-printer-image-qr Goto Github PK

Hi thiendangit

Are you remember me. i am chukiat in thailand that you help to dev this library for help me to print image and qr
After developed POS app until almost there success and then to use your library to print image for receipt.
But i got error when install your new release like that.
Please help me again.
Thank you very much. Thiendangit

D:\Source\2019\ReactNative\posware-printing> npm i react-native-thermal-receipt-printer-image-qr
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: [email protected]
npm ERR! Found: [email protected]
npm ERR! node_modules/react-native
npm ERR! react-native@"0.66.3" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react-native@"^0.41.2 || ^0.57.0" from [email protected]
npm ERR! node_modules/react-native-ping
npm ERR! peer react-native-ping@"" from [email protected]
npm ERR! node_modules/react-native-thermal-receipt-printer-image-qr
npm ERR! react-native-thermal-receipt-printer-image-qr@"" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.

Let's say we have

Printer.printText('A\n');
Printer.printText('B\n');
Printer.printText('C\n');

Sometimes the print order is A -> B -> C ( ideal )
But sometimes the print order gets like B -> A -> C or B -> C -> A

is this because of printer ? Any quick fix for this ?

Thanks.

Can someone help me with printing text in some cases being random?
It's like 20 out of 1 in even the data is static it still prints randomly.

Here is my printer config

`
// printer configs

    const CENTER = COMMANDS.TEXT_FORMAT.TXT_ALIGN_CT;
    let FONT_SIZE = COMMANDS.TEXT_FORMAT.TXT_CUSTOM_SIZE(1, 1);
    let LINE = COMMANDS.TEXT_FORMAT.TXT_FONT_B;
    let formatLine = (context) => {
        return `${LINE}${FONT_SIZE}${context}${FONT_SIZE}${LINE}`;
    };
    const BOLD_ON = COMMANDS.TEXT_FORMAT.TXT_BOLD_ON;
    let printDate = dateformat(new Date(), 'dddd, mmmm dS, yyyy, h:MM TT');
    let columnAliment = [ColumnAliment.LEFT, ColumnAliment.LEFT];
    let columnWidth = [10, 30];
    let itemWidth = [10, 30];
    const encoder = new EscPosEncoder();
    let _encoder = encoder
        .initialize()
        .align('center')
        .line('Scan to track your parcel')
        .line('ID : ReQYEJK')
        .qrcode('https://pohmal.com?ref= ReQYEJK')
        .encode();
    let base64String = Buffer.from(_encoder).toString('base64');

    let senderList = [
        ['Name ', 'Kyaw Ye Zaw'],
        ['Phone ', '+959 555 276'],
        ['Address ', 'No 45,Bet 24th Street and 2nd Avenue,Yangon,Myanmar'],
    ];
    let receiverList = [
        ['Name ', 'Kyaw Ye Zaw'],
        ['Phone ', '+959 555 276'],
        ['Address ', 'No 45,Bet 24th Street and 2nd Avenue,Yangon,Myanmar'],
    ];
    let itemList = [
        ['Item', 'Plates'],
        ['Charges', '1000 Ks'],
        ['COD    ', '1000 Ks'],
        ['Remark ', 'Careful about what you buy and what you pay for because you can lose your money'],
    ];

    // printing process

    try {
        if (Platform.OS === 'android' || Platform.OS === 'ios') {
            BLEPrinter.printImage('image_logo.jpg');
            BLEPrinter.printText(formatLine(`${printDate}`));
            BLEPrinter.printText(`${CENTER}${LINE}${FONT_SIZE}-----------------------------------------${FONT_SIZE}${LINE}${CENTER}`);
            BLEPrinter.printColumnsText(['SENDER', ''], columnWidth, columnAliment, [`${BOLD_ON}${LINE}${FONT_SIZE}${FONT_SIZE}${LINE}${BOLD_ON}`, '']);
            for (let i in senderList) {
                BLEPrinter.printColumnsText(senderList[i], columnWidth, columnAliment, [`${LINE}${FONT_SIZE}${FONT_SIZE}${LINE}`, '']);
            }
            BLEPrinter.printText(`${LINE}${formatLine('.............')}`);
            BLEPrinter.printColumnsText(['RECEIVER', ''], columnWidth, columnAliment, [`${BOLD_ON}${LINE}${FONT_SIZE}${FONT_SIZE}${LINE}${BOLD_ON}`, '']);
            for (let i in receiverList) {
                BLEPrinter.printColumnsText(receiverList[i], columnWidth, columnAliment, [`${LINE}${FONT_SIZE}${FONT_SIZE}${LINE}`, '']);
            }
            BLEPrinter.printText(`${CENTER}${LINE}${FONT_SIZE}..........................................${FONT_SIZE}${LINE}${CENTER}`);
            for (let i in itemList) {
                BLEPrinter.printColumnsText(itemList[i], itemWidth, columnAliment, [`${LINE}${FONT_SIZE}${FONT_SIZE}${LINE}`, '']);
            }
            BLEPrinter.printText(`${CENTER}${LINE}${FONT_SIZE}..........................................${FONT_SIZE}${LINE}${CENTER}`);
            BLEPrinter.printRaw(base64String);
            BLEPrinter.printText(`${CENTER}${LINE}${FONT_SIZE}-----------------------------------------${FONT_SIZE}${LINE}${CENTER}`);
        }

    } catch (err) {
        console.warn(err);
    }

`

Here is example printing randomly as the name printing out of its order

Here is example printing as it should be when I reprint again with the same settings and data.In short I just pressed the print button again

Currently, I'm printing invoice, when i print it will change the sequence of the order lines. So if is there any option to show the preview before print then, it will save some papers. Any suggestion related to this will be accepted.

Hi thiendangit,

Could you help me print text Vietnamese?

Thank you!

Can someone help me understand and resolve this issue. Anytime I run yarn bootstrap it throws the below error.

error Couldn't find match for "3d2d79c6d9e748dc8296a8524a36fdc604c429c6" in "refs/heads/main,refs/heads/v0.1.7,refs/tags/main,refs/tags/v0.1.2,refs/tags/v0.1.3,refs/tags/v0.1.4,refs/tags/v0.1.6,refs/tags/v1.0.2" for "https://github.com/thiendangit/react-native-thermal-receipt-printer-image-qr.git".
info Visit https://yarnpkg.com/en/docs/cli/install for documentation about this command.
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

Is it possible to adjust the font size?

any way to resolve flipper issue with this library without disabling it?

• We can have a method where we can pass local pdf or remote pdf URL and print it.

I would love to help, just don't know how to move ahead w/ this.

Hello, when I use:
USBPrinter.init().then(()=> {
//list printers
USBPrinter.getDeviceList().then(setPrinters);
}
I get this alert message:

Hi thiendangit,

Thank you very much for your great library. Could you help me on how to increase image size on Android?

Thank you!
Thiện

Hello,
I have two questions. I'm using version 0.1.8.

1. imageWidth and imageHeight in printImageBase64 and printImage settings are small, but when its come out it looks much bigger size. How do we print small size?
   We are testing on Android.
2. How to display the printed image and qrcode in the center? Now its printing on the left side
   Thank you.
   BR,

I am not able to print using iOS but Android is working fine.

2022-04-21 15:59:37.874257+0800 test[1435:481023] nil host used in call to allowsSpecificHTTPSCertificateForHost 2022-04-21 15:59:37.874350+0800 test[1435:481023] nil host used in call to allowsAnyHTTPSCertificateForHost: 2022-04-21 15:59:37.880264+0800 test[1435:481023] -[__NSCFNumber isEqualToString:]: unrecognized selector sent to instance 0xa3e18121c9e90a9c 2022-04-21 15:59:37.881 [warn][tid:com.facebook.react.JavaScript] -[__NSCFNumber isEqualToString:]: unrecognized selector sent to instance 0xa3e18121c9e90a9c

Hello, I am facing the same issue with column printing. I have used promises and async/await

The same issue was opened before and closed - issue

I have created 3 separate common functions for printing and using these for sending text/image/columnText

asyncPrintBill = bill => {
    return new Promise((resolve, reject) => {
      this.Printer.printBill(bill);
      resolve();
    });
  };

  asyncPrintColumnsText = (
    columnHeader,
    columnWidth,
    columnAliment,
    columnStyle,
  ) => {
    return new Promise((resolve, reject) => {
      this.Printer.printColumnsText(
        columnHeader,
        columnWidth,
        columnAliment,
        columnStyle,
      );
      resolve();
    });
  };

  asyncPrintImage = image => {
    return new Promise((resolve, reject) => {
      this.Printer.printImage(image);
      resolve();
    });
  };

On printing screen - I have created multiple functions to craft a full bill (Function for Header, Function for Items, Function for footer, etc)

Below is a Header function -

printBillOrderInfo = () => {
    return new Promise((resolve, reject) => {
      const paymentMethod = this.order?.method
        ? orderPaymentMethods?.[this.order.method] !== undefined
          ? orderPaymentMethods?.[this.order.method]
          : ' - '
        : ' - ';
      const userName =
        this.order?.user?.name !== null ? this.order?.user?.name : ' - ';
      const pickupMethod = orderPickupMethods?.[this.order.action];
      const orderRemark = this.order?.note !== null ? this.order?.note : ' - ';
      const orderDate = codoDateformat(this.order?.create_at);
      Promise.all([
        printerService.asyncPrintColumnsText(
          ['Order Id : ', `${this.order?.order_number}`],
          [23, 23],
          [ColumnAliment.LEFT, ColumnAliment.RIGHT],
          ['', ''],
        ),
        printerService.asyncPrintColumnsText(
          ['Method : ', `${pickupMethod}`],
          [23, 23],
          [ColumnAliment.LEFT, ColumnAliment.RIGHT],
          ['', ''],
        ),
        printerService.asyncPrintColumnsText(
          ['Payment Method : ', `${paymentMethod}`],
          [23, 23],
          [ColumnAliment.LEFT, ColumnAliment.RIGHT],
          ['', ''],
        ),
        printerService.asyncPrintColumnsText(
          ['Note : ', `${orderRemark}`],
          [23, 23],
          [ColumnAliment.LEFT, ColumnAliment.RIGHT],
          ['', ''],
        ),
        printerService.asyncPrintColumnsText(
          ['User : ', `${userName}`],
          [23, 23],
          [ColumnAliment.LEFT, ColumnAliment.RIGHT],
          ['', ''],
        ),
        printerService.asyncPrintColumnsText(
          ['Order Date : ', `${orderDate}`],
          [23, 23],
          [ColumnAliment.LEFT, ColumnAliment.RIGHT],
          ['', ''],
        ),
        printerService.asyncPrintColumnsText(
          [`${DOUBLE_DASHED_LINE}`],
          [52],
          [ColumnAliment.LEFT],
          [''],
        ),
      ]).then(() => {
        resolve();
      });
    });
  };

In the final - Printing function (Calling by print button press), I am again calling promise.all() for asynchronous printing, but all is in vain. It's not working.

print = () => {
      Promise.all([
        this.printBillHeader(),
        this.printBillOrderInfo(),
        this.orderProductHeader(),
        this.orderProductTable(),
        this.orderTotal(),
        this.deliveryAddressPrint(),
        printerService.asyncPrintImage(
          `${MEDIA_URL + this.branch?.shopInfo?.site?.logo}`,
        ),
        printerService.asyncPrintText(
          `<C>Thank you for your visit</C>\n<C>Have a nice day</C>\n`,
        ),
      ])
        .then(() => {
          console.log('print receipt successfully.');
        })
        .catch(error => {
          showMessage({
            message: error?.message || 'Something went wrong while printing',
            type: 'error',
          });
        });
  };

Can you help me with this?

Description

Star Micronics printer doesn't show up in the device list. Please do let me know if it is supported.

Device

• Model Names: Star Micronics TSP650II
• Interface: Bluetooth
• OS: iOS, android

Additional context

This printer works fine on android. Also, I have another printer that works fine on Android and iOS. So, it's probably not a code bug on my end.

Relevant Code

        await Printer.init();
        devices = await Printer.getDeviceList();
        // set selectedDevice as per user preference 
          await BLEPrinter.connectPrinter(
              (selectedDevice as IBLEPrinter)?.inner_mac_address,
          );
        selectedPrinter?.printImageBase64(imageUri, {imageWidth: 400});

Is there any way to align the image to the left?

Can anyone kindly help me on how to add some more styles to Printer.printImage. I will love to apply some width, height and position the image. How do I achieve this please.

I try to install react-native-ping library as you requested in your doc but it's not compitible with react native 0.62 also. Can you please guide me how to overcome from this issue?

Also same thing you can see in this link

`npm i react-native-ping --save

npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: [email protected]
npm ERR! Found: [email protected]
npm ERR! node_modules/react-native
npm ERR! react-native@"0.62.0" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react-native@"^0.41.2 || ^0.57.0" from [email protected]
npm ERR! node_modules/react-native-ping
npm ERR! react-native-ping@"*" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.`

Hi, I have no idea how to print Traditional Chinese on IOS.

Should I use EscPosEncoder ?

Thanks

As soon as I installed this library, my app was crashed only a blank screen was showing.
To run my app again, I needed to delete this library manually because It is not uninstalling by a command also.

I loved the features of this library but want able to install it properly. Can anyone give me a solution?

Error Build Release IOS architecture armv7

Bitcode bundle could not be generated because ‘node_modules/react-native-thermal-receipt-printer-image-qr/ios/PrinterSDK/libPrinterSDK.a(GCDAsyncSocket.o)' was built without full bitcode. All object files and libraries for bitcode must be generated from Xcode Archive or Install build file ‘node_modules/react-native-thermal-receipt-printer-image-qr/ios/PrinterSDK/libPrinterSDK.a' for architecture armv7

Where is the source code libPrinterSDK.a?

I use initWithUUIDString
Printer * selectedPrinter = [[Printer init] initWithUUIDString:@"BEC6E843-DA5D-C3C0-18B5-359366820482"];
=> Error: cannot init a class object.

how to use initWithUUIDString?

Can you help me setting codepage ?

for now printer printing Arabic letters in a reverse way, any way to support changing the print code page while initializing or with connecting to print with different characters?

I have connected successfully and the printing works fine. I am facing an issue with printing after the powered back (on restart) printer. On each print request, I want to check Bluetooth printer status (active or not) and send print commands.

Can you help me with this? @thiendangit

Android Alignment

IOS Alignment

I'm unable to print image from URL. I also tried using printImageBase64 but it prints out random characters.
code:
Printer.printImage(https://static01.nyt.com/images/2012/10/31/dining/31STUFF_APPLES/31STUFF3-jumbo.jpg, {
imageWidth: 300,
imageHeight: 300,
});

result: image not found

Chào bạn @thiendangit .

Mình có thứ với áy in xprinter 420 , sau khi kết nối thành công , mình có in test nhưng không ra bill . Mình không biết lib có hỗ trợ xprinter không. Xin cảm ơn.

I want to print receipt with Chinese language.

const printOrderList = []
for (let i = 0; i < this.props.orderList.length; i++) {
  let temp_finalPrice = Number(this.props.orderList[i].finalPrice.toString())
  temp_finalPrice = temp_finalPrice.toFixed(2)
  const finalString = `${this.props.orderList[i].title.toString()} -(${this.props.orderList[i].uploadData.variant.toString()})`
  printOrderList.push([finalString, this.props.orderList[i].qty.toString(), this.props.orderList[i].price.toString(), temp_finalPrice])
}

output will become like this

any solution i can edit the text height ?

I cannot cut the bill when I calling printer like that:
NetPrinter.printBill(textForPrinting, {
cut: false,
tailingLine: false,
});
NetPrinter.printImageBase64(sign, {
cut: true,
tailingLine: false,
});

npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: [email protected]
Solids-MacBook-Pro:MyBlutooth_build_newplugin_apk2 smi$ npm i react-native-thermal-receipt-printer-image-qr
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: [email protected]
npm ERR! Found: [email protected]
npm ERR! node_modules/react-native
npm ERR! react-native@"0.67.4" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react-native@"^0.41.2 || ^0.57.0" from [email protected]
npm ERR! node_modules/react-native-ping
npm ERR! peer react-native-ping@"" from [email protected]
npm ERR! node_modules/react-native-thermal-receipt-printer-image-qr
npm ERR! react-native-thermal-receipt-printer-image-qr@"" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR! See /Users/smi/.npm/eresolve-report.txt for a full report.

how to remove Line Spacing Ios?

Print Bluetooth Ios

• Timeout: no support timeout scan, connect.
• Print: space between those line is big, can't reduce.
  Sumary: Library very bug.

Is there any way to print local images? I tried converting the image to base64 but the printer is printing garbage data. But I passed image link then it get printed.

Hi' I would like to align center the image of my paper. But I can't setup. Please help me.

// função de Imprimir ingresso
const imprimirComanda = async () => {
try {
const Printer = printerList[tipoImpressora];

  switch (impressora.tipo) {
    case 'ble':
      await BLEPrinter.connectPrinter(
        impressora?.inner_mac_address || ''
      );
      break;
    case 'net':
      await NetPrinter.connectPrinter(
        '192.168.1.100',
        9100
      );
      break;
    case 'usb':
      await USBPrinter.connectPrinter(
        impressora?.vendor_id || '',
        impressora?.product_id || ''
      );
      break;
    default:
  }

  Printer.printImageBase64(imagemImpressao, {
    beep: true,
    imageWidth: 200, // largura da impressão
    imageHeight: 500, // altura da impressão
    paddingX: 100,

    // beep: false,
    // imageWidth: 600, // largura da impressão
    // imageHeight: 1200, // altura da impressão
  });

  Printer.printBill('');

} catch (err) {
  console.warn(err);
}

};

every image has a large white space i don't know why

Can you add documentation on how to setup and print column?

i try to print image but it does not print anything

BLEPrinter.printImage("https://sportshub.cbsistatic.com/i/2021/04/09/9df74632-fde2-421e-bc6f-d4bf631bf8e5/one-piece-trafalgar-law-wano-anime-1246430.jpg");

actually i need to print image from dataUri

BLEPrinter.printImage("uri:data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAApgAAAKYB3X3/OAAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAANCSURBVEiJtZZPbBtFFMZ/M7ubXdtdb1xSFyeilBapySVU8h8OoFaooFSqiihIVIpQBKci6KEg9Q6H9kovIHoCIVQJJCKE1ENFjnAgcaSGC6rEnxBwA04Tx43t2FnvDAfjkNibxgHxnWb2e/u992bee7tCa00YFsffekFY+nUzFtjW0LrvjRXrCDIAaPLlW0nHL0SsZtVoaF98mLrx3pdhOqLtYPHChahZcYYO7KvPFxvRl5XPp1sN3adWiD1ZAqD6XYK1b/dvE5IWryTt2udLFedwc1+9kLp+vbbpoDh+6TklxBeAi9TL0taeWpdmZzQDry0AcO+jQ12RyohqqoYoo8RDwJrU+qXkjWtfi8Xxt58BdQuwQs9qC/afLwCw8tnQbqYAPsgxE1S6F3EAIXux2oQFKm0ihMsOF71dHYx+f3NND68ghCu1YIoePPQN1pGRABkJ6Bus96CutRZMydTl+TvuiRW1m3n0eDl0vRPcEysqdXn+jsQPsrHMquGeXEaY4Yk4wxWcY5V/9scqOMOVUFthatyTy8QyqwZ+kDURKoMWxNKr2EeqVKcTNOajqKoBgOE28U4tdQl5p5bwCw7BWquaZSzAPlwjlithJtp3pTImSqQRrb2Z8PHGigD4RZuNX6JYj6wj7O4TFLbCO/Mn/m8R+h6rYSUb3ekokRY6f/YukArN979jcW+V/S8g0eT/N3VN3kTqWbQ428m9/8k0P/1aIhF36PccEl6EhOcAUCrXKZXXWS3XKd2vc/TRBG9O5ELC17MmWubD2nKhUKZa26Ba2+D3P+4/MNCFwg59oWVeYhkzgN/JDR8deKBoD7Y+ljEjGZ0sosXVTvbc6RHirr2reNy1OXd6pJsQ+gqjk8VWFYmHrwBzW/n+uMPFiRwHB2I7ih8ciHFxIkd/3Omk5tCDV1t+2nNu5sxxpDFNx+huNhVT3/zMDz8usXC3ddaHBj1GHj/As08fwTS7Kt1HBTmyN29vdwAw+/wbwLVOJ3uAD1wi/dUH7Qei66PfyuRj4Ik9is+hglfbkbfR3cnZm7chlUWLdwmprtCohX4HUtlOcQjLYCu+fzGJH2QRKvP3UNz8bWk1qMxjGTOMThZ3kvgLI5AzFfo379UAAAAASUVORK5CYII=")

could you suggest the right way to solve that

thank you very much

when trying to print the image from the URL, it hangs and never prints.

currentPrinter && BLEPrinter.printImage('https://sportshub.cbsistatic.com/i/2021/04/09/9df74632-fde2-421e-bc6f-d4bf631bf8e5/one-piece-trafalgar-law-wano-anime-1246430.jpg');

Problem
While connecting with paired device, which is off, will hangs the whole App
I checked the JS thread its going in -2, which basically affecting performance

How to reproduce
Create a component that automatically connects to a pair bluetooth printer,
but not turned on when the component mounts/renders.

Possible Solution
Connection timeout for BLEPrinter

检测到 thiendangit/react-native-thermal-receipt-printer-image-qr 一共引入了424个开源组件，存在2个漏洞

漏洞标题：Facebook Hermes 缓冲区错误漏洞
缺陷组件：[email protected]
漏洞编号：CVE-2020-1915
漏洞描述：Facebook Hermes是美国Facebook公司的一个JavaScript引擎。该引擎针对React Native应用，去提高移动客户端应用App的性能，但是对浏览器 ＆ Node.js 等服务端基础架构并不适用。
Facebook Hermes JavaScript Interpreter 存在缓冲区错误漏洞，该漏洞使攻击者就可以通过精心制作的JavaScript导致拒绝服务攻击或进一步的内存损坏。
国家漏洞库信息：https://www.cnvd.org.cn/flaw/show/CNVD-2020-60993
影响范围：(∞, 0.8.0)
最小修复版本：0.8.0
缺陷组件引入路径：[email protected]>[email protected]>[email protected]

另外还有2个漏洞，详细报告：https://mofeisec.com/jr?p=ad97a3

@thiendangit you have done fabulously job in this library and i very much appriciate that. I know you may busy with your other stuff but need little help. I successfully print receipt with android device and thermal printer but same thing does not work with iOS. Some value are missing and item does not print at all.

I got below result in android + BLE

And when i do same thing with iOS + (BLE or NET) then got below result in which you can see many info are missing

Any help. would be really appriciable if you have some spare time