【mysql】さくらでRow size too large エラーの対処法

mysqlでupdateをしてデータを増やそうとしたらエラーが出た

エラー内容
---------------------------------------------------------------
Row size too large (> 8126). Changing some columns to TEXT or BLOB or using ROW_FORMAT=DYNAMIC or ROW_FORMAT=COMPRESSED may help. In current row format, BLOB prefix of 768 bytes is stored inline.
---------------------------------------------------------------

これは「InnoDBの最大行長(最大行サイズ)は約8000バイト」なので発生したエラー。
最大行サイズとは、一行ごとに格納できるデータの最大容量。

VARCHAR(255)やTEXTは最大で800バイト弱を使用するので、そういったカラムが11より多い発生する可能性が出てくる。

InnoDBの最大行長8000バイトの壁は、innodb_file_format を Antelope から別のものに変更すればいいらしいが、my.cnf の設定をいじる必要がある。しかし、さくらの共用サーバープランではいじれないので諦める。

不要なカラムを削除して対応した。

【javascript jQuery】eachでループして出力するとundefinedが出る

jQuery(javascript) で eachでループして出力すると undefined が出た。

//each で配列を展開
-------------------------
var my_value;
$.each(my_value, function(i, value) {
all_my_value += my_value;
});
-------------------------

上記の all_my_value は先頭に undefined という文字が入る。原因は var my_value; の部分で変数に何の値も代入していないこと。

undefined は 未定義値のこと。変数を宣言だけして何も代入していないと出る。

//これだと undefined の出る可能性がある
-------------------------
var 変数名
-------------------------

出したくなければ殻の値でも入れておく

//これだと undefined は出ない
-------------------------
var 変数名 = ""
-------------------------

参考ページ こちら

【HTML5 javascript】contenteditableの値をPOSTする

contenteditable で編集可能にした値はテキストエリアやテキストフィールドにあるわけではないので form タグで囲っただけでは POST できない。

POST は javascript を用いれば可能。

--------------------------------------------------
<input type="button" value="送信" onclick="document.form1.my_value.value = document.all.textarea1.innerText;document.form1.submit();">

<form method="post" name="form1" action="">

<div id="textarea1" contenteditable>この文字列を送信する</div>
<input type="hidden" name="my_value" value="">

</form>
--------------------------------------------------

contenteditable で編集可能な値を隠しフォーム(hidden)に入れて、それを javascript で送信する。

POST したい値が複数ある場合は、値を「;」で区切ればいい。

--------------------------------------------------
<input type="button" value="送信" onclick="document.form1.my_value1.value = document.all.textarea1.innerText;document.form1.my_value2.value = document.all.textarea1.innerText;document.form1.submit();">
--------------------------------------------------

【jQuery】JavaScriptで追加した要素にイベントを設定するonの使い方

JavaScript を使って後から追加した要素に対してイベントを設定する on の書式。よく忘れるのでメモ。

on の書式
------------------------------------
$(親セレクタ).on(イベント名, 子セレクタ, function(){
------------------------------------

on の使用例
------------------------------------
$(document).on('click', '.class_name', function(){
------------------------------------

さくらのmysqlで大きなファイルをインポートしたら後半のデータが文字化けした

サクラインターネットのレンタルサーバーをプラン変更したとき、古いデータベースサーバーから新しいデータベースサーバーにデータを移行する必要があった。古いデータを mysqladmin から sql ファイルとしてエクスポートして、新しいデータベースサーバーへはターミナルで接続して source コマンドでエクスポートした。

すると、いくつかあるテーブルの内、後半のテーブル内のデータが文字化けする現象に遭遇した。インポート中のターミナル画面を見ていると気になるエラー?を発見。

--------------------------------------------
Query OK, 870 rows affected (0.02 sec)
Records: 870 Duplicates: 0 Warnings: 0

ERROR 2006 (HY000): MySQL server has gone away
No connection. Trying to reconnect...

Query OK, 850 rows affected (0.02 sec)
Records: 850 Duplicates: 0 Warnings: 0
--------------------------------------------

いったんデータベースサーバーへの接続が切断されて、その後再接続が行われている。そして、その再接続後から文字化けが起こっている?

このエラーは、インポートするデータが大きすぎると起こるらしい。

自分でいじれるサーバーであれば、max_allowed_packet の値を上げることで解決できるようだが(参考)、さくらの自分のプランでは、my.cnf をいじることができないため通用せず。

mysql の文字コードを確認してみる。

//コマンド
-------------------------------
mysql> show variables like "chara%";
-------------------------------

+--------------------------+----------------------------------+
| Variable_name | Value |
+--------------------------+----------------------------------+
| character_set_client | ujis |
| character_set_connection | ujis |
| character_set_database | ujis |
| character_set_filesystem | binary |
| character_set_results | ujis |
| character_set_server | ujis |
| character_set_system | utf8 |
| character_sets_dir | /usr/local/share/mysql/charsets/ |
+--------------------------+----------------------------------+

utf8 のデータだが、設定されている文字コードは ujis が多い。文字コードを変更する最も一般的な方法は my.cnf を書き換えることだが自分のプランではできない。ターミナルで mysqlサーバーへログインするときに 文字コードを指定してみる。

//ターミナルで文字コードを設定
-------------------------------
mysql -u ユーザー名 -p -h ホスト名 --default-character-set=utf8
-------------------------------

//設定後
+--------------------------+----------------------------------+
| Variable_name | Value |
+--------------------------+----------------------------------+
| character_set_client | utf8 |
| character_set_connection | utf8 |
| character_set_database | ujis |
| character_set_filesystem | binary |
| character_set_results | utf8 |
| character_set_server | ujis |
| character_set_system | utf8 |
| character_sets_dir | /usr/local/share/mysql/charsets/ |
+--------------------------+----------------------------------+

character_set_database は use でデータベースを選択すると、データベースの文字コードになる。

//最終的にこうなった
+--------------------------+----------------------------------+
| Variable_name | Value |
+--------------------------+----------------------------------+
| character_set_client | utf8 |
| character_set_connection | utf8 |
| character_set_database | ujis |
| character_set_filesystem | binary |
| character_set_results | utf8 |
| character_set_server | ujis |
| character_set_system | utf8 |
| character_sets_dir | /usr/local/share/mysql/charsets/ |
+--------------------------+----------------------------------+

この状態で sql ファイルを source で実行したら文字化けは起こらなかった。

さくらサーバーでpearのインストール 2016年10月版

さくらのレンタルサーバーをプラン変更した際、 pear の再設定に手間取ったので覚書。
php ファイル で、DB ライブラリとPager ライブラリを利用しているため、それぞれを利用可能にする必要があった。さくらのレンタルサーバーには、もともと pear がインストールされているが件のライブラリ は入っていない。もともと入っている pear は共有部分のに入っているため、ライブラリをインストールするには、 pear 自体も ローカル部分にインストール必要があった。

1.さくらサーバーに pear のインストール

pear のインストール方法はいくつかあるが、今回は go-pear を使った。
go-pear は古くてインストール途中で止まるものがインターネット上にたくさんある。

2016年10月3日現在有効な pear-go

上記リンクを右クリックして www フォルダ以下に「go-pear.php」という名前で保存。その後、ブラウザからアクセスする。

設定項目を埋めて、インストールボタンを押す。設定項目のインストール先は www フォルダ(Installation prefix($prefix))直下がデフォルトのようだが、移行元の pear が「/home/ユーザー名/」の直下だったので、同じようにした。

設定の参考にしたページ こちら

インストールは無事完了したが、Warning が出た。

----------------------------------------------
Warning: Can not determine the URL of the freshly installed Web Frontend
(file: /home/ユーザー名/index.php).
Please access it manually !
----------------------------------------------

これは「インストール後に生成された index.php ファイルが www フォルダより上にあるためアクセスできないよ」という内容のもの。ブラウザからライブラリをインストールするには、index.php へのアクセスが必要なので、www フォルダ直下に「gopear」というフォルダを作って、index.php ファイルをコピーした。

2.ライブラリのインストール

ライブラリをインストールするにはターミナルから操作する方法と 件の index.php へアクセスして操作する方法がある。

最初ターミナルからサーバーにログインしてコマンドを実施した

//DB ライブラリをインストールするコマンド
------------------------
% pear install -a DB
------------------------

インストールできたかは list でパッケージの一覧を取得すればいい
------------------------
% pear -c /home/acount_name/pear.conf list
------------------------
※pear.conf info のところが .pearrc になっている場合があるかも?find /home/acount_name -name '*pear*' で対象のファイルがあるか確認するといい。
※ -c file の詳細は pear help options で確認できる

これだとさくらサーバーに最初からある pear の情報が出る
------------------------
% pear list
------------------------

すると、エラーが出てインストールできなかった

//エラー内容
------------------------
Cannot install, php_dir for channel "pear.php.net" is not writeable by the current user
------------------------

書き込みができないという内容。どうもインストールを実施しようとしている pear が、さくらサーバーにもともとインストールされている pear らしい。

//pear のバージョンを調べるとどの pear に対して命令しているのか分かる
------------------------
% pear info PEAR
------------------------

自前のpearならこれ
------------------------
% pear -c /home/acount_name/pear.conf info PEAR
------------------------

自分でインストールした pear に対して命令してもいいが、index.php からライブラリをインストールする方法に変更。

pear インストール時に生成された index.php にブラウザからアクセス。
画面の右上にある「Search package by name」から、DB と Pager を検索してインストール。
DB と名前の入るライブラリがたくさんあって、検索結果が出るまで時間がかかった。読み込み中がずっと続いたのであせった。

インストールできたら、ドキュメントルートの php.ini を変更してpear を include して使う。

jQuery ui の dialog を最善面にする

jQuery ui の dialog が下に回り込んで見えなくなることがある。最善面にする方法は次のとおり。

css に設定する
-------------------------------
.ui-dialog { z-index: 1000 !important ;}
-------------------------------

z-index の値を大きくするほど前面に出る。

【Jquery】右クリックでイベントを発生させる

右クリックでイベントを発生させる記述

---------------------------------------
$(document).on('contextmenu', 'セレクター名', function() {

//イベントに対応して行うべき処理を記述

return false; //右クリックメニューを出さない処理

});
---------------------------------------

もしくは

---------------------------------------
$(document).bind('contextmenu', 'セレクター名', function() {

//イベントに対応して行うべき処理を記述

return false; //右クリックメニューを出さない処理

});
---------------------------------------

bindだと、ajax等で変更した要素にはイベントが発生しないので注意。

なお、contextmenu(コンテキストメニュー) とは、右クリックで出てくるメニューのこと。

textareaで一部の文字だけ装飾する

textareaで一部の文字だけ装飾する方法をネットで調べると Jquery を使った方法がいくつか見つかった。しかし自分のしたかったものとはちょっと違った。見つかった方法のソースをいじって自分のやりたかったことができればいいのだが、そこまで詳しくなので、理解するの時間がかかって面倒くさい。

で、タイトルとちょっと違うのだが、html や css で装飾した文字を textarea の文字のように簡単に編集できる方法を発見。やり方も超簡単だったので採用した。

サンプル

この文字は直接編集できます。textarea は使っていません。

html
--------------------------------
<div id="box" contenteditable=true>この文字は直接編集できます。textarea は使っていません。</div>
--------------------------------

css
--------------------------------
#Box {
border: 1px solid #999;
width:300px;
height:100px;
}

.font1 {
color: red;
}

.font2 {
color: blue;
}

.font3 {
font-weight: bold;
}
--------------------------------

大事なのは「contenteditable=true」の部分のみ。これは html5 の属性。たったこれだけで box 内の装飾された文字を、あたかも textarea 内に書かれた文字のように編集できる。

【css】フッターの文字を上下左右ともにセンタリング

フッターの文字を上下左右ともにセンタリングしたときの覚書

左右のセンタリングだけだと、footer にtext-align を指定するだけで簡単だった。上下のセンタリングだけも display: table-cell が有効だった。しかし、footer の width が 100% では、margin:0 auto が効かず、text-align と vertical-align の両立にてこずった...。

css
--------------------------------------------
#footer {
text-align:center; /* footer 内の div を左右中央にする */
border-top: 1px solid #009933;
background: #fff;
width:100%;
height: 30px;
box-sizing: border-box; /* パディングとボーダーを幅と高さに含める */
clear: both; /* 2カラム解除 */
}

#footer > div {
/* text-align:center を有効にするため inline 化 */
display: inline-block;
background: #999; /* 幅を視覚化するために色をつけている */
}

/* 上下のセンタリング */
#footerText {
height: 30px; /* footer と同じ高さを指定 */
display: table-cell;
vertical-align: middle;
}
--------------------------------------------

html
--------------------------------------------
<div id="footer">
<div>
<div id="footerText">フッターの文字</div>
</div>

</div>
--------------------------------------------