使用react-native-esc-pos-printer发现打印机时出现问题

Question

我正在开发一个 React Native 应用程序，我需要使用“react-native-esc-pos-printer”库实现打印机发现。不幸的是，我遇到了一个问题，打印机发现过程似乎没有按预期工作。

我无法使用“react-native-esc-pos-printer”库中的“start”函数发现打印机。当我使用适当的选项调用“start”函数时，打印机发现不会启动，并且没有检测到打印机。我已经仔细检查了代码和权限，但无法确定问题的根本原因。

Discovery.tsx 文件

import React, { memo, useCallback } from 'react';
import { View, StyleSheet, Text } from 'react-native';
import { usePrintersDiscovery, DiscoveryFilterOption } from 'react-native-esc-pos-printer';
import { PrintersList, Button, ScreenTitle } from './components';
import { useNavigation } from '@react-navigation/native';

export const Discovery = memo(() => {
  const {
    start,
    printerError,
    isDiscovering,
    printers,
  } = usePrintersDiscovery();

  const navigation = useNavigation();

  const handlePrinterPress = useCallback(
    (printer) => {
      if (printer) {
        navigation.navigate('SimplePrint', { printer });
      }
    },
    [navigation]
  );

  const handleSearchPress = useCallback(() => {
    const startDiscoveryProcess = async () => {
      try {
        await start({
          timeout: 10000,
          filterOption: {
            deviceType: DiscoveryFilterOption.TYPE_ALL,
          },
        });
      } catch (error) {
        console.error('Error starting printer discovery:', error);
      }
    };

    startDiscoveryProcess();
  }, [start]);

  return (
    <View style={styles.container}>
      <View style={styles.contentContainer}>
        <ScreenTitle title={'Discovery Printer'} />
      </View>
      <PrintersList onPress={handlePrinterPress} printers={printers} />
      <View style={styles.contentContainer}>
        <Button
          loading={isDiscovering}
          title="Search"
          onPress={handleSearchPress}
        />
        {printerError && (
          <Text style={styles.errorText}>{printerError.message}</Text>
        )}
      </View>
    </View>
  );
});

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fcf9f9',
    alignItems: 'center',
    justifyContent: 'center',
  },

  contentContainer: {
    flex: 1,
    alignItems: 'center',
    justifyContent: 'center',
  },

  errorText: {
    color: 'red',
    fontSize: 16,
    marginTop: 20,
  },
});

SimplePrint.tsx 文件

import React, { useState, memo, useCallback } from 'react';
import { View, StyleSheet, Text } from 'react-native';
import { usePrintersDiscovery, DiscoveryFilterOption } from 'react-native-esc-pos-printer';
import { PrintersList, Button, ScreenTitle } from './components';
import { useNavigation } from '@react-navigation/native';

export const SimplePrint = memo(() => {
  const navigation = useNavigation();
  const { start, printerError, isDiscovering, printers } = usePrintersDiscovery();

  const handleSearchPress = useCallback(() => {
    start({
      timeout: 10000,
      filterOption: {
        deviceType: [
          DiscoveryFilterOption.TYPE_BLUETOOTH,
          DiscoveryFilterOption.TYPE_USB,
        ],
      },
    });
  }, [start]);

  return (
    <View style={styles.container}>
      <View style={styles.contentContainer}>
        <ScreenTitle title={'Simple Print'} />
      </View>
      <PrintersList
        onPress={(printer) => {
          if (printer) {
            navigation.navigate('SimplePrint', { printer });
          }
        }}
        printers={printers}
      />
      <View style={styles.contentContainer}>
        <Button loading={isDiscovering} title="Search" onPress={handleSearchPress} />
        {printerError ? (
          <Text style={styles.errorText}>{printerError.message}</Text>
        ) : null}
      </View>
    </View>
  );
});

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fcf9f9',
    alignItems: 'center',
    justifyContent: 'center',
  },

  contentContainer: {
    flex: 1,
    alignItems: 'center',
    justifyContent: 'center',
  },

  errorText: {
    color: 'red',
    fontSize: 16,
    marginTop: 20,
  },
});

Android 清单

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.asasiibsc">

    <!-- Permissions -->
    <uses-permission android:name="android.permission.INTERNET" />
    <uses-permission android:name="android.permission.BLUETOOTH_CONNECT" />
    <!-- Use the new Bluetooth Scan API starting from Android 12 -->
    
    <uses-permission android:name="android.permission.BLUETOOTH" />
    <uses-permission android:name="android.permission.BLUETOOTH_ADMIN" />
    <uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />
    <uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" />
    
    <!-- Update or remove maxSdkVersion as needed -->
    <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
    <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />

    <application
        android:name=".MainApplication"
        android:label="@string/app_name"
        android:icon="@mipmap/ic_launcher"
        android:roundIcon="@mipmap/ic_launcher_round"
        android:allowBackup="false"
        android:theme="@style/AppTheme">

        <!-- Main Activity -->
        <activity
            android:name=".MainActivity"
            android:screenOrientation="landscape"
            android:label="@string/app_name"
            android:configChanges="keyboard|keyboardHidden|orientation|screenLayout|screenSize|smallestScreenSize|uiMode"
            android:launchMode="singleTask"
            android:windowSoftInputMode="adjustResize"
            android:exported="true">

            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>

            <!-- USB Device Attached Intent Filter -->
            <intent-filter>
                <action android:name="android.hardware.usb.action.USB_DEVICE_ATTACHED" />
            </intent-filter>
        </activity>

        <!-- USB Device Attached Meta-data -->
        <meta-data
            android:name="android.hardware.usb.action.USB_DEVICE_ATTACHED"
            android:resource="@xml/device_filter" />
    </application>
</manifest>

我尝试过的：

1. 检查并确保向应用程序授予必要的权限（蓝牙、USB 等）。

2. 已验证

   react-native-esc-pos-printer

   库已正确安装且其版本是最新的。

3. 检查了用于测试的设备的兼容性，以确认对打印机发现过程的支持。

4. 查看了

   react-native-esc-pos-printer

   库的文档，了解打印机发现所需的任何特定配置或步骤。

预期结果： 我期望

start

库中的

react-native-esc-pos-printer

函数能够成功启动打印机发现过程并提供已发现打印机的列表。

Answer 1

您在发现启动功能中使用了错误的过滤选项。您可以从包中导入

deviceType

，而不是使用

portType

，而是使用

DiscoveryPortType.PORTTYPE_ALL

并将值设置为

DiscoveryPortType

。

start({
 timeout: 1000,
 filterOption: { portType: DiscoveryPortType.PORTTYPE_ALL }
})