サイト別にルートディレクトリを用意し、ポート番号で振り分ける。

設定をするのは次の2ファイル

1. Apache/conf/httpd.conf
2. Apache/conf/extra/httpd-vhosts.conf

今回は8085ポートを指定し、次のアドレスで表示されるようにする
http://localhost:8085/

1. httpd.confの設定
   #追加

   Listen  8085
   

   #rewrite モジュールを読み込む
   コメントが外れいているか確認（外れてなければ外す）

   LoadModule rewrite_module modules/mod_rewrite.so
   

   #rewrite モジュールを読み込む
   #コメントをはずす

   Include conf/extra/httpd-vhosts.conf
   

2. httpd-vhosts.confの設定
   追加

   NameVirtualHost *:8085
   

   追加

   <VirtualHost *:8085>
       ServerAdmin webmaster@dummy-host.sample_system
       DocumentRoot "C:\Program Files\Zend\Apache2\htdocs\sample_system"
       ServerName local.sample_system
       ServerAlias www.local.sample_system
       ErrorLog "logs/dummy-host.sample_system-error.log"
       CustomLog "logs/dummy-host.sample_system-access.log" common
   </VirtualHost>
   

3. apacheを再起動

sublime textで設定ファイルをそのまま移行して下記エラーが出た場合は、gitの実行ファイルへの参照（パス）が通っていないためです。

Git binary could not be found in PATH

sublime text を立ち上げて下記手順でパスの設定を追加します。

1. 設定ファイルGit.sublime-settingsを開く
   Preferences->Package Settings->Git->Setting Users
2. 設定ファイルにgit実行ファイルへのパスを書き足して保存

   {
   "git_command": "C:\\Program Files (x86)\\Git\\bin\\git"
   }
   

gitbook Editor を用いてPDF出力をしようとするとエラーで落ちる場合は次のコマンドを実行して「gitbook-PDF」をインストールする必要があります。

npm install gitbook-pdf -g

TortoiseSVNがインストールされている前提で話をすすめます。
DreamweaverでSubversionを使用したいときに次のエラーメッセージが表示されることがあります。（アクセス方法：SVN+SSH）
「サーバーとプロジェクトはアクセスできません。(Can’t create tunnel: 指定されたファイルが見つかりません。)」
この場合、Subversionのクライアントが正しく、Dreamweaver側から認識できていない事が考えられます。
まず、Subversionの設定ファイルの場所が隠しフォルダになってますので、次の手順で表示されるように設定します。
「フォルダオプション」画面を立ち上げます。
エクスプローラー→Altキー→ツール→フォルダーオプション
フォルダオプション画面を操作します。
「表示」タブ→詳細設定→「隠しファイル、隠しフォルダー、および隠しドライブを表示する」にチェック
※Subversionが使えるようになったら、安全性のため元に戻しておいてください。
次の場所にSubversionの設定ファイル(config)がありますので、それをメモ帳などのエディタで開きます。
C:¥Users¥【ユーザ名】¥AppData¥Roaming¥Subversion¥config
sshについて記述している場所がありますので、#を除いて次の記述をします。（注意：¥は二つ重ねます）
ssh = “C:¥¥Program Files¥¥TortoiseSVN¥¥bin¥¥TortoisePlink.exe” -l 【SSHユーザ名】 -pw 【パスフレーズ】
configを上書き保存して完了です。
次の環境で確認しました。
Windows7
Dreamweaver CS5
TortoiseSVN 1.8.3
Subversion 1.8.4

MySQLの文字コードを設定する方法です。
以下の環境で行いました。
Windows7
MySQL 5.0.10
まずは現在の文字コードを確認しましょう。
○文字コードの確認コマンド
[データベース]
show create database DB名;
[テーブル]
show create table DB名.テーブル名;
初期状態であれば文字コードが「latin1」あたりになっているかと思います。
これを今回はUTF8に変換します。
○MySQL文字コードUTF8変更対応
１．MySQLの設定ファイル(my.ini)を開く
２．my.iniの「default-character-set」を次のように修正
[mysql]
default-character-set=utf8

character-set-server=utf8　（※mysql 5.5.23で確認）

３．「コンピュータの管理」画面を開く
「スタート」ボタンクリック→「コンピューター」右クリック→管理
４．「サービス」を呼び出す
左側のウィンドウ
「サービスとアプリケーション」展開→「サービス」クリック
５．MySQLのサービスを再起動
右側のサービスの一覧からMySQLのサービスを右クリック→「再起動」をクリック
エラーが出なければ成功
６．テーブルとカラムをutf8に変換
次のSQL文をMySQLで実行する
ALTER TABLE DB名.テーブル名 CONVERT TO CHARACTER SET utf8;

以前のブログで取り扱った「class.image.php」及び「Zebra_Image.php」を使って、サイズ変換付きアップローダを作っていた時に起こった現象とその対応です。

ローカル環境では動作していたのですが、本番環境にアップロードして動作させると画面が真っ白になってしまいました。
確認した状況を整理すると次のような感じです。

１．アップロード用のphpへPOSTしたら結果画面がリダイレクトされない（真っ白）
２．画像はアップロードされている
３．リサイズはされていない
４．トリミングされてない
５．容量の小さな画像(数10KB程度)はアップロード加工が正常に行われる。
６．デジカメレベルの画像(3MB程度)はアップロードだけされて、加工がされない。

要は元の画像が、リサイズ等の加工がされず、そのままアップロードされていました。

以下、対応手順です。

まず、「１．」について対応します。

本番サーバとして使っている環境は、基本的にPHPからブラウザへのエラー表示をしない設定になっています。
とは言え、本番環境のphp.iniファイルをいじるのは再起動も伴うので普通はしません。
そこで、実行時にini_set()を利用して、PHPのエラー出力を有効にします。
とりあえず、エラーを出力したいファイルの最上部に記述すれば良いでしょう。

<?php
ini_set( 'display_errors', 1 ); //PHPエラー表示 1:する 2:しない

すると下記のエラーを確認しました。

「Fatal error: Allowed memory size of 33554432 bytes exhausted (tried to allocate 13056 bytes) in ＜ソースへのパス＞ on line ＜行数＞」

どうやらメモリオーバーのようです。

表示されている行数付近を見てみると、どうやら

imageCreateFromJpeg

でエラーになっていたようです。

メッセージ上の数値を読むと

33554432 byte = 32 * 1024 * 1024 byte

となるので、上限32MBの枠を超えてしまったことになります。

メモリの確認方法としては他に、ini_getを使う手段があります。

echo ini_get('memory_limit');

先ほどと値が同じ「32M」と表示されました。

とりあえず、2倍して64MBにしてみようと思います。

.htaccessファイルを作成し、下記の記述をします。

php_value memory_limit 64M

これを、アップロードするソースと同じ場所に設置すると、今回のエラーが解消されました。

さて、前回に引き続き画像のリサイズ（拡大縮小）し、トリミング（切り出し）についてです。
今回は「Zebra_Image.php」を利用します。

前回同様、今回もアップロードしたファイルを100px×100pxの正方形に中央を基準にトリミングします。

下記ソースの流れはこんな感じです。
１．アップロードしたファイルをリネーム
２．既定フォルダに保存
３．ファイルの縮小・トリミング

<?php
require_once 'Zebra_Image.php';
define('IMAGE_AREA_LENGTH', 100);    //画像（正方形）の1辺の長さ
$upload_path = $_SERVER['DOCUMENT_ROOT'].'/upload/';
if(!is_uploaded_file($_FILES['toProcess']['tmp_name'])){
die('アップロードエラー');
}
//アップロード成功
$tmp_name = $_FILES['toProcess']['tmp_name'];    //元画像ファイル
//ファイル名を取得
$file_name = date('YmdHis');    //YYYYMMDDHHIISSで名前を付ける
$file_name = uniqid($file_name.'_');    //重複しない名前
//拡張子を取得
$wrk = explode('.', $_FILES['toProcess']['name']);
$extension = array_pop($wrk);
//画像保存パス
$output_file = $upload_path.$file_name.'.'.$extension;
//画像を移動
move_uploaded_file($tmp_name, $output_file);
//画像変換
$image = new Zebra_Image();
$image->source_path = $output_file;    //元ファイル
$image->target_path = $output_file;    //書き出しファイル
//リサイズ・トリミング
if (!$image->resize(IMAGE_AREA_LENGTH, IMAGE_AREA_LENGTH, ZEBRA_IMAGE_CROP_CENTER)) {
//エラー発生時
switch ($image->error) {
case 1:
echo 'ファイルが存在しません';
break;
case 2:
echo 'ファイルを読み込めません';
break;
case 3:
echo '変換ファイルを書き出せません';
break;
case 4:
echo 'サポートされてないファイル形式です';
break;
case 5:
echo '変換ファイルはサポートされていない形式です';
break;
case 6:
echo 'GDが書き出しファイルの形式をサポートしてません';
break;
case 7:
echo 'GDがインストールされてません';
break;
}
}

「class.image.php」はリサイズとトリミングを分けて行いましたが
「Zebra_Image.php」はこれを一気に行うことができ、トリミングの中央指定も簡単です。

アップロードした画像ファイルをリサイズ（拡大縮小）し、トリミング（切り出し）を行いたいとき、「class.image.php」を使用する方法があります。

今回は、アップロードしたファイルを100px×100pxの正方形に中央を基準にトリミングします。

下記ソースの流れはこんな感じです。
１．アップロードしたファイルをリネーム
２．既定フォルダに保存
３．ファイルの縮小
４．ファイルのトリミング

<?php
require_once 'class.image.php';
define('IMAGE_AREA_LENGTH', 100);    //画像（正方形）の1辺の長さ
$upload_path = $_SERVER['DOCUMENT_ROOT'].'/upload/';
if(!is_uploaded_file($_FILES['toProcess']['tmp_name'])){
die('アップロードエラー');
}
//アップロード成功
$tmp_name = $_FILES['toProcess']['tmp_name'];    //元画像ファイル
//ファイル名を取得
$file_name = date('YmdHis');    //YYYYMMDDHHIISSで名前を付ける
$file_name = uniqid($file_name.'_');    //重複しない名前
//拡張子を取得
$wrk = explode('.', $_FILES['toProcess']['name']);
$extension = array_pop($wrk);
//画像保存パス
$output_file = $upload_path.$file_name.'.'.$extension;
//画像を移動
move_uploaded_file($tmp_name, $output_file);
//リサイズ    (縦横の最大サイズを100ピクセル)
$size = GetImageSize($output_file);    //元画像サイズ取得
if($size[0] > $size[1]){
$height = IMAGE_AREA_LENGTH;
$width = $height * ($size[0] / $size[1]);
}else{
$width = IMAGE_AREA_LENGTH;
$height = $width * ($size[1] / $size[0]);
}
//画像オブジェクト生成
$thumb = new Image($output_file);
//リサイズ
$thumb->width($width);
$thumb->height($height);
$thumb->save();
//トリミング
$thumb->width(IMAGE_AREA_LENGTH);
$thumb->height(IMAGE_AREA_LENGTH);
if($width < $height){
$thumb->crop(0, ($height - $width) / 2);
}else{
$thumb->crop(($width - $height) / 2, 0);
}
$thumb->save();

「class.image.php」はリサイズとトリミングを分けて行うことによって動作させることができました。

ちょっとごちゃごちゃした感じになってしまいました。
他にも「Zebra_Image」を使うと少しコードがすっきりします。
それはまた次回に・・・。

このブログではプログラムソースの表示に「SyntaxHighlighter」を使用しています。
しばらく使っていて色々分かったところもあるので、一度ここで確認をしておこうと思う。

○編集
preタグの中にHTML上影響の与える文字が含まれると、うまく表示されない場合があるので置き換え文字を使用する。
このサイトが便利。

「preタグ・メーカー」
http://www.mapee.jp/tools/pretagmaker/

○投稿
改行HTMLタグ変換
「改行をタグに変換しない 」に設定
URL補完
「補完しない」 に設定

○初期設定
１．SyntaxHighlighterを自分が所有するサーバスペースにアップ

２．HTMLの編集
管理パネル
「デザイン」→「HTML」→「HTMLの追加」

ここで、必要なタグの追加
※headタグ中

<!-- SyntaxHighlighter -->
<link type="text/css" rel="stylesheet" href="http://<自分が所有するサイトのドメイン>/syntaxhighlighter/styles/shCore.css">
<link type="text/css" rel="stylesheet" href="http://<自分が所有するサイトのドメイン>/syntaxhighlighter/styles/shThemeDefault.css">

※bodyの閉じタグの手前

<!-- SyntaxHighlighter -->
<script type="text/javascript" src="http://<自分が所有するサイトのドメイン>/syntaxhighlighter/scripts/shCore.js"></script>
<script type="text/javascript" src="http://<自分が所有するサイトのドメイン>/syntaxhighlighter/scripts/shAutoloader.js"></script>
<script type="text/javascript">
SyntaxHighlighter.autoloader(
'applescript            http://<自分が所有するサイトのドメイン>/syntaxhighlighter/scripts/shBrushAppleScript.js',
'actionscript3 as3      http://<自分が所有するサイトのドメイン>/syntaxhighlighter/scripts/shBrushAS3.js',
'bash shell             http://<自分が所有するサイトのドメイン>/syntaxhighlighter/scripts/shBrushBash.js',
'coldfusion cf          http://<自分が所有するサイトのドメイン>/syntaxhighlighter/scripts/shBrushColdFusion.js',
'cpp c                  http://<自分が所有するサイトのドメイン>/syntaxhighlighter/scripts/shBrushCpp.js',
'c# c-sharp csharp      http://<自分が所有するサイトのドメイン>/syntaxhighlighter/scripts/shBrushCSharp.js',
'css                    http://<自分が所有するサイトのドメイン>/syntaxhighlighter/scripts/shBrushCss.js',
'delphi pascal          http://<自分が所有するサイトのドメイン>/syntaxhighlighter/scripts/shBrushDelphi.js',
'diff patch pas         http://<自分が所有するサイトのドメイン>/syntaxhighlighter/scripts/shBrushDiff.js',
'erl erlang             http://<自分が所有するサイトのドメイン>/syntaxhighlighter/scripts/shBrushErlang.js',
'groovy                 http://<自分が所有するサイトのドメイン>/syntaxhighlighter/scripts/shBrushGroovy.js',
'java                   http://<自分が所有するサイトのドメイン>/syntaxhighlighter/scripts/shBrushJava.js',
'jfx javafx             http://<自分が所有するサイトのドメイン>/syntaxhighlighter/scripts/shBrushJavaFX.js',
'js jscript javascript  http://<自分が所有するサイトのドメイン>/syntaxhighlighter/scripts/shBrushJScript.js',
'perl pl                http://<自分が所有するサイトのドメイン>/syntaxhighlighter/scripts/shBrushPerl.js',
'php                    http://<自分が所有するサイトのドメイン>/syntaxhighlighter/scripts/shBrushPhp.js',
'text plain             http://<自分が所有するサイトのドメイン>/syntaxhighlighter/scripts/shBrushPlain.js',
'py python              http://<自分が所有するサイトのドメイン>/syntaxhighlighter/scripts/shBrushPython.js',
'ruby rails ror rb      http://<自分が所有するサイトのドメイン>/syntaxhighlighter/scripts/shBrushRuby.js',
'sass scss              http://<自分が所有するサイトのドメイン>/syntaxhighlighter/scripts/shBrushSass.js',
'scala                  http://<自分が所有するサイトのドメイン>/syntaxhighlighter/scripts/shBrushScala.js',
'sql                    http://<自分が所有するサイトのドメイン>/syntaxhighlighter/scripts/shBrushSql.js',
'vb vbnet               http://<自分が所有するサイトのドメイン>/syntaxhighlighter/scripts/shBrushVb.js',
'xml xhtml xslt html    http://<自分が所有するサイトのドメイン>/syntaxhighlighter/scripts/shBrushXml.js'
);
SyntaxHighlighter.defaults['toolbar'] = true;
SyntaxHighlighter.config.bloggerMode = true;
SyntaxHighlighter.all();
</script>

特定のブラウザで画面が真っ白になる場合があります。

ソースを表示させると、きちんとHTML自体はブラウザにダウンロードされている。
ブラウザのエンコードも問題ないし、ファイル自体の文字コードも合っている。
現象が確認できるブラウザでは再現率100%。
開発していたブラウザではちゃんと表示されていたのに、どうして？

そんな問い合わせが時々あります。

こういった場合は「文字化け」を疑います。
例えば次のソースを見てみてください。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="ja">
<head>
<title>タイトル</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
・・・以下略

一見すると正しい記述に見えますが、この記述だとmetaタグで「utf-8」が
指定される前にtitleタグ内のマルチバイト文字「タイトル」が現れます。

ブラウザがエンコードを認識する前にマルチバイト文字を読みこみ
一部のブラウザではタイトルの時点で文字化けが発生する場合があります。
結果としてブラウザには白い画面しか表示されなくなります。

解決策としてはタグの順番を入れ替えればOKです。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>タイトル</title>
・・・以下略

titleタグに限らず、日本語（マルチバイト文字）が出力される前に
必ずエンコードを指定しておけば良いでしょう。

しかしながら、修正したファイルを本番サーバにアップしたときに
即時反映されない場合があります。

典型的ですが、こういった場合はサーバやクライアント側のキャッシュである可能性が考えられます。
クライアント側のキャッシュをクリアし、許されるならサーバキャッシュの削除、もしくは再アップロードで動作する場合があります。

いずれにしてもWebで開発する以上は、宿命的にブラウザ対応（主に文字化け）との戦いをしていくことになります。

仕様を統一してくれないかな、というのは世界中のWeb系エンジニアの願いです。。。