const ctx = document.getElementById('canvas')
 
  const gl = ctx.getContext('webgl')

  // 着色器
  // 创建着色器源码
  const VERTEX_SHADER_SOURCE = `
  void main() {
    // 要绘制的点的坐标
    gl_Position = vec4(0.0, 0.0, 0.0, 1.0)
    // 点的大小
    gl_PointSize = 10.0
  }
  ` // 顶点着色器
  // gl_Position vec4(0.0, 0.0, 0.0, 1.0) x, y, z, w齐次坐标 (x/w, y/w, z/w)
 
  // gl_FragColor vec4(1.0, 0.0, 0.0, 1.0) r, g, b, a
  const FRAGMENT_SHADER_SOURCE = `
  void main() {
    gl_FragColor = vec4(1.0, 0.0, 0.0, 1.0)
  }
  ` // 片元着色器

  // 创建着色器
  const vertexShader = gl.createShader(gl.VERTEX_SHADER)
  const fragmentShader = gl.createShader(gl.FRAGMENT_SHADER)

  gl.shaderSource(vertexShader, VERTEX_SHADER_SOURCE) // 指定顶点着色器的源码
  gl.shaderSource(fragmentShader, FRAGMENT_SHADER_SOURCE) // 指定片元着色器的源码

  // 编译着色器
  gl.compileShader(vertexShader)
  gl.compileShader(fragmentShader)

  // 创建一个程序对象
  const program = gl.createProgram()
  gl.attachShader(program, vertexShader)
  gl.attachShader(program, fragmentShader)

  gl.linkProgram(program)

  gl.useProgram(program)

  // 执行绘制
  // 要绘制的图形是什么，从哪个开始，使用几个顶点
  gl.drawArrays(gl.POINTS, 0, 1)

WebGL: INVALID_OPERATION: useProgram: program not valid

WebGL: INVALID_OPERATION: drawArrays: no valid shader program in use

控制台报了两个警告，请问老师是哪里有问题