Image Resolution created with canvas

Good afternoon everyone!

I'm developing an application that does the scanning of a chip with several digital ones, where it is possible for the user to make cuts in these digital ones and then save them in the BLOB database. To do the scanning I'm using Dynamic Web TWAIN, and the image is scanned with 600DPI.

Scanning takes place as follows: the scanned image is stored on a canvas by the TWAIN Web itself. This canvas I did not make available on the screen, because you can not do much with it. What I did was: After generating canvas with the image, I create a img element and assign canvas.toDataURL() to src of that img element, as below:

//essa parte é para pegar a imagem em binário...
imagemData = 'data:image/jpeg;base64,' + DWObject.SaveSelectedImagesToBase64Binary();

//Aqui é onde eu seto aquele binário no componente img, que no caso já está na tela. 
//Essa parte funciona direitinho.
imagem = document.getElementById('imgCortes');
imagem.src = imagemData;

To crop the images, I'm using two libraries: JCrop and Cropper. JCrop I use to make the markings on the tab, where the user will click. When it clicks, a dialog is opened with that piece of the image so that it can perform a more precise cut. Up to that point it is also working very well. The Cropper library is the one that performs the precise cut, in the dialog with the piece of the image.

To create the images that will be displayed in the cut dialog, I use the following code:

    canvas = document.createElement('canvas');

    canvas.width = obj.valor[2];

    canvas.height = obj.valor[3];

    ctx = canvas.getContext('2d');

    ctx.drawImage(getImagemOriginal(), obj.valor[0], obj.valor[1],
        obj.valor[2], obj.valor[3], 0, 0, obj.valor[2], obj.valor[3]);

    imagem = document.getElementById('imgSelecionada');
    imagem.crossOrigin = 'Anonymous';
    imagem.src = canvas.toDataURL('image/jpeg', 1.0);

The variable obj is a json with the dimensions of the markings, used in Jcrop. The getImageOriginal () method takes the binary from the main image, the scanned image.

After the user makes the cuts and everything else, he has it saved. The whole process is working perfectly, with one small problem: The only image I'm sure is 600 dpi is the base image, which comes from the scanner. When the user clicks on some markup to make the cut, I inspect the element and get the binary and open it in the browser. After that I save the image on the machine and look at its properties. It always has 96DPI.

My question is this: how do I make the images that are opened in the cut dialog also have 600DPI?

Thanks in advance for your attention!

PS: This app will run in Chrome.