admin管理员组

文章数量:1195528

I am trying to use javascript, without framework(prototype, jQuery,etc), to insert data passed from a html form to an mysql database. I have managed to get this working but, get a problem with some special characters commonly used in my language(æøå). utf-8 supports these characters, and everything works fine when I skip the javascript. However when I try to pass the content of the html form through javascript post function and executing the query with my working php script, every æøå is converted into æøå.

To break it down, does javascript somehow force a specific charset when no other is determined in the code? I have tried to specify charset in the header of the javascript post and the php file as well as the html form.

I believe it must be something wrong or missing in my javascript file, formpost.js:

    function sendText(visbool){
  var http =new GetXmlHttpObject();
  var url = "sendtext.php";
  var ovrskrift = document.form1.overskrift.value;
  var cont = document.form1.content.value;

  var params = "overskrift=" + ovrskrift + "&tekst=" + cont + "&visbool=" + visbool;
  http.open("POST", url, true);

  //Send the proper header information along with the request
  http.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
  http.setRequestHeader("Content-length", params.length);
  http.setRequestHeader("Connection", "close");

  http.onreadystatechange = function() {//Call a function when the state changes.
    if(http.readyState == 4 && http.status == 200) {
        // gjør noe smart her
    }
  }
  http.send(params);
}


function GetXmlHttpObject()
 { 
 var objXMLHttp=null;
 if (window.XMLHttpRequest)
  {
  objXMLHttp=new XMLHttpRequest();
  }
 else if (window.ActiveXObject)
  {
  objXMLHttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
 return objXMLHttp;
 }

sendtext.php:

<?php
//variabler for spørring
$date= date('Y-m-d');
$overskrift= $_POST["overskrift"];
$ostr='36';
$tekst= $_POST["content"];
//$tekst="test tekst";
$istr='32';
$bilde="";
$style="onlyinfo.css";
//$vis=$_POST['visbool'];
$vis=0;

require ('../config.php'); // henter informasjon om database tilkoblingen fra config.php

if (!$con){die('Could not connect: ' . mysql_error());} // lager feilmelding hvis tilkoblingen mislyktes

// spørring for databasen, konstrueres etter variablene som er angitt ovenfor
$sql="INSERT INTO tbl_info(dato,overskrift_tekst,overskrift_str,infotekst_tekst,infotekst_str,bilde,style,vismeg) VALUES('" . $date . "','" . $overskrift . "','" . $ostr . "','" . $tekst . "','" . $istr . "','" . $bilde . "','" . $style . "','" . $vis . "')";
$result = mysql_query($sql); // kjører spørring og lagrer resultat i $result

mysql_close($con); // lukker database tilkoblingen
?>

createslide.php: (reserved .php extension for future code implementation)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" ".dtd">
<html xmlns="" dir="ltr">
<head>
<title>inforMe: Legg til side</title>
<link type="text/css" rel="stylesheet" href="./css/style.css" id="adminss">  
<script src="./js/formpost.js"></script>
<script type="text/javascript" src="./tinymce/jscripts/tiny_mce/tiny_mce.js"></script>
<script type="text/javascript">
tinyMCE.init({
    mode : "textareas"
});
</script>

</head>
<body>
<div class="imgupload">
  <input type="button" value="Last opp bilde"> <img src="" />
</div>
<div class="form">
  <form name="form1" method="post" action="sendtext.php">
    <label for="overskrift">Overskrift:</label>
    <input type="text" size="70" id="overskift" name="overskrift"><br />
    <label for="content">Tekst:</label>
    <textarea id="content" name="content" cols="50" rows="15">This is some content that will be editable with TinyMCE.</textarea>
    <input type="button" value="save draft" onclick="sendText(0)"/>
    <input type="button" value="save and publish" onclick="sendText(1)"/>
    <input type="submit" value="regular submit button"/>
  </form>
</div>

</body>
</html>

NB! I don't really know where to put this information so.. well.. I decided to go with it here: First of all thanks for all good suggestions below. I belive the question were answered. As to my problem, it is only partly solved.

It seems like the utf-8 charset is lost somewhere along the line here, if I create a new mysql database with Latin-1 charset and change the charset options in my files to iso-8859-1 it works exactly right. Since my test setup is based on all norwegian software(browsers, db server, etc), I suppose wherever it is not otherwise specified it will return iso-8859-1

NBB! And now it's all good again. everything works fine when I add:

header('Content-Type: text/plain; charset=utf-8');

to the top of my sendtext.php file.

I am trying to use javascript, without framework(prototype, jQuery,etc), to insert data passed from a html form to an mysql database. I have managed to get this working but, get a problem with some special characters commonly used in my language(æøå). utf-8 supports these characters, and everything works fine when I skip the javascript. However when I try to pass the content of the html form through javascript post function and executing the query with my working php script, every æøå is converted into æøå.

To break it down, does javascript somehow force a specific charset when no other is determined in the code? I have tried to specify charset in the header of the javascript post and the php file as well as the html form.

I believe it must be something wrong or missing in my javascript file, formpost.js:

    function sendText(visbool){
  var http =new GetXmlHttpObject();
  var url = "sendtext.php";
  var ovrskrift = document.form1.overskrift.value;
  var cont = document.form1.content.value;

  var params = "overskrift=" + ovrskrift + "&tekst=" + cont + "&visbool=" + visbool;
  http.open("POST", url, true);

  //Send the proper header information along with the request
  http.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
  http.setRequestHeader("Content-length", params.length);
  http.setRequestHeader("Connection", "close");

  http.onreadystatechange = function() {//Call a function when the state changes.
    if(http.readyState == 4 && http.status == 200) {
        // gjør noe smart her
    }
  }
  http.send(params);
}


function GetXmlHttpObject()
 { 
 var objXMLHttp=null;
 if (window.XMLHttpRequest)
  {
  objXMLHttp=new XMLHttpRequest();
  }
 else if (window.ActiveXObject)
  {
  objXMLHttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
 return objXMLHttp;
 }

sendtext.php:

<?php
//variabler for spørring
$date= date('Y-m-d');
$overskrift= $_POST["overskrift"];
$ostr='36';
$tekst= $_POST["content"];
//$tekst="test tekst";
$istr='32';
$bilde="";
$style="onlyinfo.css";
//$vis=$_POST['visbool'];
$vis=0;

require ('../config.php'); // henter informasjon om database tilkoblingen fra config.php

if (!$con){die('Could not connect: ' . mysql_error());} // lager feilmelding hvis tilkoblingen mislyktes

// spørring for databasen, konstrueres etter variablene som er angitt ovenfor
$sql="INSERT INTO tbl_info(dato,overskrift_tekst,overskrift_str,infotekst_tekst,infotekst_str,bilde,style,vismeg) VALUES('" . $date . "','" . $overskrift . "','" . $ostr . "','" . $tekst . "','" . $istr . "','" . $bilde . "','" . $style . "','" . $vis . "')";
$result = mysql_query($sql); // kjører spørring og lagrer resultat i $result

mysql_close($con); // lukker database tilkoblingen
?>

createslide.php: (reserved .php extension for future code implementation)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr">
<head>
<title>inforMe: Legg til side</title>
<link type="text/css" rel="stylesheet" href="./css/style.css" id="adminss">  
<script src="./js/formpost.js"></script>
<script type="text/javascript" src="./tinymce/jscripts/tiny_mce/tiny_mce.js"></script>
<script type="text/javascript">
tinyMCE.init({
    mode : "textareas"
});
</script>

</head>
<body>
<div class="imgupload">
  <input type="button" value="Last opp bilde"> <img src="" />
</div>
<div class="form">
  <form name="form1" method="post" action="sendtext.php">
    <label for="overskrift">Overskrift:</label>
    <input type="text" size="70" id="overskift" name="overskrift"><br />
    <label for="content">Tekst:</label>
    <textarea id="content" name="content" cols="50" rows="15">This is some content that will be editable with TinyMCE.</textarea>
    <input type="button" value="save draft" onclick="sendText(0)"/>
    <input type="button" value="save and publish" onclick="sendText(1)"/>
    <input type="submit" value="regular submit button"/>
  </form>
</div>

</body>
</html>

NB! I don't really know where to put this information so.. well.. I decided to go with it here: First of all thanks for all good suggestions below. I belive the question were answered. As to my problem, it is only partly solved.

It seems like the utf-8 charset is lost somewhere along the line here, if I create a new mysql database with Latin-1 charset and change the charset options in my files to iso-8859-1 it works exactly right. Since my test setup is based on all norwegian software(browsers, db server, etc), I suppose wherever it is not otherwise specified it will return iso-8859-1

NBB! And now it's all good again. everything works fine when I add:

header('Content-Type: text/plain; charset=utf-8');

to the top of my sendtext.php file.

  • javascript
  • html
  • forms
  • post
  • character-encoding
Share Improve this question edited Jul 4, 2012 at 16:57 Leniel Maccaferri 102k46 gold badges378 silver badges493 bronze badges asked May 28, 2009 at 9:15 mzazmzaz 731 gold badge1 silver badge4 bronze badges 1
  • This question was posted a long time ago, but I have to say this: Please tell me that's not your actual SQL-handling code, as it leaves you wide open for SQL-injection attacks... – Epcylon Commented Feb 22, 2012 at 11:02
Add a comment  | 

7 Answers 7

Reset to default 8

Try appending the charset to the content-type header like this:

"application/x-www-form-urlencoded; charset=utf-8;"

Also, in your document you should specify it is utf-8 in the header:

<META http-equiv="Content-Type" content="text/html; charset=utf-8" />

You should probably also do encodeURI(value) on all your values so it's properly url encoded.

Internally, JavaScript uses Unicode, so it can store your umlauts without problem. Note: Unicode != UTF-8.

But then, you try to send that text to your server and here, the trouble starts. The wire (Internet) between the browser and your server doesn't support Unicode, so the browser has to encode the data. So it converts the Unicode to an UTF-8 byte stream.

On the server side, you must convert the data back to Unicode.

I realise this question was posted already two years ago, but the reason PQW's answer works is that the client (browser) should reply using the same character set the page was served with (thus specifying UTF-8 in a META-tag works). Using Javascript doesn't change this basic assumption (so the answer would be correct whether Javascript was involved or not).

The "most correct method" is to specify the character set in the server response header, but because this is not always possible (perhaps you don't have any control over them or a number of other reasons), the META-approach is the next best way to achieve this.

It doesn't force one, but depending on the charset of the HTML reading it in, both of the display charset set in the metadata and the way the file format is saved, it will go all funny...

So, when you save the HTML and the Javascript, save both as UTF-8.

Furthermore, in PHP you might need some mb_internal_encoding action...

I think you can try using encodeURIComponent.

var ovrskrift = encodeURIComponent(document.form1.overskrift.value);

You should use this instead of escape. Read more on this page: Comparing escape(), encodeURI(), and encodeURIComponent().

It states:

[...]you should avoid use of escape() whenever possible. The best alternative is usually encodeURIComponent(). [...]

...and that seems to be correct in my experiences too.

Two untested (in relation to your code sample) suggestions:

(1) Reference your external JS with charset attribute:

<script src="file.js" type="text/javascript" charset="utf-8"></script>

(2) Maybe something more can be done on the PHP side, like strip non-UTF8 chars?:

<?php
$result = iconv("UTF-8","UTF-8//IGNORE", $result);
?>

Javascript doesn't 'force' a code page like that. To get the result you want just use escape() and unescape() to pass the extended ASCII.

F.

本文标签： htmlDoes javascript force specific charsetStack Overflow

版权声明：本文标题：html - Does javascript force specific charset? - Stack Overflow 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.betaflare.com/web/1738500528a2090242.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。