WebGL mass framebuffer multisampling dont work

Question

I tried to use edge detection in webgl. I got the edge effect I wanted, but the edge jagged is serious. I searched the following information, and the framebuffer multisampling related to mass can solve this problem, but I tried to add the example in demo to my program, and found that there was no effect

var gl = canvas.getContext("webgl2", {
    antialias: false
});

framebuffer = gl.createFramebuffer();
// rgb texture
gl.bindTexture(state.gl.TEXTURE_2D, texture);
// ... texImage2D  texParameteri set up
// depth texture
gl.bindTexture(state.gl.TEXTURE_2D, depthTexture);
// ... texImage2D  texParameteri set up


// Create a with normals data FBO
normalFramebuffer = gl.createFramebuffer();
gl.bindTexture(gl.TEXTURE_2D, normalTexture);
// ... texImage2D  texParameteri set up



//Prepare for multisampling msFbo
var msFbo = gl.createFramebuffer();
var colorRenderbuffer = state.gl.createRenderbuffer();
gl.bindRenderbuffer(gl.RENDERBUFFER, colorRenderbuffer);
gl.renderbufferStorageMultisample(gl.RENDERBUFFER, 4, gl.RGBA8, 480, 480);

gl.bindFramebuffer(state.gl.FRAMEBUFFER, msFbo);
gl.framebufferRenderbuffer(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.RENDERBUFFER, colorRenderbuffer);
gl.bindFramebuffer(gl.FRAMEBUFFER, null);




gl.bindFramebuffer(gl.FRAMEBUFFER, framebuffer);
 obj.render('rgbaData shader');
gl.bindFramebuffer(gl.FRAMEBUFFER, normalFramebuffer);
 obj.render('normalsData shader');
gl.bindFramebuffer(gl.FRAMEBUFFER, null);
    
// bind msFbo
gl.bindFramebuffer(gl.FRAMEBUFFER, msFbo);

gl.useProgram('my edge detection shader');
gl.uniform1i(texture, 0);
gl.uniform1i(depthTexture, 1);
gl.uniform1i(normalTexture, 2);
gl.drawElements(state.gl.TRIANGLES, n, state.gl.UNSIGNED_BYTE, 0);


// use blitFramebuffer
gl.bindFramebuffer(gl.READ_FRAMEBUFFER, msFbo);
gl.bindFramebuffer(gl.DRAW_FRAMEBUFFER, null);
gl.blitFramebuffer(0, 0, 480, 480,
    0, 0, 480, 480, gl.COLOR_BUFFER_BIT, gl.NEAREST);