前端小票打印、网页打印（uniapp、小程序、ESC/POS指令）

在前端框架（如uniapp、小程序）中实现小票打印，可以使用以下方法：

1. 使用小程序的canvas绘制小票内容，然后调用打印API。
2. 使用ESC/POS打印指令，通过连接外部打印机（需要支持ESC/POS指令的硬件）。

以下是使用uniapp实现小票打印的简单示例：

// 在uniapp中使用canvas绘制小票
export default {
  methods: {
    printReceipt() {
      const ctx = uni.createCanvasContext('myCanvas', this);
      // 绘制小票内容
      ctx.setFillStyle('#FFF');
      ctx.fillRect(0, 0, 300, 500);
      ctx.setFillStyle('#000');
      ctx.setFontSize(12);
      ctx.fillText('收银小票', 10, 20);
      // ... 其他绘制内容
 
      // 绘制完成后，执行打印
      setTimeout(() => {
        uni.canvasToTempFilePath({
          canvasId: 'myCanvas',
          success: (res) => {
            // 打印文件
            uni.printFile({
              path: res.tempFilePath,
              success: function (res) {
                console.log('打印成功');
              },
              fail: function (err) {
                console.error('打印失败：', err);
              }
            });
          },
          fail: (err) => {
            console.error('导出图片失败：', err);
          }
        });
      }, 500); // 延时确保绘制完成
    }
  }
}

在实际应用中，你需要根据自己的需求调整小票的格式、内容和打印逻辑。对于ESC/POS指令，你可能需要使用专门的库来生成指令序列，并通过串口发送给打印机。

请注意，以上代码只是示例，实际应用中可能需要处理更多的细节，如错误处理、格式调整、多种纸张尺寸支持等。