FileAPIメモ

FileAPIのメモ
ファイルの読み込みは
Fileオブジェクト、FileReaderを使う
選択されたファイルはfiles配列へ入る
テキストファイルの読み込みは
readAsText()
バイナリファイルの読み込みは
readAsBinaryString()
画像、映像ファイルなら
readDataURL()
を使う
バイナリデータ読みだしには
charCodeAt()など文字列処理メソッドが使える

ブラウザーの読み込み容量限界

ブラウザーの読み込み容量限界
バイナリデータは、ブラウザーにより限界容量が違う
ほとんどは4GBまでok
だけどchromeは2GB
FileAPIの仕様では
4GB以上でも可能だけど
ブラウザーにより限界容量があるため、
設計するときには注意が必要となる

ファイル読み込みのエラーコード

エラー処理
ファイル読み込み失敗すると
onerrorへ
設定したイベントハンドラが呼び出される
このイベントハンドラに渡される
Eventオブジェクトのtarget.error.codeへ
エラーコードが入る
エラーコードは以下の通り
1
ファイルが見つからない
2
セキュリティーエラー
3
読み込みが中断
4
読み込めない
5
エンコーデイングが間違っている

ソースの中の関数の見分けかた

ソースコードの中の関数がwordpress の関数なのか
PHPの関数かがわかると理解しやすい
これは
テンプレの場合なら
管理画面の 外観 > テーマ編集で
テンプレートのところから見たいものをクリックする
すると、下のほうに
解説:関数というドロップダウンリストがでるので
このときに、
PHP
Wordpress
の関数ならリストにでる
自作関数の場合はリストにでないので
まず、これで判別できる
次に、
PHP か wordpress なのかを判別するには
開いたときのURLで判断できる
ほとんどの場合、
wordpress.org ドメインなので
これなら
wordpress の関数になる
PHPの場合は
php.net ドメインになる
これがテンプレの場合の見分け方
プラグインの場合には
管理画面から
プラグイン >プラグイン編集へ進んで
同じように関数から調べることができる
こちらの場合は、PHPのほうが多い

wordpress プラグインの作成メモ

wordpress プラグイン開発のため
書籍を見ながら勉強です
とりあえず、ひとおおりインストールや記事の作成、テンプレなどまで進めました
ようやく、プラグイン作成のところです
今回は、プラグイン作成についてのメモです
作成したショーとコードをプラグインにする
最初に functions.php に書いたプラグインにするためのコードを
あたらしく作成しinたプラグインのためのphp ファイルへコピペして、もとの部分は消す
次に、このプラグインのためのPHPファイルを
plugins ディレクトリの中に新しくディレクトリを作り
そこへ保存する
あとは、ダッシュボードで
インストール済みのプラグインを表示すると
自作PHPプラグインファイルがでるので
これを有効化すればOK
念のため、サイトを更新して
変化がないことが確認できればOK
今回の参考書籍

Custom Post Type UI

カスタム投稿タイプと
カスタム分類を
Wordpress の管理画面で行うプラグイン
それが
Custom Post Type UI
Wordpres には、主要なデフォルトの投稿タイプとして
投稿
固定ページ
がある
Wordpress では、当校や固定ページと異なる特徴を持った独自投稿タイプをカスタム投稿タイプとして
定義して利用できる
定義したカスタム投稿タイプは
管理画面で
投稿
固定ページ
とは違った独立した項目
として表示できる
これがカスタム投稿
カスタム分類は
デフォルトの場合なら
カテゴリーとかタグだけど
これらと違う分類方法を定義して利用するのが
カスタム分類
これの使い道は
特定の投稿タイプにひも付けて使う
ここまでが概要
設置するには
プラグイン > インストール済みプラグイン

Custom Pos Type UI を有効化する
すると、ダッシュボードに
Custom Post Types という項目ができるので
Add New
をクリックすれば、設定画面がでてくるので
ここで設定する

FileReaderオブジェクトについて

FileReaderオブジェクトについて
テキストファイルの内容を読み込むには
FileReaderオブジェクトを使う
このオブジェクトには
テキストファイル
バイナリファイル
画像ファイル
などを扱うために必要なプロパティやメソッドがある
まず、FileReaderオブジェクトを定義
reader = new FileReader();
FileReaderオブジェクトを生成したら
テキストファイルを読み込む
テキストファイルを読み込ませるには
readAsText()を使う
reader.readAsText(textFile,”utf-8″);
readAsText()は、2つのパラメータを指定できる
最初のパラメータには
読み込ませたいFileオブジェクト
二番目のパラメータには
読み込むテキストファイルの文字コード
この文字コード指定は
meta要素のcharset属性と同じ
ちなみに、文字コードは省略できる
ただし、ブラウザーの自動判別なので
文字化けする可能性がある

テキストファイルか判別する処理

テキストファイルか調べるには
選択されたファイルを読み出すとき
input要素たと
multiple属性は指定してないから複数のファイルは選択できず
1つだけになる
しかし、これでもfilesは配列になるので
選択されたファイルへアクセスするには
以下のように
files配列の最初の要素を使う
var textFile = document.getElementById(“filedata”).files[0];
これで、textFileへFileオブジェクトが入る
でも、これには問題があり
accept属性はすべてのブラウザー対応じゃないから
ほかのブラウザーでは例外が起きてしまう
なので
Javascriptでテキストファイルか調べるようにする
ファイルの種類は
Fileオブジェクトの
type属性で調べることができる
ここには、MiME typeを示す文字が入る
しかし、ここでも問題発生
テキストファイルには
複数の種類があり
プレーンテキストだけでなく
HTMLとかも該当する
このため、さらに絞り込みするため
text/の文字が含まれるか調べる
テキストファイルを調べてみると
text/text
プレーンテキスト
text/html
HTMLファイル
text/xml
XMLファイル
text/css
CSSファイル
text/rtf
リッチテキストファイル
となる
なので、これを使い判別する
ソースにすると
if(textFile.type.indexOf(“text/”)!=0){
というように
Fileオブジェクトのtypeプロパティに
text/ が含まれるかを
文字列検索関数 indexOf()を使い調べる
indexOf()は
パラメータに指定した文字列が含まれているなら0を返す
つまり、今回なら
text/
が含まれているなら0を返し
そうでないなら
-1を返す
あと、判別を
!=0
としたのは
==-1
でも同じに見えるけど
image/text/など、変なときにエラーで-1を返したりするから
今回の場合だと
indexOf()は
text/が先頭以外、つまり、パスが違うときにも-1を返すため
==-1
だと、違うファイルを読み込む可能性がある
その点、!=0としておけば
text/から記述されているパスのみになるので、
途中のパスにtextを含むディレクトリまで選ぶことはなくなる

wordpress をSSLで保護

Admin SSL というプラグインを使うことで
wordpress をSSL対応にできます
まずは、お問い合わせと管理画面に大してSSL以外は
アクセスできないようにして
それ以外はhttp アクセス可能にします
まずは、ダッシュボードで
インストール済みプラグインの中から
Admin SSL を選んで有効化
すると、ダッシュボードの項目の中に
Admin SSL がでてくるので
Secure my site with SSL
のチェックボックスにチェックをいれます
あとは
URL List
というテキストエリアへ
wp-comments-post.php
wp-admin/plugins.php?page=akismet-key-config
の後に
適用したい記事や管理画面のURLを記述します
現在、管理画面は
wp-admin/
なので
これを追加します
あと、SSL対応についてですが
レンタルサーバーの場合、対応していないこともあるので
自宅サーバーで行いました
すでにUbuntu には
apache2 がインストールされているので
sudo a2enmod ssl
でSSL適用
sudo /etc/init.d/apache2 restart
で設定反映のため再起動します
念のため
nmap 192.168.10.248
で確認
PORT STATE SERVICE
22/tcp open ssh
80/tcp open http
443/tcp open https
902/tcp open iss-realsecure
となり、
443 ポート開放を確認
引き続き、証明書の作成です
sudo mkdir /etc/apache2/ssl
でディレクトリ作成
sudo make-ssl-cert /usr/share/ssl-cert/ssleay.cnf /etc/apache2/ssl/apache.pem
で証明書と秘密鍵発行
コマンドを実行すると
SSL 証明書で使うホスト名を入力してください。
これは生成される SSL 証明書内での「commonName」になります。
ホスト名:
とでてくるので localhost から
サーバーIPに変更します
今回は192.168.10.248
sudo cp /usr/share/doc/apache2.2-common/examples/apache2/extra/httpd-ssl.conf.gz /etc/apache2/sites-available
でファイルをコピー
cd /etc/apache2/sites-available
で移動してから
sudo gunzip httpd-ssl.conf.gz
で解凍
sudo vim httpd-ssl.conf
で設定ファイルを開き
Listen 443

#Listen 443
というようにコメントアウト
さらに
<VirtualHost _default_:443>

<VirtualHost *:443>
というように変更
DocumentRoot “/usr/share/apache2/default-site/htdocs”

DocumentRoot “/var/www”
ServerName www.example.com:443

ServerName 192.168.10.248:443
へ変更
192.168.10.248はサーバーIPです
SSLCertificateFile “/etc/apache2/server.crt”

SSLCertificateFile “/etc/apache2/ssl/apache.pem”
SSLCertificateKeyFile “/etc/apache2/server.key”

SSLCertificateKeyFile “/etc/apache2/ssl/apache.pem”
設定完了したら
sudo a2ensite httpd-ssl.conf
で設定ファイルを反映し
sudo /etc/init.d/apache2 restart
で apache2 再起動します
これでSSL対応完了です

Counterize の設置

Conterize は
リアルタイムに訪問者のアクセス状況を
グラフなどで確認できるプラグイン
リアルタイムでわかりやすので使いやすい
ただし、アクセスログ解析と記録をしているので
そのぶん、負荷がかかる
また、ページキャッシュの場合は、
正常にアクセスログを取得できないので
このあたりは注意が必要
設置は簡単で
インストール済みプラグインの中から
Counterize を選んで有効化すればOK
プラグインを有効化すれば
ダッシュボードに
Counterize が出現するので
あとは解析するだけ