S3のサイトからAmazon API Gatewayのリクエストを発行したらOrigin https://s3-ap-northeast-1.amazonaws.com is not allowed by Access-Control-Allow-Originが出てハマった

以下の手順で解決した。

(1) Amazon API Endpointの管理画面から/Optionsのリソースを選択する。

(2) Method Responseの Response Header for 200にAccess-Control-Allow-Header,Access-Control-Allow-Origin ,Access-Control-Allow-Methodsを追加する。

スクリーンショット 2016-02-27 20.26.44

(3) Integration Responseを選択して、以下の内容を記述する。

Access-Control-Allow-Header ‘Content-Type,X-Amz-Date,Authorization,X-Api-Key,X-Requested-With’
Access-Control-Allow-Origin ‘*’
Access-Control-Allow-Methods ‘POST,GET,OPTIONS,PUT,DELETE’

スクリーンショット 2016-02-27 20.15.50

Ajaxでリクエストを発行する場合はAccess-Control-Allow-Headerに”X-Requested-With”を記述しないと動作しないので注意!

mochaで非同期処理のテストを行う

it()やafter()等のコンテキストにdoneを引数に渡してテストが終了した時点ででdone()を呼ばせると非同期処理のテストが出来る。


let request = require('request');
...

it('Should create user',(done) => {
	    let options = {
	    	method: 'post',
	    	body: {},
	    	json: true,
	    	url:  'SOME_URL'
	    }
	    // 
	    request(options,function(err,res,body){
	    	console.log('ok');
                //テスト開始
                assert.equal(body,'hello world');

                //テストが終了したのでdone()を呼ぶ
                done();

	    });
	});

node-notifierでES6とSCSSをコンパイルした時のエラー内容をデスクトップに通知させる

node-notifierとはWindows/Mac/Linuxのデスクトップに通知を出すライブラリです。これを使うと簡単にデスクトップに通知を発行できます。

node-notifierを使ってES6とSCSSをコンパイルした時のエラー内容をデスクトップに通知させると開発がかなり捗るようになったので以下に手順を記しておきます。
ちなみにコンパイルにはgulpを使用しています。

手順

依存パッケージをインストール

npm install gulp gulp-sass gulp-watch gulp-plumber gulp-notifier gulp-babel node-notifier

※ gulp-plumberを使用するとwatchプロセスでファイルを監視中にエラーが起きてもプロセスが落ちなくなります。

gulpfile.js

プロジェクトのルートディレクトリの直下にscss,css,buildディレクトリがある場合は以下になります。

var gulp = require('gulp');
var watch = require('gulp-watch');
var plumber = require('gulp-plumber');
var notifier = require('node-notifier');
var sass = require('gulp-sass');
var babel = require('gulp-babel');


function onError(msg){
    //エラーが出力されたらデスクトップにメッセージを通知させる。
    var type = msg.name;
    var msg = msg.message;
    notifier.notify({
        'title': type,
        'message': msg
    });
};

gulp.task('sass',function(){
    //scssをコンパイルする。
    gulp.src('./scss/**/*.scss')
               .pipe(sass())
               .on('error',onError)
               .pipe(gulp.dest('./css'));
});

gulp.task('babel',function(){
    //ES6をコンパイルする。
    gulp.src('src/**/*.js')
    .pipe(plumber())
    .pipe(babel())
    .on('error',onError)
    .pipe(gulp.dest('build'));
});

gulp.task('watch', function() {
    //ファイルに変更があればコンパイルする。
    var srcJS = 'src/**/*.js';
    var gulpSCSS = 'scss/**/*.scss';
    gulp.watch(srcJS,['babel']);
    gulp.watch(gulpSCSS,['sass']);
});

[Django] WhiteNoiseを使って静的ファイルを配信する

WhiteNoiseとは?

WhiteNoiseとはWSGIアプリケーションのための静的ファイルを配信するのを簡単にしてくれるライブラリです。
少しの設定をするだけでAmazon S3やNginxに頼ることなく静的ファイルを配信できます。
本番サーバーで画像やcss等を参照できるようにするには色々と手順を踏まないといけなかったのですが、WhiteNoiseを使うとそのような手間が省けて大変便利です。

Install

$pip install whitenoise

settings.py

BASE_DIR = os.path.dirname(os.path.abspath(__file__))

STATIC_ROOT = 'staticfiles'
STATIC_URL = '/static/'
STATICFILES_DIRS = (
    os.path.join(BASE_DIR, 'static'),
)

STATICFILES_STORAGE = 'whitenoise.django.GzipManifestStaticFilesStorage'

wsgi.py

from django.core.wsgi import get_wsgi_application
from whitenoise.django import DjangoWhiteNoise

application = get_wsgi_application()
application = DjangoWhiteNoise(application)

静的ファイルをSTATICFILES_STORAGEにコピーする

$python manage.py collectstatic

Done!

これで本番サーバーでも静的ファイルを参照できるようになります。

UITableViewCellがタップされた時の背景色を変更する

UITableViewCellのUITableViewCellSelectionStyleを変更すればよい。
標準では以下の4種類のスタイルが用意されてある。

  • UITableViewCellSelectionStyle.Default
  • UITableViewCellSelectionStyle.Blue
  • UITableViewCellSelectionStyle.Gray
  • UITableViewCellSelectionStyle.None

例えば、背景色を表示させないようにする場合は以下の実装になる。

func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell            {

    let cell = tableView.dequeueReusableCellWithIdentifier("UniqCell") as! UITableViewCell
    cell.selectionStyle = UITableViewCellSelectionStyle.None

}

上の4種類に含まれていない背景色にするには、selectedBackgroundViewに任意の色のUIViewを代入すれば実現できる。
赤色にする場合は以下のようになる。

...
// selectionStyleを使用しないので、UITableViewCellSelectionStyleNoneを設定。
cell.selectionStyle = UITableViewCellSelectionStyleNone
let selectedView = UIView()
selectedView.backgroundColor = UIColor.redColor()
cell.selectedBackgroundView =  selectedView