1
I am searching images from the SQL-server database through PHP and jQuery+AJAX. The image when it is small loads everything full, but when the image is a bit large from this error in Javascript:
Image Corrupt or truncated: data:image/jpg;Base64,/9j/4TSPRXhpZgASUkqAAAAAAAAAA4BAgAAAA2gAAAA8BAgAFAAAAAAAA+gAAABAB...
And the image is as below, I have already made a test opening a direct PHP page without the use of jQuery+AJAX and gives the same problem, so I believe the problem is in PHP or SQL-server.
mssql_connect('192.168.1.xxx', 'sa', 'senhaDoBanco');
mssql_select_db('database');
$query = "exec sp_funcionarioDetalhes";
$result = mssql_query($query);
$obj = mssql_fetch_object($result);
header("Content-type: image/jpeg");
echo $array[1]->fun_foto;
I’ll be more technical, so maybe someone will give more importance to the problem. I’ll run all the codes. job fileDetails.html
<?php
/*
* Maison K. Sakamoto 03/11/2014 - Funcionário Detalhes
*/
session_start('login');
if(!@$_SESSION["conectado"]=='sim'){
echo "<script language='JavaScript'>
alert('Voce nao esta conectado, Favor logar novamente.');
window.location = '../index.php';
</script>";
}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Sistemas BTR - Transportes</title>
<link rel="stylesheet" type="text/css" media="screen" href="../css/grid/style.css" />
<style type="text/css">
#ui-datepicker-div { line-height: 1; }
#fun_ctps { font-size: 8pt; }
.container_12 { width: 76%; padding-top: 30px; }
.container_12 .grid_8 { width: 626px; margin-top: 10px; }
.container_12 .grid_4 { width: 302px; margin-top: 10px; }
.container_12 .grid_2 { margin-top: 10px; }
.container_12 .grid_2.foto{ margin-top: -161px; }
.grid_11 fieldset { border: 1px dotted #666; }
.right { float: right; }
.text-right { text-align: right; }
.ui-widget-content { border: 1px solid #aaaaaa; }
.ui-button { -moz-user-select: none; } /* PARA QUE O TEXTO DO BOTAO NAO SEJA SELECIONADO COM O MOUSE*/
.field-pequeno { width: 112px; }
.field-principal { min-height: 300px; }
.foto{ height: 207px; }
#fun_foto img { max-width: 140px; max-height: 202px; }
.listaFuncionario { min-height: 250px; }
.grid_4.input { width: 300px; }
.coluna1 input {
border: medium none;
font-family: Verdana;
font-size: 12px;
height: 20px;
text-align: center;
width: 140px;
}
.coluna1 textarea {
border: medium none;
font-family: Verdana;
font-size: 11px;
height: 77px;
line-height: 14px;
overflow: hidden;
resize: none;
width: 300px;
}
</style>
</head>
<div class="container_12">
<fieldset class="field-principal ui-widget ui-widget-content ui-corner-all">
<legend class="ui-widget ui-widget-header ui-corner-all">Funcionário - Detalhes</legend>
<div class="grid_4 omega">
<fieldset class="ui-widget ui-widget-content ui-corner-all listaFuncionario">
<legend>NOME</legend>
<div id="div_fun" class="grid_3 alpha"></div>
</fieldset>
</div>
<div class="grid_11 omega">
<fieldset class="grid_2 alpha coluna1"> <legend>FILIAL</legend> <input id="fun_filial" type="text" readonly=""/> </fieldset>
<fieldset class="grid_2 alpha coluna1"> <legend>NASCIMENTO</legend> <input id="fun_dt_nascimento" type="text" readonly=""/> </fieldset>
<fieldset class="grid_2 alpha coluna1"> <legend>ADMISSÃO</legend> <input id="fun_dt_admissao" type="text" readonly=""/> </fieldset>
<fieldset class="grid_2 alpha coluna1"> <legend>DEMISSÃO</legend> <input id="fun_dt_demissao" type="text" readonly=""/> </fieldset>
<fieldset class="grid_2 alpha coluna1"> <legend>FÉRIAS</legend> <input id="fun_dt_ferias" type="text" readonly=""/> </fieldset>
<fieldset class="grid_2 alpha coluna1"> <legend>CPF</legend> <input id="fun_cpf" type="text" /> </fieldset>
<fieldset class="grid_2 alpha coluna1"> <legend>PIS</legend> <input id="fun_pis" type="text" readonly=""/> </fieldset>
<fieldset class="grid_2 alpha coluna1"> <legend>CTPS</legend> <input id="fun_ctps" type="text" readonly=""/> </fieldset>
<fieldset class="grid_2 alpha coluna1"> <legend>SALÁRIO</legend> <input id="fun_salario" type="text" readonly=""/> </fieldset>
<fieldset class="grid_4 alpha coluna1"> <legend>ENDEREÇO</legend> <textarea id="fun_endereco" readonly=""/> </fieldset>
<fieldset class="grid_2 alpha coluna1"> <legend>CEP</legend> <input id="fun_cep" type="text" readonly=""/> </fieldset>
<fieldset class="grid_2 alpha coluna1"> <legend>CIDADE</legend> <input id="fun_cidade" type="text" readonly=""> </fieldset>
<fieldset class="grid_4 alpha coluna1"> <legend>CARGO</legend> <input id="fun_cargo" type="text" readonly=""> </fieldset>
<fieldset class="grid_8 alpha coluna1"> <legend>AÇÕES</legend>
<button id="btGravar" >Gravar Alteração</button>
<button id="btListaFerias">Imprimir Lista de Férias</button>
<button id="btDadosFun">Imprimir Dados do Funcionário</button>
</fieldset>
<fieldset class="grid_2 alpha coluna1 foto"> <legend>FOTO</legend> <div id="fun_foto"></div> </fieldset>
</div>
</fieldset>
</div>
<link rel="stylesheet" href="../js/jqwidgets-ver3.4.0/jqwidgets/styles/jqx.base.css" type="text/css" />
<script type="text/javascript" src="../js/jqwidgets-ver3.4.0/jqwidgets/jqxcore.js"> </script>
<script type="text/javascript" src="../js/jqwidgets-ver3.4.0/jqwidgets/jqxmenu.js"> </script>
<script type="text/javascript" src="../js/jqwidgets-ver3.4.0/jqwidgets/jqxbuttons.js"></script>
<script type="text/javascript" src="../js/jqwidgets-ver3.4.0/jqwidgets/jqxbuttons.js"></script>
<script type="text/javascript" src="../js/jqwidgets-ver3.4.0/jqwidgets/jqxscrollbar.js"></script>
<script type="text/javascript" src="../js/jqwidgets-ver3.4.0/jqwidgets/jqxdata.js"></script>
<script type="text/javascript" src="../js/jqwidgets-ver3.4.0/jqwidgets/jqxlistbox.js"></script>
<script type="text/javascript" src="../js/jqwidgets-ver3.4.0/jqwidgets/jqxgrid.js"></script>
<script type="text/javascript" src="../js/jqwidgets-ver3.4.0/jqwidgets/jqxgrid.columnsresize.js"></script>
<script type="text/javascript" src="../js/jqwidgets-ver3.4.0/jqwidgets/jqxgrid.sort.js"></script>
<script type="text/javascript" src="../js/jqwidgets-ver3.4.0/jqwidgets/jqxgrid.selection.js"></script>
<script type="text/javascript">
loadjscssfile('../js/rh/funcionarioDetalhes.js','js');
</script>
</html>
Job fileDetails.js
/*
* MAISON K. SAKAMOTO - 03/11/2014 - CRIAÇÃO DO ARQUIVO
*/
var fun= {};
fun.start=function(){
$('button').button();
$('#btGravar').click(function(){ });
$('#btListaFerias').click(function(){ });
$('#btDadosFun').click(function(){ });
fun.buscarFuncionarios();
};
fun.buscarFuncionarios=function(){
var array = custom.ajax(new Object(),'buscarFuncionarios','../view/rh/vFuncionarioDetalhes.php');
fun.setListaFuncionarios(array);
};
fun.setListaFuncionarios=function(json){
$("#div_fun").jqxListBox({
source: json, width: 280, height: 500, selectedIndex: 0,
displayMember: 'fun_nome', valueMember: 'fun_id'
});
$("#div_fun").bind('select', function(event){
if (event.args){
var obj = event.args.item.originalItem;
fun.preencheForm(obj);
}
});
var t = $("#div_fun").jqxListBox('getSelectedItem');
fun.preencheForm(t.originalItem);
};
fun.preencheForm = function(obj){
$("#fun_filial").val( obj.unidade );
$("#fun_dt_nascimento").val( obj.fun_dt_nascimento );
$("#fun_dt_admissao").val( obj.fun_dt_admissao );
$("#fun_dt_demissao").val( obj.fun_dt_demissao );
$("#fun_dt_ferias").val( obj.fun_dt_ferias );
$("#fun_cargo").val( obj.fun_cargo );
$("#fun_cpf").val( obj.fun_cpf );
$("#fun_pis").val( obj.fun_pis );
$("#fun_ctps").val( obj.fun_ctps_numero + "" +obj.fun_ctps_serie+ " " +obj.fun_ctps_uf);
$("#fun_salario").val( obj.fun_salario );
$("#fun_endereco").val( obj.fun_endereco +' \r\nNº '+obj.fun_n_endereco+' \r\n'+obj.fun_bairro );
$("#fun_cep").val( obj.fun_cep );
$("#fun_cidade").val( obj.fun_cidade );
//$("#fun_foto").empty().append( $('<img>').attr('src',"data:image/png;base64," + obj.fun_foto) );
var img = $('<img>').attr('src',"data:image/jpg;base64," + obj.fun_foto);
$("#fun_foto").empty().append( img );
};
fun.start();
vFunctioning.php file (Viewer)
include_once '../../controller/OpenDB.php';
include_once '../../controller/ColFuncionario.php';
@session_start('login');
$colFuncionario = new ColFuncionario();
$c = new OpenDB(); // CLASSE DO BANCO DE DADOS
$funcao = $_REQUEST['funcao'];
call_user_func($funcao);
function buscarFuncionarios(){
global $colFuncionario;
global $c;
$c->conCordilheira();
$array = $colFuncionario->buscarFuncionarios();
echo json_encode( $array );
}
File Colfuncionario.php ( controller )
<?php
/*
* Autor: Maison K. Sakamoto
* Revisao: 0
* Data: 25/07/2012
*
* Descricao:
* Controle de Funcionario
*/
class ColFuncionario{
public function __construct(){
}
public function inserirFuncionario($obj){
//STRTOUPPER RESOLVIDO PROBLEMA DE ACENTUAÇÃO EM MAIUSCULAS
$query = "insert into tab_funcionario(cargo_id,func_nome,func_hab,func_hab_venc,func_cpf) values
($obj->cargo_id,'".strtoupper(strtr($obj->func_nome,"áéíóúâêôãõàèìòùç","ÁÉÍÓÚÂÊÔÃÕÀÈÌÒÙÇ")).
"','$obj->func_hab',STR_TO_DATE('$obj->func_hab_venc','%d/%m/%Y'),'$obj->func_cpf')";
mysql_query($query);
return "mysql_info: ".mysql_info()."<br/>"."mysql_error: ".mysql_error()."<br/>query: ".$query;
}
public function getCargos(){
$query = "select * from tab_cargo";
$result = mysql_query($query);
while($obj = mysql_fetch_object($result)){
$array[] = $obj;
}
return $array;
}
public function getMotoristas(){
$query = "select * from tab_funcionario where cargo_id = 1 and func_inativo is null ORDER BY func_nome";
$result = mysql_query($query);
while($obj = mysql_fetch_object($result)){
$array[] = $obj;
}
return $array;
}
// BUSCA FUNCIONARIOS DO SQL-SERVER BANCO DE DADOS CORDILHEIRA
public function buscarFuncionarios(){
//ini_set('mssql.charset', 'UTF-8');
$query = "exec sp_funcionarioDetalhes";
$result = mssql_query($query);
while($obj = mssql_fetch_object($result)){
$obj->fun_nome = mb_convert_encoding($obj->fun_nome, 'UTF-8');
$obj->fun_cidade = mb_convert_encoding($obj->fun_cidade, 'UTF-8');
$obj->unidade = mb_convert_encoding($obj->unidade, 'UTF-8');
$obj->fun_endereco = mb_convert_encoding($obj->fun_endereco, 'UTF-8');
$obj->fun_bairro = mb_convert_encoding($obj->fun_bairro, 'UTF-8');
$obj->fun_cargo = mb_convert_encoding($obj->fun_cargo, 'UTF-8');
$obj->fun_foto = base64_encode( $obj->fun_foto);
$array[] = $obj;
}
return $array;
}
}
File Opendb.php
class OpenDB{
public function conCordilheira(){
//1 passo - Conecta ao servidor SQL 2008 R2 Cordilheira
$conn = mssql_connect('192.168.1.xxx', 'sa', 'senhaDoBanco');
mssql_select_db('databaseDoMeuSqlServer');
//$conn = sqlsrv_connect( $serverName, $connectionInfo);
if( $conn ) {
return $conn;
//echo "Connection established.<br />";
}else{
echo "Connection could not be established.<br />";
die( print_r(mssql_erro(), true));
}
}
}
outworking
I’ll test these for 1 me.
– SneepS NinjA
didn’t work out :(
– SneepS NinjA
Just for the record, the two directives that needed to be made in PHP.INI were uncommented and after they were changed you restarted the server, right? And the other, you invoked ini_set() before making the query to the field in question, right?
– Bruno Augusto
now it worked out, I tested it right p/ see which parameter does the magic, is mssql.textsize, I did not know the size of the images, but it has more than 2mb each one, and I pulled in an array of I don’t know how many employees, now I will arrange in php p/ decrease these images before sending via ajax p/ page, thanks even.
– SneepS NinjA