请问各位大佬如何在webgl进行碰撞检测？

不请自来。一般有两种方案，给你提供个思路：
一、在WebGL中进行碰撞检测需要使用射线投射和包围盒检测等算法。可以将3D模型转换为包围盒或其他几何形状，然后使用射线来检测物体之间的碰撞。
二、可以使用基于物理的引擎（如Cannon.js和Physi.js）来模拟物体之间的物理运动和碰撞。

第一种方法一般我们是自行编写计算包围盒算法。计算包围盒的一种简单方法是遍历所有要渲染的对象并计算它们的边界框。边界框是一个矩形或立方体，它完全包含对象并且是最小的。对于每个对象，您可以计算它的边界框如下：
1.遍历对象的所有顶点，并将每个顶点的坐标存储在一个数组中。
2.初始化包围盒的最小和最大值，将它们设置为第一个顶点的坐标。
3.遍历剩余的顶点，并更新包围盒的最小和最大值，使其包含所有顶点。
4.使用最小和最大值来计算包围盒的中心和大小。
下面是我从网上的一个类包围盒计算方法，希望对你有启发：

function computeBoundingBox(vertices) {
  var min = [vertices[0], vertices[1], vertices[2]];
  var max = [vertices[0], vertices[1], vertices[2]];

  for (var i = 3; i < vertices.length; i += 3) {
    var x = vertices[i];
    var y = vertices[i+1];
    var z = vertices[i+2];

    if (x < min[0]) {
      min[0] = x;
    }
    if (y < min[1]) {
      min[1] = y;
    }
    if (z < min[2]) {
      min[2] = z;
    }

    if (x > max[0]) {
      max[0] = x;
    }
    if (y > max[1]) {
      max[1] = y;
    }
    if (z > max[2]) {
      max[2] = z;
    }
  }

  var center = [    (min[0] + max[0]) / 2,
    (min[1] + max[1]) / 2,
    (min[2] + max[2]) / 2
  ];

  var size = [    max[0] - min[0],
    max[1] - min[1],
    max[2] - min[2]
  ];

  return { min: min, max: max, center: center, size: size };
}