やったこと

webサービスを作るときに考えたことを垂れ流します

このブログについて

absgといいます。webサービスのこととかいろいろ書いてます。

最近作ったサイト
全国で発生した事件のデータベース「地域の事件簿」
みんなでなかよく政治の話!「なかよし討議!」
女子のつぶやきまとめ「Twiggy×Twiggy!」
ツイッターバトラーズ!
ニコニコ人気ユーザーランキング


連絡先
何かご相談がある人はご連絡ください。
http://absgexp.net/prof/con.html

    (⌒)
  ∧__∧ (~)
 (。・ω・。)( )
 { ̄ ̄ ̄ ̄}
 {~ ̄お__}  ゴユックリ ドゾー
 {~ ̄茶__}
 {____}

JavascriptでURLエンコードした文字列がPHPでデコードできない!

タイトルそのままの不具合です・・。

javascript側でURLエンコードした文字列がPHP側でデコードできない・・。

javascript側では「escape()」という関数でエンコードしました。
そして、PHP側では「urldecode()」という関数でデコードしました。
でも、これではちゃんとデコードできない!

どうもjavascript側にはいろいろなエンコードの形式があって「escape()」という関数はPHPとあまり相性がよろしくないみたい・・。なので、代わりに「encodeURIComponent()」という関数を使うことにしました。

この形式でエンコードすれば、ちゃんとPHPの「urldecode()」でデコードができます!

下記ページに、双方の対応関係がとても詳しくのっていますね…。
Javascript と PHP の URLエンコード について | Lonely Mobiler

以上!

Font Awesomeを使ってツイッターのアイコンを作る!

いろんなWebアイコンフォントが無料で使える便利なライブラリ「Font Awesome」を使って、ツイッターの青い鳥のアイコンを作ってみましょう。

①ライブラリの読み込み!
まずはFont Awesomeのcssのライブラリを読み込みます。下記ページのCDNで提供されているものを利用してしまいましょう。
Quick Start · BootstrapCDN by StackPath

HTMLにこんな風に記述してcssを読み込みます。

<link href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.min.css" rel="stylesheet">


②アイコン設置!
そしてアイコンを設置します。文章中にこんな風に記述すると、ツイッターの青い鳥の文字アイコンが表示されます。

<i class="fa fa-twitter" aria-hidden="true" style="color: #00aced;"></i>

簡単にできましたね、以上です!

【PHP】AWSでhtmlをphpとして実行したいんだけどできない!

この前借りたAWSサーバーで「index.html」というページを「index.php」として実行したかったんですが、なかなか設定がうまくいきませんでした・・。

(ちなみにPHPのバージョンは5.6です・・)

これをやるときの典型的な方法は「.htaccess」に以下のような設定を追加するというもの。

AddType application/x-httpd-php .html


しかし、これを追加しても全然PHPが実行されません・・。

仕方がないので、「httpd.conf」(/etc/httpd/confのディレクトリにあります)に、上記の設定を直接書き込むことにしました。

そして設定追加後「sudo service httpd restart」を打ってhttpdを再起動。

これでhtmlがphpとして動作するようになりました。

AWSのサーバーは「.htaccess」に直接書き込む方法は、禁止されているんですかね。

まあとりあえず動いたので、これでよしとします・・。

【CakePHP3】APIを作ろうとしてエラーが出て混乱の極み…。

CakePHP3でAPIを作ろうと思ってちょっと苦労をしてしまいました・・。

クライアンからajaxでリクエストを送ると、なにかデータを返してくれるという簡単なものを作ろうとしたんですが、
CakePHPのエラーログに「Controller action can only return an instance of Response」と出てきて、どうしても処理に失敗していまいます・・。

↓公式ページの例文どうりに作ってるはずなんですが、どうもエラーの原因が分かりません・・。
https://book.cakephp.org/3.0/ja/views/json-and-xml-views.html

散々悩んだ挙句にとてもくだらない理由が判明しました・・。

以下のコードの「$array[$i]」の箇所ですが、$iが存在しない配列を参照していたためでした・・。

class HogegeController extends AppController
{
    public function api()
    {
      ・・・
      $hoge_id = $array[$i];

      //結果を返却
      $result['status'] = "ok";
      $result['id"] = $hoge_id;
      $this->set(compact('result'));
      $this->set('_serialize', ['result']);
    }

なんだかすごいエラーログが出てきて「データビューの使い方を間違っているのか?」などと混乱してしまったんですが、結局その手前でしくじっていたということなんですね・・。

あ~くだらな。

【PHP】ツイッターのテキスト内の「@ユーザー名」の文字列を削除する!

PHP正規表現置換関数「preg_replace」を使ってつぶやきテキスト内の「@ユーザー名」を削除する方法です。

コードは以下のような感じ。「@hogehoge(+空白)」や「@fagafaga(+空白)」の文字列を置換によって削除します。

$test_str = "@hogehoge @fagafaga ツイッターってAPIで取得したテキストに@リプライが入ってるのがうざいよね~。";
$test_str = preg_replace('/.*@[0-9a-zA-Z_]+\s/', '', $test_str);
echo $test_str;

以上!

グーグルマップのウィンドウにFacebookのボタンを動的追加すると画面がずれる!

すっごい細かい問題に直面してしばらく悩んでしまいました…。

グーグルマップのマーカーをクリックしたときに開かれる「インフォ・ウィンドウ」ってありますよね…。

あのウィンドウが表示されたあと、その内側に「Facebookのシェアボタン」を動的に追加する処理を入れたんです(jQueryで追加です…)

そうすると、追加されたFacebookのシェアボタンの縦の長さが、一瞬だけとてつもなく長くなって、マップ画面が勝手に当てずっぽうの方向にスライドしてしまう…。

何を言っているのかよく分らないと思いますが、とくかくそういう現象に悩まされてしまいました…。

仕方がないので、Facebookのボタンがニュ~ンと伸びてもウィンドウのサイズに影響を与えないように、ボタンの周囲を囲むDIVに以下のようなcssを適用しましたよ…。

.facebook-btn {
  max-height: 20px;
  overflow: hidden;
}

これで縦に伸びるアホFacebookのボタンがウィンドウに及ぼす影響を殺すことができました…。

めでたしめでたし…。