如何使用React/JS连接到斑马打印机

问题描述 投票：0回答：2

我们正在开发用于在 React Web 应用程序上连接 Zebra 打印机的软件。但我们无法成功，而且斑马源已经过时了！

我们无法使用他们的 SDK，因为它已经过时了，当我导入 webpack 时，我们遇到了很多错误，无法编译该代码。我现在使用这个 SKD 包装器：https://www.npmjs.com/package/zebra-browser-print-wrapper

当我尝试使用 Zebra 打印机进行打印时出现网络错误。

instrument.ts:159 GET http://localhost:9100/available net::ERR_BLOCKED_BY_CLIENT
Error: TypeError: Failed to fetch
    at o.<anonymous> (21.5eb25857.chunk.js:sourcemap:2:2238456)
    at 21.5eb25857.chunk.js:sourcemap:2:2237749
    at Object.throw (21.5eb25857.chunk.js:sourcemap:2:2237854)
    at c (21.5eb25857.chunk.js:sourcemap:2:2236607)

我正在使用我共享的 NPM js 包中的示例代码。

Zebra 软件和设备已配置并正常工作，但当我尝试使用 Web 应用程序连接到它时，它不起作用。

有人知道如何使用它吗？

javascript reactjs printing web-applications zebra-printers
2个回答
0
投票

我还没有使用 NPM 的包装器，但可以将该库直接集成到 React 项目中。

我的方法是从 Zebra 下载浏览器打印 JavaScript 库并将脚本导入 html 的 

<head>
中。

此外，运行浏览器的设备必须安装本机SDK才能与打印机配对并发送命令。例如，如果网页在 Android 上的 Chrome 浏览器上运行，则必须先在该移动设备上安装适用于 Android 的浏览器打印 SDK。

步骤：

  1. 下载浏览器打印 SDK 和浏览器打印 JavaScript 库，您需要从 他们的网站
    2. 提交请求
  2. 在您的设备上安装浏览器打印应用程序并将其与打印机配对
  3. 下载 JS 库后，解压 
    zebra-browser-print-js-v30216.zip
    并将文件 
    BrowserPrint-Zebra-1.0.216.min.js
    和 
    BrowserPrint-3.0.216.min.js
    复制到你的 React 项目的 
    /public
    目录
  4. 如果您使用的是 Create React App，请将以下内容添加到 
    <head>
...
<head>
  <script src="%PUBLIC_URL%/BrowserPrint-Zebra-1.0.216.min.js" />
  <script src="%PUBLIC_URL%/BrowserPrint-3.0.216.min.js" />
</head>
...
  1. 使用有SDK的设备（例如安装了
    Browser Print App
    的Android手机）访问网页
  2. 然后在React组件中，您可以使用
    window.BrowserPrint
    来访问该库。
  3. 手机会提示您允许或阻止该域名访问SDK，选择允许即可完成

截图：

0
投票

需要设置两件事，首先是用于 React 应用程序的 sdk，其次是需要运行的 PC/Mac 应用程序。该应用程序将公开需要调用的端点。目前它表示您的 PC/MAC 应用程序未运行，因此未找到 localhost:9100 检查这个文档 https://www.zebra.com/content/dam/zebra_new_ia/en-us/solutions-verticals/product/Software/Printer%20Software/Link-OS/browser-print/zebra-browser-print-user-guide -v1-3-2-en-us.pdf

最新问题
© www.soinside.com 2019 - 2024. All rights reserved.