ReactJS에서 티켓 인쇄하기
8082 단어 printingreactjavascriptpos
React JS를 사용한 Epson ePOS SDK
프로젝트 저장소: https://github.com/rubenruvalcabac/epson-epos-sdk-react
Javascript용 Epson ePOS SDK를 사용하여 Epson 열전사 프린터의 React JS에서 인쇄.
웹 앱에서 인쇄하는 것은 꽤 간단해 보입니다.
window.print() 메서드를 호출하기만 하면 됩니다. 그러나 이러한 접근 방식에는 다음과 같은 몇 가지 단점이 있습니다.많은 시나리오에서 위의 상황은 그리 나쁘지 않습니다. 그러나 수요가 많은 환경(예: POS 애플리케이션)에서는 각각 성능과 생산성에 매우 중요한 영향을 미치는 단점입니다.
따라서 이 프로젝트의 목표는 다음과 같습니다.
JavaScript용 Epson ePOS SDK
이 SDK는 다양한 POS 프린터 모델에 대해 JS와 프린터 간의 통신 솔루션을 제공합니다. 내 솔루션은 이 SDK 사용을 기반으로 합니다.
epos-2.17.0.js 파일을 public 폴더 아래의 프로젝트에 복사합니다.
SDK는 엄격 모드에서 사용하도록 설계되지 않았으므로 React 앱에 포함되려면
public/index.html 파일에서 참조해야 합니다. 
인쇄
네트워크 프린터로 인쇄하는 것은 다른 통신 프로세스와 마찬가지로 장치에 연결하고 요청을 보냅니다.
프린터에 연결
connect 함수는 프린터와의 연결을 열고 추가 인쇄를 위해 열린 상태로 유지합니다.let ePosDev = new window.epson.ePOSDevice();
ePosDevice.current = ePosDev;
ePosDev.connect(printerIPAddress, printerPort, (data) => {
if (data === "OK") {
ePosDev.createDevice(
"local_printer",
ePosDev.DEVICE_TYPE_PRINTER,
{ crypto: true, buffer: false },
(devobj, retcode) => {
if (retcode === "OK") {
printer.current = devobj;
setConnectionStatus(STATUS_CONNECTED);
} else {
throw retcode;
}
}
);
} else {
throw data;
}
});
프린터로 정보 보내기
프린터에 대한 연결이 열리면 인쇄할 내용을 전송하기만 하면 됩니다.
print 함수는 다음을 수행합니다.const print = (text) => {
let prn = printer.current;
if (!prn) {
alert("Not connected to printer");
return;
}
prn.addText(text);
prn.addFeedLine(5);
prn.addCut(prn.CUT_FEED);
prn.send();
};
티켓 디자인
SDK는 프린터 기능을 인쇄하고 사용하기 위한 많은 방법(
addText , addFeedLine 등)을 제공합니다. Here you can check the available SDK methods 티켓을 디자인하는 더 쉬운 방법은 SDK 포함 디자이너를 사용하는 것입니다. SDK 폴더에서
/ReceiptDesigner/index.en.html로 이동합니다.
'편집' 탭에서 형식을 빌드하는 명령을 추가할 수 있고 'API' 탭에서 형식을 인쇄하는 코드를 얻을 수 있습니다.
print() 메소드에서 코드를 얻을 수 있습니다.
Reference
이 문제에 관하여(ReactJS에서 티켓 인쇄하기), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://dev.to/rubenruvalcabac/printing-tickets-on-reactjs-ki6텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
좋은 웹페이지 즐겨찾기
