1

まず、StackOverflow コミュニティの皆様のご協力に感謝いたします。ありがとう!!

私の最初の質問でわかるように、私は Wordpress、JavaScript、および PHP を使用するのが初めてで (仕事のために SQL についてある程度の知識があります)、いくつかの「単純な」側面でいくつかの問題を見つけました。私はこの問題の答えを探していましたが、見つけられなかったので、誰かが私に指示を与えることができれば非常に感謝しています. 契約は次のとおりです。

ここでわかるように、私は非常に単純な式を持っています。私が望むのは、独自の SQL クエリを使用して MySQL DB のテーブルにデータを保存することだけです。Wordpressを使用しているのと同じDBです。私はよく調べて、PHP + Javascript でこれを行う「簡単な」方法を見つけました。非常に明確な指示。

  1. このファイル (mysqlwslib.js) をスクリプト フォルダー (私の場合は、テーマ フォルダーの "js" フォルダー) に配置します。

-

var urlMysqlwsphp="../mysqlws.php";
var mysql_db_name ="revistae_wp1";
// ---------------------------------------

// Acceso a mysql
function mysql_use( dbname) {
    mysql_db_name = dbname; 
}
function mysql_select_query(query) {
    var c="selectQuery";
    var xmlresp = doRequest(c, query);
    return responseContent(xmlresp);
}
function mysql_update_query(query) {
    var c="updateQuery";
    var xmlresp = doRequest(c, query);
    return responseContent(xmlresp);    
}
function mysql_col_names(tableName) {
    var c="getColNames";
    var xmlresp = doRequest(c, tableName);
    return responseContent(xmlresp);
}
// ---------------------------
// Utilidades DOM-HTML
// ---------------------------
function $(elementId) {
    return document.getElementById(elementId);
}
function setElementContent( element, content) {
    // Asigna el valor de content a la propiedad
    // innerHTML del element. El element puede ser una
    // referencia o un String con el id
    var domElement=null;
    if(typeof element == 'string') {
        domElement = document.getElementById(element);
    }
    if (domElement != null) {
        domElement.innerHTML = content;         
    }
}
function getDocHeight() {
    var D = document;
    return Math.max(
        Math.max(D.body.scrollHeight, D.documentElement.scrollHeight),
        Math.max(D.body.offsetHeight, D.documentElement.offsetHeight),
        Math.max(D.body.clientHeight, D.documentElement.clientHeight)
    );
}
function setElementHeight(obj, h) {
    if(typeof obj == 'string') {
        obj = $(obj);
    }   
    obj.style.height = h +'px';
}
function getElementHeight( obj) {
    var divHeight = 0;
    if(typeof obj == 'string') {
        obj = $(obj);
    }
    if(obj.offsetHeight) {
        divHeight=obj.offsetHeight;
    } else if(obj.style.pixelHeight){
        divHeight=obj.style.pixelHeight;
    }
    return divHeight;
}
function getWindowHeight() {
    var h = 0;
    if (typeof window.innerWidth != 'undefined') {
        h=window.innerHeight;
    } else if (typeof document.documentElement != 'undefined'
            && typeof document.documentElement.clientWidth != 'undefined'
            && document.documentElement.clientWidth != 0) {
        h = document.documentElement.clientHeight;
    } else {
        h = document.getElementsByTagName('body')[0].clientHeight;
    }
    return h;
}
function getWindowWidth() {  
    var w = 0;
    if (typeof window.innerWidth != 'undefined') {
        w = window.innerWidth;
    } else if (typeof document.documentElement != 'undefined'
            && typeof document.documentElement.clientWidth != 'undefined'
            && document.documentElement.clientWidth != 0) {
        w = document.documentElement.clientWidth;
    } else {
        w = document.getElementsByTagName('body')[0].clientWidth;
    }
    return w;  
}  
function getTamanoVentana() {
    var Tamanyo = [ 0, 0 ];
    if (typeof window.innerWidth != 'undefined') {
        Tamanyo = [ window.innerWidth, window.innerHeight ];
    } else if (typeof document.documentElement != 'undefined'
            && typeof document.documentElement.clientWidth != 'undefined'
            && document.documentElement.clientWidth != 0) {
        Tamanyo = [ document.documentElement.clientWidth,
                document.documentElement.clientHeight ];
    } else {
        Tamanyo = [ document.getElementsByTagName('body')[0].clientWidth,
                document.getElementsByTagName('body')[0].clientHeight ];
    }
    return Tamanyo;
}  
function createTableFromArray(arrayDatos, arrayCabeceras) {
    // Devuelve una <table>....</table> con los datos del arrayDatos
    // Si se incluye el parametro arrayCabeceras se inserta como fila 1
    // Se puede omitir el parametro arrayCabeceras
    // Devuelve : un String con la <table>...</table>
    var array = arrayDatos;
    if(arrayCabeceras != null) {
        if(arrayCabeceras.length == arrayDatos[0].length) {
            array.unshift(new Array());
            array[0]=arrayCabeceras;
        }
    }
    // Devuelve un array <table>...</table>
    var cad="";
    if(array == null ){
        return cad;
    }
    cad ="<table border='1'>";
    var nf, nc;
    if (array[0][0] != null) {
        // Es de dos dimensiones
        nf = array.length;
        nc = array[0].length;
        for(i=0; i< nf;  i++) {
            cad += "<tr>";
            for(j=0; j<nc; j++) {
                cad += "<td>"+array[i][j]+"</td>";
            }
            cad += "</tr>";
        }
    } else if (array[0] != null ){
        nf = 1;
        nc = array.length;
        cad += "<tr>";
        for(j=0; j<nc; j++) {
            cad += "<td>"+array[j]+"</td>";
        }
        cad += "</tr>";
    } else {
        nf = 1;
        nc = 1;
        cad += "<tr>";
        cad += "<td>"+array+"</td>";
        cad += "</tr>";
    }
    cad += "</table>";
    return cad;
}
/*
 * Utilidades de fechas
 */
function parseFechaUTC(cadfecha, cadhora) {
    // Parametros :
    //      cadfecha = "2010-12-21"
    //      cadhora = "12:00:00" (se puede omitir)
    // Devuelve :
    //      objeto Date
    var dt = new Date(); 
    var y = parseInt(cadfecha.substr(0,4));
    var m = parseInt(cadfecha.substr(5,2))-1;
    var d = parseInt(cadfecha.substr(8,2));
    dt.setUTCFullYear(y,m,d);
    var h = 0;
    var min = 0;
    var s = 0;
    if (cadhora != null) {
        h = parseInt(cadhora.substr(0,2));
        min = parseInt(cadhora.substr(3,2));
        s = parseInt(cadhora.substr(6,2));
    }
    dt.setUTCHours(h, min, s, 0);
    return dt;
}
function intToString(number, digits) {
    // Convierte en cadena un numero entero
    // Rellena con ceros a la izda hasta numero de digitos
    var cad = number.toString();
    if(cad.length < digits) {
        var dif = digits - cad.length;
        var ceros ="";
        for (var i=0; i<dif; i++) {
            ceros += "0";
        }
        cad = ceros + cad;
    }
    return cad;
}
function getCadFechaUTCFromJSDate(date) {
    var y = date.getUTCFullYear();
    var m = intToString(date.getUTCMonth()+1,2);
    var d = intToString(date.getUTCDate(),2);
    var cad = y +"-"+ m +"-"+ d;
    return cad;
}
function getCadHoraUTCFromJSDate(date) {
    var h = intToString(date.getUTCHours(),2);
    var m = intToString(date.getUTCMinutes(),2);
    var s = intToString(date.getUTCSeconds(),2);
    var cad = h +":"+ m +":"+ s;
    return cad;
}
// ----------------------------
// xmlresponse
// ----------------------------
function responseCode(xmlresp) {
    var lstCode = xmlresp.getElementsByTagName("statusCode");
    var cod = lstCode[0].childNodes[0].nodeValue;
    return cod;
}
function responseText(xmlresp) {
    var lstDesc = xmlresp.getElementsByTagName("statusText");
    var desc = lstDesc[0].childNodes[0].nodeValue;
    return desc;
}
function responseContent(xmlresp) {
    // Devuelve un array con el contenido.
    // El array puede ser multidimensional
    if(xmlresp == null) {
        return null;
    }
    var arResp = new Array();
    var lstCtnt = xmlresp.getElementsByTagName("content");
    var childs = lstCtnt[0].childNodes[0];
    if ((childs != null) && (childs.nodeType == 1)) {
        // Contenido elementos <item>
        var lstItem = lstCtnt[0].getElementsByTagName("item");
        var numItem = lstItem.length;
        for (i = 0; i < numItem; i++) {
            var ar = lstItem[i].childNodes[0].nodeValue.split(",");
            arResp.push(ar);
        }
    } else if ((childs != null) && (childs.nodeType == 3)) {
        // Contenido una cadena separada por comas
        var ctnt = lstCtnt[0].childNodes[0].nodeValue;
        arResp = ctnt.split(",");
    } else {
        arResp = null;
    }
    return arResp;
}
function alertXmlResp(responsexml) {
    var code = responseCode(responsexml);
    var txt = responseText(responsexml);
    var ctnt = responseContent(responsexml);
    alert(code + ", " + txt + "\n" + ctnt);
}

// ---------------------------------
// AJAX Request
// ---------------------------------
function doRequest(comm, pars) {
    var req = new ajaxRequest();
    if (pars == "") {
        pars = "1";
    }
    var url = urlMysqlwsphp+"?db="+mysql_db_name+"&c=" + comm + "&p=" + pars;
    req.open("GET", url, false);
    req.send(null);
    return req.responseXML;
}
function loadXmlDoc(name) {
    var req = new ajaxRequest();
    req.open("GET", name, false);
    req.send(null);
    return req.responseXML;
}
function loadXMLString(txt) {
    if (window.DOMParser) {
        parser = new DOMParser();
        xmlDoc = parser.parseFromString(txt, "text/xml");
    } else { // Internet Explorer
        xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
        xmlDoc.async = "false";
        xmlDoc.loadXML(txt);
    }
    return xmlDoc;
}
function ajaxRequest() {
    try {
        var request = new XMLHttpRequest();
    } catch (e1) {
        try {
            request = new ActiveXObject("Msxml2.XMLHTTP");
        } catch (e2) {
            try {
                request = new ActiveXObject("Microsoft.XMLHTTP");
            } catch (e3) {
                request = false;
            }
        }
    }
    return request;
}

2 この PHP ファイル (mysqlws.php) を親フォルダーに配置します (前のファイルでも参照されていることに注意してください。ターゲット テーブルが同じ DB にあるため、このファイルの接続データは wp-config.php ファイルから抽出されたものです)。 ):

<?php
header('Content-Type: text/xml');
header("Cache-Control: no-store, no-cache, must-revalidate");

// Los valores $host, $user, $pw, $db se deben de adaptar a cada instalación
$host="localhost";
$user=*{MyUser}*;
$pw=*{MyPass}*;
// Indicar el nombre de una base de datos que se abrirá por defecto
$db=*{MyDBName}*;


if(isset($_GET['c']) and isset($_GET['p'])) {
    $command=$_GET['c'];
    $params = $_GET['p'];
    if(isset($_GET['db'])) {
        $db = $_GET['db'];
    }
    $resp = processcommand($command, $params);
} else {
    $resp=createResponse(0, "ERROR", "Parametros HTTPGET incorrectos");
}
echo $resp;
return;

function processCommand($command, $params) {
    // processCommand
    // procesa un comando válido recibido en la llamada a la página. 
    // Es llamado desde el flujo principal
    // Distribuye el trabajo a la rutina correspondiente y
    // devuelve una respuesta en formato xml

    // Declarar la respuesta
    $respxml=null;

    // Derivar a la rutina adecuada
    if(strcmp("updateQuery",$command)== 0) {
        $respxml=updateQuery($params);
    } else if (strcmp("selectQuery",$command)==0) {
        $respxml=selectQuery($params); 
    } else if (strcmp("getColNames",$command)==0) {
        $respxml=getColNames($params); 
    } else {
        $respxml=createResponse(0,"ERROR","El comando no existe");
    }

    return $respxml;
}


function updateQuery($query) {
// Ejecuta un comando tipo UPDATE, INSERT, DELETE,... en la base de datos
// $query = String con el comando   
// devuelve: xmlresponse con el resultado

    GLOBAL $host, $user, $pw, $db;

    // Abrir la conexión con mysql
    $conn = opendb($host, $user, $pw, $db);
    if(!$conn) {
        return createResponse(-2,"ERROR","Error de conexión.-$conn");
    }


    // Realizar la consulta a la B.D.
    $result=mysql_query($query, $conn);

    $ar = mysql_affected_rows();

    $cod = 0;
    $text ="ERROR";
    $desc ="-1";

    if($result == true) {
        $cod = 0;
        $text ="OK";
        $desc =$ar; 
    }
    $response = createResponse($cod,$text,$desc);

    // Cerrar la conexión
    closedb($conn);

    // Devolver el resultado
    return $response;
};

function selectQuery($query) {
// Ejecuta un comando tipo SELECT en la base de datos
// query = String con el comando    
// devuelve: xmlresponse con el resultado

    GLOBAL $host, $user, $pw, $db;

    // Abrir la conexión con mysql
    $conn = opendb($host, $user, $pw, $db);
    if(!$conn) {
        return createResponse(-2,"ERROR","Error de conexión.-$conn");
    }

    // Realizar la consulta a la B.D.
    $result=mysql_query($query, $conn);

    if ($result) {
        $nc = mysql_num_fields($result);

        $cad="";
        while( $row = mysql_fetch_array($result, MYSQL_BOTH)) {
            $cad .="<item>";
            for($i=0; $i<$nc; $i++) {
                $cad .= $row[$i];
                if($i<$nc-1) {
                    $cad .= ",";
                }
            }
            $cad .= "</item>";
        }

        mysql_free_result($result);

        $response = createResponse(1, "OK", $cad);
    } else {
        $response = createResponse(0, "ERROR", "Error en la llamada SQL"); 
    }
    // Cerrar la conexión
    closedb($conn);

    // Devolver el resultado
    return $response;
};

function getColNames($nombreTabla) {
    // Devuelve un array con los nombres de las columnas de la 
    // tabla pasada como argumento
    // Si error devuelve array nulo;    

    // Establecer las variables globales
    GLOBAL $host, $user, $pw, $db;

    // Abrir la conexión con mysql
    $conn = opendb($host, $user, $pw, $db);
    if(!$conn) {
        return createResponse(-2,"ERROR","Error de conexión.-$conn");
    }

    // Realizar la consulta a la B.D.
    $query = "SELECT * FROM $nombreTabla";
    $result=mysql_query($query, $conn);
    if ($result) {

        $numcols = mysql_num_fields($result);

        $resp = "";
        for($i=0; $i< $numcols; $i++) {
            $resp .= mysql_field_name($result, $i);
            if($i < $numcols-1) {
                $resp .= ",";
            }   
        }
        mysql_free_result($result);
        $response = createResponse(1, "OK", $resp);

    } else {
        $response = createResponse(0, "ERROR", "Error en acceso SQL");

    }


    // Cerrar la conexión
    closedb($conn);

    // Devolver el resultado
    return $response;
};

function opendb($host, $user, $pw, $db) {
    // opendb
    // Establece conexión con el servidor $host y hace un USE de la base de datos $db
    // Parametros:
    //    $host
    //    $user
    //    $pw : password
    //    $db : Base de datos sobre la que se hará el USE 
    // Devuelve:
    //    Referencia a la conexión abierta o null si hay errores
    //
    $conn = mysql_connect($host, $user, $pw);
    if(!$conn) {
        return null;
    }
    //echo "connected<br/>";
    $resp = mysql_select_db($db, $conn);
    if($resp != true) {
        return null;
    }
    //echo "used<br/>";
    return $conn;
};

function closedb($conn) {
    // closedb()
    // Cierra la conexión con la base de datos
    // Parámetros:
    //     $conn Referencia al recurso de la conexión con la B.D.
    // Devuelve
    //     void
    if(!$conn) {
        return;
    }
    mysql_close($conn);
};

function createArrayFromCadParams($cadParams) {
    // Recibe como entrada la cadena de parametros separados por comas
    // y devuelve un Array con los parametros separados
    $arrayParams=array();
    if (strlen($cadParams)!=0) {
        if(strpos($cadParams, ',')>0) {
            $arrayParams =  explode(',',$cadParams);
        } else {
            $arrayParams[0]=$cadParams;
        }
    }
    return $arrayParams;
};

function createResponse($code, $text, $content) {
    // createResponse($code, $descrip, $content)
    //      Genera un documento XML del tipo <regataResponse>.
    //      (Ver su constitución en la documentación del programa)
    // Parámetros:
    //
    // Devuelve:
    //
    $doc=new DOMDocument('1.0');
    $cadxml="<wsResponse>";
    $cadxml=$cadxml."<statusCode>$code</statusCode>";
    $cadxml=$cadxml."<statusText>$text</statusText>";
    $cadxml=$cadxml."<content>$content</content>";
    $cadxml=$cadxml."</wsResponse>";
    $doc->loadXML($cadxml);
    return $doc->saveXML();
};

function createResponseFromCode($code) {
    // createResponseFromCode($code)
    //      Genera un documento XML del tipo <wsResponse>.
    //      OK para códigos >0 y ERROR para codigos <= 0        
    // (Ver su constitución en la documentación del programa)
    // Parámetros:
    //
    // Devuelve:
    //
    $text="ERROR";
    $content = "ERROR";
    if($code>0) {
        $text="OK";
        $content ="OK";
    }
    $doc=new DOMDocument('1.0');
    $cadxml="<wsResponse>";
    $cadxml=$cadxml."<statusCode>$code</statusCode>";
    $cadxml=$cadxml."<statusText>$text</statusText>";
    $cadxml=$cadxml."<content>$content</content>";
    $cadxml=$cadxml."</wsResponse>";
    $doc->loadXML($cadxml);
    return $doc->saveXML();
};
?>

3 そしてヘッダーファイルでスクリプトを参照します: [...]

<script src="mysqlws.js"></script>

[...]

次に、数式のすべてのロジックがある別の js ファイルにコードを実装しようとします。

[...]

function liberar()
  {
    var SQLguardar = null;
    var fecha = new Date();
    var indice = null;
    //Compruebo si existe dirección en el formulario
    //Esto es necesario porque si no han introducido una no se cambiarán las coordenadas.
    if(document.getElementById("direccion").value !='')
    {

        txtDireccion = document.getElementById("direccion").value;
        txtObservaciones = document.getElementById("observaciones").value;
        txtNumRev = document.getElementById("numerorevista").value;
        txtLat = document.getElementById("lat").value;
        txtLng = document.getElementById("long").value;

        //alert ("Comenzando Guardado. Datos: "+txtDireccion+", "+txtObservaciones+", "+txtNumRev+", "+txtLat+", "+txtLng+".");

        //Definimos la consulta que guardará el nuevo punto

        SQLguardar = "INSERT INTO wp_leafletmapsmarker_markers (markername, basemap, layer, lat, lon, icon, popuptext, zoom, openpopup, mapwidth, mapwidthunit, mapheight, panel, createdby, createdon, updatedby, updatedon, controlbox, overlays_custom, overlays_custom2, overlays_custom3, overlays_custom4, wms, wms2, wms3, wms4, wms5, wms6, wms7, wms8, wms9, wms10, kml_timestamp, address) VALUES ('Ecléctica nº "+ txtNumRev+"', 'osm_mapnik', 3, "+ txtLat +", "+ txtLng+", 'text.png', '"+txtObservaciones+"', 17, 0, 640, 'px', 480, 0, 'revista','"+ fecha.getFullYear()+"/"+fecha.getMonth()+"/"+fecha.getDate()+"', NULL, NULL, 1, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, NULL, '"+txtDireccion+"');";

        mysql_use("localhost",*{MyDBUser}*,*{MyDBPass}*,*{MyDBName}*);

        var arrayResult = mysql_update_query(SQLguardar);

        alert ("Resultado: "+arrayResult[0]);   

    }else alert ("ATENCION: No se ha introducido una Direcci"+'\u00f3'+"n.  Por favor introduzca una direcci"+'\u00f3'+"n, pulse 'Pasar al mapa' y afine la localizaci"+'\u00f3'+"n con el marcador");

  }

私の問題は、何も保存しないことです。ボタン (Liberar!!!) を押すと、式は正しい PHP 方向でリロードされますが、DB で新しい行が見つかりません。また、結果を表示する必要がある最後の「アラート」が表示されることはありません...ここでフォーミュラリーを確認できます。最初のアラートのコメントを外すと変数が表示されるため、実行がこのメソッドに到達することはわかっていますが、クエリを実行しようとすると、ページがリロードされ、何も保存されません...

Plzは誰かが私の間違いを指摘できますか? 結果メッセージを表示するにはどうすればよいですか? 独自の SQL クエリを使用する他の方法はありますか? このフォーミュラリはプロジェクトの一部であり、データにアクセスして作業し、保存するには、独自の SQL クエリを使用する必要があります。

お時間をいただき、ありがとうございました。

4

1 に答える 1

3

JS ファイルで SQL クエリを作成しないでください。代わりに、PHP ファイルにある必要があります。JS から PHP ファイルへの呼び出しを行い、次に PHP ファイルから SQL サーバーへの呼び出しを行います。セキュリティに優れており、デバッグが容易になります。

最初にそれを試してから、構文エラーがないかログを確認してください。

このアドバイスを無視することを選択した場合 (無視しないことを強くお勧めします)、ブラウザーのコンソールを調べて、これをさらにデバッグできます。

これを PHP でデバッグするには、まず error_reporting を有効にして不要な構文エラーをキャッチし、次の行を試してください。

$mysqli = new mysqli("example.com", "user", "password", "database");

/* check connection */
if ($mysqli->connect_errno) {
    printf("Connect failed: %s\n", $mysqli->connect_error);
    exit();
}

if (!$mysqli->query($query)) {
    printf("Errormessage: %s\n", $mysqli->error);
}

/* close connection */
$mysqli->close();

すべてが順調に進んだら、error_reporting をオフにすることを忘れないでください。

于 2013-07-30T13:28:26.737 に答える