【htaccess】よく使うhtaccess集

2011年8月15日 7:17 PM

サーバーを設定する際に、僕がよく使っている「htaccess」を集めてみました。

ちなみに、使い方は、サーバー上でファイル名を「.htaccess」にする。
ファイル内に一行ずつ書いていきます。

【1】 IPアドレス制限

テストサイトなど自社のIPアドレスのみでアクセスしたい場合は。
「
order deny,allow
deny from all
allow from xxx.xxx.xx.xxx
」

特定のIPアドレスを拒否したい場合は。
「
order deny,allow
allow from all
deny from aaa.aaa.aa.aaa
」

追加で何個追加しても大丈夫。「」内を「htaccess」に入力してね。

「
order deny,allow
allow from all
deny from aaa.aaa.aa.aaa
deny from xxx.xxx.xx.xxx
」

IP制限は、エクスプロード･ラボでも提供中。

【2】index.html 以外をデフォルトファイルにする

「
DirectoryIndex index.html index.htm index.php
」

【3】サーバーによってディレクトリ内容一覧参照が出来てしまうのを非表示にする
DirectoryIndexに、.htを最後に付ける。
「
DirectoryIndex index.html .ht
」

【4】URLに「www」を必ず付けてアクセスするようにする。
「
RewriteEngine On
RewriteCond %{HTTP_HOST} ^test\.comRewriteRule (.*) http://www.test.com/$1 [R=301,L]
」
test\.comをwww\.test\.comに入れ替えて、http://www.test.com/をhttp://test.com/にすれば逆になる。

【5】PCと携帯振り分け
「
RewriteEngine On
RewriteCond %{HTTP_USER_AGENT} ^(DoCoMo|KDDI|DDIPOKET|UP.Browser|J-PHONE|Vodafone|SoftBank)
RewriteRule ^$ http://mobile.test.com/ [R]
」

【6】アップロード容量の変更
php.iniで変更するが、サーバーによって出来ない場合はhtaccessで。以下は50MBに設定。
「
php_value upload_max_filesize 50M
php_value post_max_size 50M
」

【7】携帯サイトをxhtmlで作った場合
下記TYPEを追加すれば、xhtmlモードでアクセスできる。
「
AddType application/xhtml+xml .html
」

【8】ベーシック認証
「
AuthType Basic
AuthName “Input your ID and Password.”
AuthUserFile /home/test.com/admin/.htpasswd
require valid-user
」

※Authentication for phpMyAdminは、画面上のメッセージです。
AuthUserFile /home/test.com/admin/.htpasswd　で、「.htpasswd」のファイルを指定します。
/home/test.com/admin/は、ドキュメントルート。

.htpasswdは以下のような記述
「
cs112190399:5lfCZfYm0yQVU
」
複数人で行う場合、2行目、3行目と続ける。
パスワードはエンコードする。

パスワードのエンコードは、エクスプロード･ラボでも提供中。

カテゴリー：htaccess ： コメント（0）

【IE】スーパーリロード

2011年8月10日 6:03 PM

WindowsのInternet Explorerを使っていると、キャッシュが強すぎてなかなか画像などが更新されない事がある。

別のブラウザにすれば解決になるのだろうが、やはりWeb開発事務所だとそうはいかない。

FireFoxやSafariは全く問題ないのに、一番使われているIEがこうだと仕方がないのでメモ。

【回覧の履歴】でキャッシュ削除でもいいのだが、それだと一時しのぎだし、やっぱり設定で毎回確認するように変更した方がいいのかも。

カテゴリー：Tips, Windows ： コメント（0）

【Mac Book Air】Lionにアップデートしました。

2011年8月6日 6:07 PM

2008年の10月、2代目のMac Book Airを購入して使っていたのだが、「snow leopard」にしたら重くて全くもって使えなくなった。

結構、いろんなアプリケーションもインストールしていたので、それで重くなっていたのかもしれないが、メール見るのも、WEB見るのも、遅くて遅くてイライラしていたのだ。ずっと、Waitマークが回りっぱなし。

Airってこんなもんかなって思っていて、普通にMac Bookの方を買った方が良かったかもって思っていた。

Lionがインストール済みの最新Mac Book Airを購入しようかまで思っていて、このAirは捨ててしまおうかとも思っていた。
それほどに、使えないハードだったのだ。

試しに、Lionをインストールして、それで駄目なら誰かにあげようかと思っていたのだが、Lionにしたとたんサクサク操作ができ、とても使いやすくなったのだ。

メモリも固定２GBだから心配していたのだが、これなら十分に使える。
Boot CampのWindows XPも入っているので、仕事で使うのにも十分だと思う。

2008年製の1.6GHのAirを持っている方は、Lionにアップデートしてみてはいかがだろうか。間違いなく、「Leopard」や「snow leopard」 より快適ですよ。

もしかしたら、僕のAirは元々欠陥があったのかもしれないけど。

カテゴリー：Mac, Tips ： コメント（1）

【Mac OS X Lion】インストールディスクを作る。

2011年8月5日 6:41 PM

Lionは、現在は、Mac App Storeからの購入のみで、インストールが終わるとインスーラーが消えてしまうのだ。

同じMac App Store上のアカウントで、複数のMacにもLionにアップデートできるとなっているのだが、

毎回、3.6GBのデータをダウンロードするのも大変。

それに、初期化して再インストールする場合、ディスクからではないと無理なので

インストールディスクの作り方をメモ。

不調になったときに、ディスクから立ち上げて、FirstAidをかけることもできるので。

まず、Lionのインストール前にディスクをつくらないと駄目です。インストールが終わると自動的にインストーラーが削除されるので。

Lionのインストーラーを右クリックで、「パッケージの内容を表示」を選び、
「Contents」→「SharedSupport」 、その中に「InstallESD.dmg」があります。

それを、ディスクユーティリティーを使い、DVDに焼きましょう。

１）Lionのインストーラーを右クリック→「パッケージの内容を表示」→「Contents」→「SharedSupport」をFinderで開いた状態で、

「ディスクユーティリティー」→「新規イメージ」のファイル選択画面に、Finderから「InstallESD.dmg」をドラッグする。

※このやり方は、僕も今回初めて知って、とても使いやすいので、覚えておいていいかもです。

２）これで、焼き終われば完成です。

カテゴリー：Mac, Tips ： コメント（0）

【Mac OS X App】オススメのOSXアプリケーション 1

2011年8月5日 6:19 PM

僕がいつも手放せないくらいに使ってる、Mac用のソフトウェアを紹介します。

僕は、Macユーザーですので、やっぱり、なんでもかんでもMacでやりたいですね。

WEBデザインやプログラムコードを書いているので、
今回は、WEB制作で使っているアプリケーションです。

気に入ったら使ってみて下さい。 

	説明
	Transmit（FTPソフト） CyberDuckを使っていたのですが、色々トラブルがあり、こちらを使ってます。 WindowsのFFFTPのようなローカルファイルとリモートファイルが表示でき、とても使いやすいです。 mobileMeに入っていれば、自宅と会社のMacの接続先を同期する事ができて便利です。 サクサク動くし、Lionにも対応しているし、FTP以外にもSSHなども出来て、2,950円なのでオススメです。
	JEdit（テキストエディター） HP作ったり、PHP書いたりするのには必須です。各種文字エンコードにも対応し、一番使いやすいエディターです。 JCheckerを追加すればHTMLの構文チェックもしてくれますし、無料のJHTMLを使えば、タグやカラー設定などがやりやすいです。 Mac付属のエディターは、文字化けになり使えないですが、このソフトは安心です。2,800円ですので、MacのWEBデザイナーには必須です。
	Zipeg（ZIP解凍ソフト） Macではファインダーでzip圧縮や解凍ができますが、圧縮はいいのですが、解凍すると文字化ける場合があります。 zipegは、各種文字エンコードにも対応していますので、 文字化けの心配がありません。 Stuffitもzipに関しては化ける時は文字化けするので、zip解凍は、Zipegにしています。 文字化ける場合は、エンコードを変更すれば文字化けません。無料です。
	StuffIt Destinations（圧縮･解凍ソフト） ランチャーになり、圧縮･解凍しやすくなりました。MacはやっぱりSIT形式ですよね。 SIT以外も圧縮できますし、解凍も出来ますので必須です。 2,600円です。
	DropBox（オンラインストレージ) ２GBが無料で使えるし、Windows版もあるし、Mac版もあるし、iPhone版もあるしで、全てのプラットフォームでファイルを共有できるのがいいですね。 MacでDropboxにファイルをコピーし、iPhoneやiPadで見ています。
	Adobe Creative Suite（デザインアプリケーション） 全ての分野のデザイナーに必須のソフトウェアのパッケージ。 イラストレーターやフォトショップ、インデザインにアクロバットなどなど多様なパッケージで販売されています。 やはり、画像の変換や制作もするので、僕にとっては無くてはならないソフトです。 ですが、Design Premiumでも、238,000円しますので、CSパッケージより、単品で買った方がいいかもしれないですね。 画像編集だけでしたら、Photoshop Elementsなら、14,490円です。 ※ちなみに通常のPhotoshopは、95,000円です。

 

 

 

 

 

カテゴリー：Mac, Tips ： コメント（0）

【SSH】SSHでダウンロードと解凍

2011年8月4日 6:58 PM

SSHでのダウンロードって、あまりやらないから、いざやろうと思うと忘れちゃうのでメモ。

SSHでサーバーにアクセスし、

ダウンロードするディレクトリに移動する。

移動は、「cd」コマンド
cd /usr　って感じで使用します。

現在のディレクトリのリスト表示は、

「ls」コマンド

ダウンロードは、「wget」 コマンド
wget ftp://ftp.test.com/test.tar.gz

上記のようにダウンロードします。

解凍は、「tar」もしくは「bunzip2」コマンド
※（）内の拡張子に合わせてコマンドを使ってください。
tar xvf ファイル名（.tar)
tar -zxvf ファイル名（.gz .tgz)
bunzip2 file ファイル名（.bz2)

ビルド＆インストールは下記のコマンドを使用します。

./configure
make
make check
sudo make install

ビルド＆インストールについては、長くなるのでまた今度。

カテゴリー：Tips, サーバー ： コメント（0）

【無線LAN】BUFFALO WZR-HP-G302Hで、無線LANが切れやすくなる

2011年8月3日 4:22 PM

BUFFALO WZR-HP-G302Hで、無線LANが切れやすくなるのでその対策のメモ。

きっと周りの会社や個人の無線LANと干渉してると思うので、
無線チャンネルを変更すれば対処できる。

通常未設定だと、11チャンネルなので、６チャンネルや１チャンネルにすれば改善された。

周りも同じチャンネルを設定し出すと、また干渉しちゃうんだけどね。

BUFFALOのチャンネルの変更のやり方は、

ブラウザから無線LANルーターにIP接続し、例）http://192.168.11.1/など（BAFFALOは、初期192.168.11.1らしい）

無線設定　＞　基本(11n/g/b)　＞　無線チャンネル　を変更してみてください。

5以上チャンネルが離れればいいみたいなので、初期11chでしたら6ch以下がいいかもしれないですね。

※ちなみに僕は1chにしました。

カテゴリー：Tips, 無線LAN ： コメント（1）

【DOM】XHTMLにおける、　Aタグでtargetを使わないやり方。

2011年8月2日 9:14 PM

XHTMLになり、aタグのtargetが非推奨になり、XHTML1.1では廃止ですので、targetを使わない別リンクへの移動方法をJavascriptで行おうというメモ。

target=”_blank”は、記述も簡単で便利だったが、ユーザビリティに配慮し強制でウィンドウを移動するのはユーザが選択するべき事項で、サイト側で指定するものではないとの事ですので、JavaScriptで以下のように記述する事にしました。

色んな参考書を参考にして使用していますが、ご了承ください。

説明時のサーバー内ディレクトリは以下のようになっています。

index.html
└　 js
├ dom.js
└set.js

—HTMLファイル内（index.html）—

ヘッダー内に以下の行を追加

<script type=”text/javascript” src=”./js/dom.js”></script>
<script type=”text/javascript” src=”./js/set.js”></script>

body内のリンクがある部分に記述：以下は例題

<div id=”event”>
<a href=”http://www.explowd.co.jp/”> <img src=”./img/banner_jp.jpg” alt=”” width=”234″ height=”60″ /> </a>
</div>

—JavaScriptファイル内—

（  dom.js  ）

var dom = new Object();
dom.event = new Object();
dom.event.addEventListener = function(elm, type, func, useCapture) {
if(! elm) {return false; }
if(! useCapture) { useCapture = false; }
if(elm.addEventListener) {
elm.addEventListener(type, func, false);
} else if(elm.attachEvent) {
elm.attachEvent(‘on’+type, func);
} else {
return false;
}
return true;
};

dom.event.removeEventListener = function(elm, type, func, useCapture) {
if(! elm) { return false; }
if(! useCapture) { useCapture = false; }
if(elm.removeEventListener) {
box.removeEventListener(type, func, false);
} else if(elm.detachEvent) {
elm.detachEvent(‘on’+type, func);
} else {
return false;
}
return true;
};

dom.event.target = function(evt) {
if(evt && evt.target) {
if(evt.target.nodeType == 3) {
return evt.target.parentNode;
} else {
return evt.target;
}
} else if(window.event && window.event.srcElement) {
return window.event.srcElement;
} else {
return null;
}
};

dom.event.preventDefault = function(evt) {
if(evt && evt.preventDefault) {
evt.preventDefault();
evt.currentTarget[‘on’+evt.type] = function() {return false;};
} else if(window.event) {
window.event.returnValue = false;
}
};

dom.event.stopPropagation = function(evt) {
if(evt && evt.stopPropagation) {
evt.stopPropagation();
} else if(window.event) {
window.event.cancelBubble = true;
}
};

————（  dom.js  ）ここまで——————–

（  set.js  ）

dom.event.addEventListener(window, ‘load’, initDocument);

function initDocument() {

var event = document.getElementById(‘event’).childNodes;
for(var i=0; i<event.length; i++) {
var elm = event.item(i);
if(elm.tagName != “A”) {
continue;
}
dom.event.addEventListener(elm, ‘click’, openWin);
}

}

function openWin(evt) {
dom.event.preventDefault(evt);
var target = dom.event.target(evt);
var url = target.parentNode.href;
var w = window.open(url);
w.focus();
}

————（  set.js  ）ここまで——————–

※緑文の部分は、使用方法により置き換えてください。
例では、<div id=”event”></div>内にある<a>だけにonclick要素でopenwin関数を呼び出すようにinitDocumentで指定しています。
div内には、何個でもあaタグを含める事ができます。
後は応用してみてください。
※dom.jsの後に、set.jsをヘッダー内に記述してください。
※青色部分は、aタグ内が画像ではなくテキストの場合は、削除してください。

以下がjsファイルです。気に入ったら使ってください。

index.txt ※保存したら拡張子をhtmlに変えてくださいね。

dom.js
set.js

カテゴリー：JavaScript, Tips ： コメント（0）

【HTML】正規表現

2011年8月1日 9:22 PM

文字列処理で、フォームから送られた文字列などから特定の文字列を抽出したり、ある特定のパターンにマッチする文字列を処理する式。

プロパティ

match( /正規表現/ ) ()内で指定した式にマッチするかを判断する。マッチの時はtrue。その他はfalse
replace(/正規表現/, 置換文字) 第一引数でマッチした文字列を第二引数(置換文字)で置き換える。
search(/正規表現/) マッチしたらマッチ箇所を番号で返す。マッチしなかった場合は、-1が返る

バックスラッシュ【\】

【.】【-】【/】【¥】【+】【*】【$】など正規表現内で使用される記号を文字列として使用したい場合は、記号の前に【\】を付けます。これを【エスケープする】と呼びます。

【例題】Javascriptです。

match(/0123/) 　　【0123】にマッチ。012、123にはマッチしない。

match(/[0123]/) 　【[]】内の文字のどれかにマッチ。

match(/[0123]+/) 　【+】は、1文字以上にマッチ。

match(/[0123]\.[0123]+/) 　【.】はバックスラッシュでエスケープ

match(/[^0123]\.[0123]+/) 　【[^]】は【[]】内以外にマッチ。

match(/^[0123]\.[0123]+/) 　【^[]】は文字の最初にマッチ。

match(/^[0123]+@[0123]+\.(com|co.jp)$/) 　【com】【co.jp】のどちらかの場合は【()】で囲み【|】で分ける。【$】は文字の最後にマッチ。

match(/[あいうえお]/) あいうえおのどれかにマッチ。

【例題】PHPです。

if (!eregi(“^[a-z0-9]([a-z0-9]|\-|\_|\.)+@[a-z0-9]([a-z0-9]|\-)+[a-z0-9]([a-z0-9]|\-|\.)+[a-z]{1,4}$”, $mail )){ print “エラー”; }

• ^[a-z0-9]([a-z0-9]|\-|\_|\.)+　→　一文字目がa〜zか0〜9のいずれか一文字。その後に続くのは、a〜zか0〜9か-_.のいずれか何文字でも可。
• @[a-z0-9]([a-z0-9]|\-)+　→　@の文字のあとa〜zか0〜9のいずれか一文字が続き、その後に続くのは、a〜zか0〜9か-のいずれか何文字でも可。
• [a-z]{1,4}$　→　最後尾の文字から数えて1文字〜4文字は、a〜zのいずれか。
• eregiは、上記ですと$mail変数に、正規表現による文字列を検索する関数です。文字が見つかったらTRUE、なければFALSEが返り値となって返ってきます。
  !が付いているのは、反対の動作で、【文字が含まれなかったら】という意味です。
  例題では、指定の変数に正規表現の文字列が含まれていなかったら、エラーですと表示させるスクリプトです。

カテゴリー：HTML, Tips ： コメント（2）

【HTML】文字参照一覧・文字実体参照／数値文字参照

2011年8月1日 8:59 PM

文字参照一覧

HTML／XHTMLの特殊記号がそのまま表示されるように記述したり、キーボードで直接入力できない文字を記述するための方法を文字参照という。

文字参照は2種類の方式があります。たとえば「<」は文字実体参照では「<」、数値文字参照では「<」と記述する。

■文字実体参照（character entity references）

■数値文字参照（numerical character references）

なお、XHTML 1.0ではアポストロフィ（文字実体参照「'」、数値文字参照「'」）が新たに文字参照に加えられた以外はHTML 4.01と同じ。ただし、文字実体参照「'」は正しく表示されない場合が多いので、数値文字参照「'」と記述よい。

Latin 1 Characters (ISO 8859-1)

Special Characters

Symbols

カテゴリー：HTML, Tips ： コメント（0）