base64_encode in javascript [duplicate]

Question

base64_encode in javascript [duplicate]

Navigation

#1 by (2 votes)
#2 by (2 votes)

2

I have an image in the database stored in blob format, I have to use base64_encode in php before returning the ajax request and this is leaving the process kind of slow on the server side. It is possible to do or have some native function in javascript or jQuery to do this same base64_encode side of the client in javascript?

current scenario: javascript

fun.ajaxFoto = custom.ajaxAsync(p,'getFoto','../view/rh/vFuncionarioDetalhes.php');
fun.ajaxFoto.done(function(json){
    $("#fun_foto").empty();
    var img = $('<img>').attr('src',"data:image/jpg;base64," + json.fun_foto);
});

go to the file vFuncionarioDetalhes.php

function getFoto(){
    global $colFuncionario; 

    $obj = (object) $_REQUEST['obj'];

    $json = $colFuncionario->getFoto($obj);

    // QUERIA MUDAR ESSA LINHA ABAIXO E ENTREGAR DIRETO O $json->fun_foto
    $json->fun_foto = base64_encode( $json->fun_foto );
    echo json_encode( $json );
}

Controller

public function getFoto($obj){
            global $c;
            $objResult = new stdClass();

            $c->conCordilheira();
            $mQuery = "select * from tab_cordilheira_ferias_gozo where fun_id =".$obj->fun_id;
            $query = "SELECT fd.foto as fun_foto FROM fundocumento fd where fd.cd_empresa=2011 and fd.cd_funcionario=".$obj->fun_id;

            $result = mssql_query($query);                
            $obj02 = mssql_fetch_object($result);
            //$result = odbc_exec($conn, $query);

            $c->conectarNovamente(@$_SESSION["usuario"],@$_SESSION["senha"]);
            $mResult = mysql_query($mQuery);
            $objM    = mysql_fetch_object($mResult);
            //$obj02 = odbc_fetch_object($result);

            $objResult->fun_dt_ferias = $objM->fun_mes_gozo;                
            $objResult->fun_foto =  $obj02->fun_foto;

            return $objResult;
        }

I'll leave the string in blob format for testing

$json->fun_foto="0xFFD8FFE1348345786966000049492A000800000011000E01020020000000DA0000000F01020005000000FA0000001001020009000000000100001A010500010000000A0100001B0105000100000012010000280103000100000002008A8732010200140000001A01000013020300010000000200838169870400010000004A01000001A40300010000000000898902A40300010000000000837F03A40300010000000000857F06A40300010000000000877E08A403000100000000007D7409A40300010000000000887F0AA403000100000000008179A5C407001C0000002E010000501500002020202020202020202020202020202020202020202020202020202020202000534F4E5900004453432D57333230000048000000010000004800000001000000323031333A30333A30342031363A30353A3234005072696E74494D00303330300000020002000100000001010100000016009A82050001000000580200009D820500010000006002000022880300010000000200FEFB27880300010000004006FFFB00900700040000003032323103900200140000006802000004900200140000007C02000001910700040000000102030002910500010000009002000004920A0001000000980200000592050001000000A002000007920300010000000500FFFF08920300010000000000FFFF09920300010000001000FFFE0A92050001000000A80200007C920700A0120000B002000000A00700040000003031303001A00300010000000100FFFF02A0040001000000B00A000003A0040001000000400E000000A307000100000003FEFEFE01A3070001000000015F605F000000000A000000E80300002D0000000A000000323031333A30333A30342031363A30353A323400323031333A30333A30342031363A30353A32340003000000010..."

javascript jquery

asked by anonymous 03.12.2015 / 18:57

2 answers

2

JavaScript has yes functions that convert from and to base64, see Guilherme Nascimento's answer . However, this does not change the fact that you will have to convert your BLOB image to string before including it in JSON (since JSON is a text format, and does not accept binary data unless expressed in text form) .

Base 64 is one of the most compact ways to represent binary data in text, so any alternative would certainly have overall performance worse. You could try to encode your BLOB in hexadecimal, as proposed in the edit to the question, but even though the processing by the server is faster the JSON download time (and the bandwidth consumed) will be higher, besides of the fact of the conversion client-side take even more time. You ease the load on the server, but at the cost of worse performance and more traffic (your server still has to spend).

My suggestion is to not send the photo in JSON , but simply make a second request to get it. No Ajax. Simply do, on the return of the first Ajax request (which returns a JSON), something like:

fun.ajaxFoto.done(function(json){
    $("#fun_foto").empty();
    var img = $('<img>').attr('src',"pegaFoto.php?funid=" + json.fun_id);
});

And in your pegaFoto.php you already return Blob directly in binary format, with mimetype imagem/jpeg (see the documentation for your bridge with the DBMS how to do this). >

03.12.2015 / 19:42

File Upload I can not connect the localDB with visual studio

score 2 · Accepted Answer

Base64 and javascript

The equivalent functions in javascript are:

window.btoa to encode
window.atob to decode

Source: link

var data = window.prompt("Digite a sua string:");

if (data) {
    var b64 = window.btoa(data);
    alert("Codificado: " + b64);
    alert("Decodificado: " + window.atob(b64));
} else {
    alert("Nada foi digitado");
}

The use in your case would think something like:

var img = $('<img />').attr('src', "data:image/jpg;base64," + window.btoa(SUA STRING));

Performance on the server

What seems to be causing performance problems is not base64 , but rather the way you stored your images, perhaps the best way is to stop using the BLOB and store the images in folders, which in addition to probably having a better performance will be much easier to work with since you will not need to create a dynamic page to display the data.

There are problems when using BLOB and for this I do the @utluiz answer mine:

Data volume : For a low volume of data there may be no problem. On the other hand, for mass storage of data the database is practically unfeasible. Ask Facebook or Google if they would use bank. Facebook, for example, uses a custom file system to make access even quicker and lessen the overhead per file required by traditional file systems.
Clustering : One advantage of the database is if your system runs on multiple servers, everyone will have uniform access to the files. However, using a drive on the network to store the files.
Availability : Will your system have lots of hits? This can overwhelm a traditional database. On the other hand, your HTTP server can use low-level file system access routines to send the stream of data to the client.
Scalability : If volume or availability demand increases, can you add more capacity to the system? It is much easier to split files between different servers than to distribute records from one table to more servers.
Flexibility : backing up, moving files from one server to another, doing some processing on the stored files, all this is easier if the files are in a directory. If you deploy in a client environment, the files on the disk do not make it impossible for you to receive copies of the database for testing. Try asking your client to send terabytes of data for you to review if there is a problem with the database.
Read and write overhead : The computational cost to write to and read data from the database is greater than to read and write directly to a file.

And this is what should be causing your server performance problem.