web ViewでなんちゃってPWAを作ってみた。 ~javascript alert()が動かない~

PWAとは

..progressive web apps

とよばれるアプリケーションですね。詳しいことは割愛しますが。基本的には ブラウザ最強！ ネイティブアプリいらなくね？？？？？？ というような思想(違う)というものです。。

ただ、iOSのsafariでは、まだPWAの基盤になりうる、push通知やservice worker などがまだ実装されていないのです。

そこで今回はwebViewにしてみました。 その際のTipsを軽くまとめます。

javascript の alert関数や comfirm のウインドウが開かない

今回は該当のVC (WebViewを使っているVC) に対してWKUIDelegateを使いjavascriptがうまく動くように実装します。

extension SampleViewController: WKUIDelegate {
    
    // alertを表示する
    func webView(_ webView: WKWebView, runJavaScriptAlertPanelWithMessage message: String, initiatedByFrame frame: WKFrameInfo, completionHandler: @escaping () -> Void) {
        
        let alertController =
            UIAlertController(title: "", message: message, preferredStyle: .alert)
        
        let okAction =
            UIAlertAction(title: "OK", style: .default) { action in
                completionHandler()
        }
        
        alertController.addAction(okAction)
        present(alertController, animated: true, completion: nil)
    }
    
    // confirm dialogを表示する
    func webView(_ webView: WKWebView, runJavaScriptConfirmPanelWithMessage message: String, initiatedByFrame frame: WKFrameInfo, completionHandler: @escaping (Bool) -> Void) {
        
        let alertController =
            UIAlertController(title: "", message: message, preferredStyle: .alert)
        
        let cancelAction =
            UIAlertAction(title: "Cancel", style: .cancel) { action in
                completionHandler(false)
        }
        
        let okAction =
            UIAlertAction(title: "OK", style: .default) {
                action in completionHandler(true)
        }
        
        alertController.addAction(cancelAction)
        alertController.addAction(okAction)
        
        present(alertController, animated: true, completion: nil)
    }
    
}

このようにすることで alert(), comfirm()が正常に動くようになります。

why ?

webViewは基本的にブラウザのWindowを一つしか描画しないようです。

しかしながらJavascriptを利用すると、ブラウザはalert用のwindowを新規に作成します。 つまり、本来であればブラウザの中に別のwindowを展開するのですが、webviewではそれが不可能なので、 swiftの alertViewを利用してalertを表示するようにします。

こうすることでwebViewにてjavascriptのalert, comfirmが動くようになります。

インジケータを出したい。

extension SampleViewController: WKNavigationDelegate {
    
    func webView(_ webView: WKWebView, didStartProvisionalNavigation navigation: WKNavigation!) {
        UIApplication.shared.isNetworkActivityIndicatorVisible = true
        showIndicator()
    }
    
    func webView(_ webView: WKWebView, didFinish navigation: WKNavigation!) {
        UIApplication.shared.isNetworkActivityIndicatorVisible = false
        self.view = webView
        self.indicator.stopAnimating()
    }
    
}

こうすることでwebViewの中でロードしている最中はstatus bar にてインジケータが出ます。

fumihumiサクッとメモでした。

Podfileを変更したときに’Linker Error’になった。

Podfileを変更したときに’Linker Error’になった。

self.memo for 未来の自分へ

cocoapodにてライブラリ管理をしていると このらいぶらり古いやん。 変更しよ。 となることが多いと思うのですが。その際に下記のようなエラーが出たとき。

clang: error: linker command failed with exit code 1 (use -v to see invocation)

この前にも

ld: library not found

のようなエラーがある、 つまりこの後に続くlibraryが該当プロジェクトにないというエラーっぽい。

→ GUIでproject→General→ Linked Frameworks and Librariesのところを編集してなかったことが原因でしたとさ。。

podでインストールしたら上記を書き換える人もいるのかなと思います。それを忘れるとエラーになってしまう。

bootstrap4 flexで'wrap'されない

memo

タイトルのような環境にて開発している時に

                <div class="screen-shot d-flex flex-row flex-wrap">
                    <img src='/image/mac_screen_shot.png' class='screen-shot-mac'>
                    <img src='/image/iphone_screen_shot.png' class='screen-shot-iphone' >
                </div>

としていたら思っていた挙動になりませんでした。

これは

flex-row

flex-wrap

この相反する要素が競合していることが原因だと思います。

flex-rowを削除してやることでうまく動くことができました。

rbenv global ~~が切り替わらない。 homebrew で '/usr/local/bin/brew: line 79: /usr/bin/env: Argument list too long', '/usr/local/bin/brew: line 79: /usr/bin/env: Undefined error: 0'

結論 ~/.bash_profileにPATHを改変する記述があった。

export PATH="/usr/local/bin:$PATH"

状況

私はrubyを割と頻繁に記述をしているのですが、とあるプロダクトにて.ruby-versionを使った管理がありました、 ただ ruby -v をしても。指定のヴァージョンにはなっておらず。

@fumihumi:which ruby /usr/local/bin/ruby

ruby のパスを見ているとなぜか。 '/usr/local/bin/ruby' ............

正しくは '.rbenv'を見にいって欲しいのだが。 @fumihumi:which ruby /Users/fumihumi/.rbenv/shims/ruby

色々調べてみると ’~/bash_profile’がおかしい。というパターンでのエラーが多いらしい。 そりゃ

if [ -f ~/.bashrc ] ; then
    . ~/.bashrc
    fi
# rbenv
export PATH="$HOME/.rbenv/bin:$PATH"
eval "$(rbenv init -)"

と書いているからこれが読めれば動くよね。。という話。

まず確認したいことはコマンドで

eval "$(rbenv init -)"

として動くのか否か 基本的に環境が問題なければ

  $which ruby
      /usr/local/bin/ruby
  $eval "$(rbenv init -)"  
  $which ruby
      /Users/fumihumi/.rbenv/shims/ruby

このようにevalコマンドの後にPATHが変わります。

実際に私も変わってました。

無知な私はここで最大の過ちを犯します。

エンジニア人生のおわり\

systemのrubyを使ってるなら 削除すれば良くね？ >>>>>>>>>>>>ダメです！！！１

$ brew list を見ているとインストールした記憶のない ruby がいる、殺す。

@fumihumi:brew remove  ruby
Error: Refusing to uninstall /usr/local/Cellar/ruby/2.5.0_2
because it is required by vim 8.0.1300, vim 8.0.1171, vim 8.0.1600, which are currently installed.
You can override this and force removal with:
  brew uninstall --ignore-dependencies ruby

なんか言われているけど消したいので。

brew uninstall --ignore-dependencies ruby

どーん！

と消す

消えたことを確認しよう。

brew list
/usr/local/bin/brew: line 79: /usr/bin/env: Argument list too long
/usr/local/bin/brew: line 79: /usr/bin/env: Undefined error: 0

a。？ あれ？？？ brew が使えない？

やばい。brewが使えないとどうにもできない。。

Homebrew(https://brew.sh/index_ja)を入れ直そう！。 しかし公式のインストーラでは。'/usr/bin/ruby'を見にいっている

/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

これは実行できません。 （さっき吹き飛ばしたからね！w）

ではどうするのか。

...... rbenv入ってたよな。。。。。

@fumihumi: eval "$(rbenv init -)"

@fumihumi:ruby -v
ruby 2.4.1p111 (2017-03-22 revision 58053) [x86_64-darwin16]

これでrubyコマンドは使える。 利用するRubyを変えればさっきのインストールがいけるはず。

@fumihumi:ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
==> This script will install:
/usr/local/bin/brew
/usr/local/share/doc/homebrew
/usr/local/share/man/man1/brew.1
/usr/local/share/zsh/site-functions/_brew
/usr/local/etc/bash_completion.d/brew
/usr/local/Homebrew
==> The following new directories will be created:
/usr/local/sbin

Press RETURN to continue or any other key to abort
==> /usr/bin/sudo /bin/mkdir -p /usr/local/sbin
Password:
==> /usr/bin/sudo /bin/chmod g+rwx /usr/local/sbin
==> /usr/bin/sudo /bin/chmod 755 /usr/local/share/zsh /usr/local/share/zsh/site-functions
==> /usr/bin/sudo /usr/sbin/chown fumihumi /usr/local/sbin
==> /usr/bin/sudo /usr/bin/chgrp admin /usr/local/sbin
==> /usr/bin/sudo /bin/mkdir -p /Library/Caches/Homebrew
==> /usr/bin/sudo /bin/chmod g+rwx /Library/Caches/Homebrew
==> /usr/bin/sudo /usr/sbin/chown fumihumi /Library/Caches/Homebrew
==> Downloading and installing Homebrew...
remote: Counting objects: 235, done.
remote: Compressing objects: 100% (60/60), done.
remote: Total 235 (delta 188), reused 210 (delta 174), pack-reused 0
Receiving objects: 100% (235/235), 44.01 KiB | 7.33 MiB/s, done.
Resolving deltas: 100% (188/188), completed with 117 local objects.
From https://github.com/Homebrew/brew
   0851f967..0f4e22e2  master     -> origin/master
HEAD is now at 0f4e22e2 Merge pull request #3981 from MikeMcQuaid/rspec-cleanup
/usr/local/bin/brew: line 79: /usr/bin/env: Argument list too long
/usr/local/bin/brew: line 79: /usr/bin/env: Undefined error: 0
Failed during: /usr/local/bin/brew update --force

あれ、うまくいってない？？？？？？

懲りずに何度かチャレンジするとうまくいきました。

めでたし。

その後。

brew が使えるようになったのですが。結局

which ruby

の結果は変わらず同じでした。 ひらすら'.bash_profile'を眺める。

結論

結論 ~/.bash_profileにPATHを改変する記述があった。

export PATH="/usr/local/bin:$PATH"

環境変数の変更コードはコピペが多いのですが、その際に持ってきたのでしょう。 この一行があるだけで rbenv init -が実行できていなかったようです。 コメントアウトしてやることで現状は打破しました。

似たような症状の人の助けになれば幸いです。

'You can't use Gon public methods for storing ~~'って怒られて悩んだ話。

railsにてcontrollerで用意した変数をjavascriptに直接渡すことができるようになる、gem gonを使っていて、表題のエラーに遭遇しました

'You can't use Gon public methods for storing ~~'

結果　

利用していた変数名が 予約語 だった。 変数名を変更したら解決しました。

git 備忘録

git 便利コマンド。

• git commit --allow-empty -m "empty comment" 空のコミットの作成。

• git diff --name-only 変更したファイルの名前だけ見る。たまに使う。

git のブランチを全部もらいたい時。

qiita.com

$ for remote in `git branch -r`; do git branch --track ${remote#origin/} $remote; done
$ git fetch --all
$ git pull --all

gitでなんかやらかしと時、自分のログをみたい。

git reflog

gitの操作の全てを表示してくれる。 例えば、git reset --hard head.等をした場合であっても、みれます。そう、reflogならね。

gitにはいろいろお世話になる人多いですが、reflogでお世話になる場合大抵はミスった人。それもだいぶ悲惨なミスをした人が知っているコマンドではw。と思っております。

※便利ですが、デフォルトの保持期間は90日らしい。。。w

git 作業の際に別のブランチでhotfixしたい・

• git stash ->git checkout / git merge / git add / git commit............etc

stashしたやつの確認。 - git stash list

stashを戻す際 - git stash pop

ちょっと別のブランチに行きたい時とかに便利。

git でmasterが更新されててマージする際にコンフリクト(した/しそう)な時

(master) git pull ### localのmasterを最新に更新する。 (develop) git rebase master ### masterの変更を受け取った開発ブランチとする。

もし、コンフリクトが起きたら。解消してcontinueする。 (develop) git rebase --continue
コンフリクトが起きまくってやる気が失せたら、 (develop) git rebase --abort

最新のrubyをインストールできない。。。。

環境

• macOS highSierra
• homebrew
  • rbenv でrubyを管理

背景。

昨年末にruby２.５がリリースされているので、それに伴いローカル環境2.5を試したかったのだが、

rbenv install -l としても

2.5.0-dev

という正式版じゃないものがヒットしていた。。。。。

対応

$brew upgrade ruby-build $brew upgrade rbenv

この二つをすることで、

rbenv install -l のなかに無事2.5.0の安定版がヒットしました。

2.5.0のインストール

$ rbenv install 2.5.0
$ rbenv versions
-> 入っているか確認
$ rbenv global 2.5.0
$ rbenv rehash 
$ rbenv versions 
-> 左側のアスタリスクが2.5.0の行にあればおk

$ ruby -v
とし、2.5.0が返却されれば成功！！！！！！！！

以上、rubyの最新版のインスコについてでした