Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

132
Visualizações
Take Screenshot Using JS

On this image I want to when you click button take screenshot not show the dialog box red line box anyone help me

<button id="cake">Take Screen</button>

<canvas id="fake"></canvas>


const canIRun = navigator.mediaDevices.getDisplayMedia

const takeScreenShot = async () => {
  const stream = await navigator.mediaDevices.getDisplayMedia({
    video: {
      mediaSource: 'screen'
    },
  })
  // get correct video track
  const track = stream.getVideoTracks()[0]
  // init Image Capture and not Video stream
  const imageCapture = new ImageCapture(track)
  // take first frame only
  const bitmap = await imageCapture.grabFrame()
  // destory video track to prevent more recording / mem leak
  track.stop()

  const canvas = document.getElementById('fake')
  // this could be a document.createElement('canvas') if you want
  // draw weird image type to canvas so we can get a useful image
  canvas.width = bitmap.width
  canvas.height = bitmap.height
  const context = canvas.getContext('2d')
  context.drawImage(bitmap, 0, 0, bitmap.width, bitmap.height)
  const image = canvas.toDataURL()

  // this turns the base 64 string to a [File] object
  const res = await fetch(image)
  const buff = await res.arrayBuffer()
  // clone so we can rename, and put into array for easy proccessing
  const file = [
    new File([buff], `photo_${new Date()}.jpg`, {
      type: 'image/jpeg',
    }),
  ]
  return file
}

const button = document.getElementById('cake').onclick = () => canIRun ? takeScreenShot() : {}
about 4 years ago · Juan Pablo Isaza
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda