# PHP - Geoip 設定 隨手紀錄 之前有依照 php.net 中的文章設定
http://php.net/manual/en/book.geoip.php#117240
但在某次 php 升版後有點問題
所以放棄該用法
改採用 GeoIP2-php 這套件來處理
這是一個 MAXMIND 的服務出的套件, 也有其他程式語言的套件
其實 php.net 那方法是 MAXMIND 舊的方法, geoip2 是他們現在新的用法與服務
這服務有做 GeoIP 和 欺詐檢測 的服務
具體欺詐檢測有做啥我就沒研究了
官網
過程我就不詳細介紹了
因為文件都有
這邊會介紹一些要注意的地方
主要是用 composer 安裝
然後用 autoload 載入
這流程應該 php 開發者會比較清楚, 反正也有 step by step 的教學與 sample code 可以看
<?php require_once 'vendor/autoload.php'; use GeoIp2\Database\Reader; // This creates the Reader object, which should be reused across // lookups.
...
# php - loop directory Sometime need use php loop directory list all file in this directory
$directory = scandir('./js'); foreach($directory as $file) { if ($file === '.' || $file === '..') { continue; } echo $file; echo "\n"; }
...
# php - 比對時間 記錄一下比對時間的方式(利用 timestamp)
time() > strtotime('2017-11-13 23:59:59');
...
# web - mobile web on iPhone X first preview ## Intro On 2017 9/12.
Apple published iPhone X.
And this device has so special screen.
So many web & iOS developer worry about some case like.
(form Apple)
OMG!
It can effect app show on full screen.
So Apple has provide guideline about iPhone X.
iPhone X - Overview - iOS Human Interface Guidelines
It is great change for web & iOS developer.
...
# ubuntu - apt-get install php repository 403 Error: W: Failed to fetch http://ppa.launchpad.net/ondrej/php5-5.6/ubuntu/dists/trusty/main/binary-amd64/Packages 404 Not Found // or Error: W: Failed to fetch http://ppa.launchpad.net/ondrej/php5-5.6/ubuntu/dists/trusty/main/binary-amd64/Packages 403 forbidden Try this
sudo rm /etc/apt/sources.list.d/ondrej-php5-5_6-trusty.list sudo add-apt-repository -y ppa:ondrej/php sudo apt-get -y update
...
# HTML - dns-prefetch, preconnect, prefetch, prerender 研究筆記 ## Intro 這幾個 meta 屬性早在幾年前就有不少外國文章和少部分的國內大神介紹過了
但當時我一直抱持這它還在 W3C 草案, 所以不急著用的心態, 且瀏覽器支持不高, 所以一直無視它…
直到最近不知怎麼地想說來繼續增加我們服務的 head 中的 HTML tag 的數量吧 XD
就來研究一下這些屬性
## dns-prefetch 預先解析 DNS, 簡單說一句就是把你的網站會用到的 domain 都塞上去
但我有點質疑實用性就是了, 因為通常會用到的 domain 都幾乎在該頁面用到了, 幾乎功效不大
因為在 head 預讀時有可能還沒解析完, 實際頁面已經需要對該 domain 發 request 了…
結論: 會改善但感覺改善幅度不大, 且你的服務內有用到多個 domain 或 subdomain 才有影響
## preconnect 會對設定的 domain 做 DNS 解析與 handshake
不過我覺得最大的好處是預先對該 domain 做 handshake
但就像上述所說大部分的情況是會用到的 domain 幾乎都在頁面上了
...
# Node.js - 簡單起一個 local server 進行測試 # 緣由 如果要臨時起一個 local 的 server 測試前端可以考慮用 Node 的一個套件 http-server 來做
為啥有這需求呢?
可能的情境如下
原本的 localhost(127.0.0.1) 被其他服務佔用時, 且無法依附在該 localhost 底下時
當要測試的前端程式需要是有第三方 API 驗證 domain 時且在上述情境時可以用(大部分的第三方 API 或 oauth 通常允許可以設置 localhost)
PS. 假設無法設定 localhost(得設定一個真實的 domain) 也可設定 host 解決這問題(但 host 是不吃 port 的所以在第一點的情況下這方案是無法成立的
# 其他建議 其實還有其他我覺得不太好的方式
例如
在本地的的 Apache or Nginx 設定 RewriteRule or Path or Proxy
用最方便的 file 方式打開(但如果有用到第三方服務需要 domain 驗證的就 GG 了)
# 使用方式 這裡只提供簡單的用法
...
# Intro Provide some key point & something we need notice
## 1. meta In normal page
<link rel="amphtml" href="https://www.example.com/url/to/amp/document.html"> In AMP page
<link rel="canonical" href="https://www.example.com/url/to/full/document.html"> ## 2. Default style(Handle render) <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript> Format
<style amp-boilerplate> body { -webkit-animation: -amp-start 8s steps(1, end) 0s 1 normal both; -moz-animation: -amp-start 8s steps(1, end) 0s 1 normal both; -ms-animation: -amp-start 8s steps(1, end) 0s 1 normal both; animation: -amp-start 8s steps(1, end) 0s 1 normal both } @-webkit-keyframes -amp-start { from { visibility: hidden } to { visibility: visible } } @-moz-keyframes -amp-start { from { visibility: hidden } to { visibility: visible } } @-ms-keyframes -amp-start { from { visibility: hidden } to { visibility: visible } } @-o-keyframes -amp-start { from { visibility: hidden } to { visibility: visible } } @keyframes -amp-start { from { visibility: hidden } to { visibility: visible } } </style> <noscript> <style amp-boilerplate> body { -webkit-animation: none; -moz-animation: none; -ms-animation: none; animation: none } </style> </noscript> ## 3.
...
# web call native app ## 緣由 因為一些原因要 mobile web 可以 call native 的一些東西來分享當前頁面或幹啥事(其實最常用的是聯絡資訊點了直接 call native app)
眾所皆知 HTML5 預設有
mailto: tel: sms: 但每個都要個別寫入好麻煩 且 sms 還有 iOS 和 Android 格式不一樣的問題 於是失心瘋的寫了一個 object 整合一下
有空再寫 PHP 版 (但是需求好像偏向會從 PHP 出誒)
我前端工程師當然先寫 js 版 突然覺得 isomorphic 好好喔…
## GitHub webClientProtocol
## 題外話 關於 web share content 這件事 Google 有正在搞一個 web share api 可以針對你想分享的東西去做到複製到剪貼簿或把內容分享給可以使用的 mobile native app 但是還在測試狀態… 相關文章在底下
Introducing the Web Share API
...
# CSS - content property use special char If you want use special char like © in CSS content property
You must use ASCII and show on HEX
And it is ©
So CSS need
div;before { content: "\00A9"; } Entity Conversion Calculator
This page can help us trans to hex
Refer - CSS Content | CSS-Tricks
...