Skip to main content

2-1

AWS API Gateway (web socket)​

  • 瀏覽器端預設閒置 5 分鐘則關閉連線、AWS API Gateway Websocket 預設閒置 10 分鐘則關閉連線 (硬限制)。
  • AWS API Gateway Websocket 預設最久連線 2 小時 (硬限制)。
  • RouteKey 對應前端發送的資料內 action 的值，以此對應是哪個 RouteKey 的 lambda 執行。
  • 每個 client 連線時， event 內會有 connectionId，需將此記錄在資料庫或其他地方，待需要廣播給所有連線中的 client 時，以 connectionId 做為參數發送，disconnent 時需將 connectionId 從記錄中刪除。(關於 connectionId 的存取都要手動實作，詳情可參考官方的 simple chatroom 範例。)

<input> (number)​

  • safari 在 input type=number 無法限制只能輸入數字。
  • 一般 input type=number 時，- + . e E，這些數學符號也能輸入。

自訂 error 物件​

  • 因 new error 物件時不能帶其他自訂參數進去，故參照 stackoverflow 的解法創立自訂 error 物件。
// 自訂 error 物件
function CustomError(status, message) {
  this.name = 'CustomError'
  this.message = message || 'Default Message'
  this.response = { status }
  this.stack = (new Error()).stack
}
CustomError.prototype = Object.create(Error.prototype)
CustomError.prototype.constructor = CustomError
// use: throw new CustomError(408, 'some message')

手機版禁止雙擊元件放大​

body{
    touch-action: manipulation;
}

vue-morden-theme 問題​

$ ssh-keygen​

  • 此指令會隨機生成一組公私密鑰。

AWS Certificate Manager​

  • 若有用 AWS CloudFront 或 AWS Load Balancer 服務則可以使用 AWS Certificate Manager 免費申請 SSL 憑證並套用到該服務上面。
  • CloudFront 上設定 SSL 憑證時，只能使用建立在 us-east-1 (維吉尼亞州北部) 的 ACM 憑證。

GoDaddy 掛 SSL & ACM 申請​

  • 申請 ACM 驗證時可以選信箱或 DNS 認證，信箱認證需要該 Domain 有申請電子信箱才行。例：xxx@example.com
  • 選 DNS 認證會給 CNAME 名稱與值，並將 CNAME 新增至 GoDaddy 的後台。
  • GoDaddy DNS 設定無法設頂域，只能一個個設子域，因目前 Domain 只有用來掛部落格，故以 www 子域作為主要，並在上面設 DNS 認證的 CNAME，並設定轉址將頂域轉到 www 子域。(註1：GoDaddy 會預設 CNAME，像 www，所以要先刪掉或修改預設的才能設自己的 www。註2：可以將 GoDaddy 的 DNS 託管轉移至 AWS Route53，但 Route53 需收一點費用，不過 Route53 的 DNS 設定有比較多功能，也可設頂域)

Vue bundle 優化​

  • webpack-bundle-analyzer 套件可將打包後的 js 檔做分析並圖像化顯示。
  • 用 Vue CLI 建立的專案打包分析後發現會有重複很多 bn.js 的情況
  • npm ls bn.js (npm ls 套件名) 可檢查該專案內的套件被哪些相依
  • 查詢後發現 webpack 內的套件的多個套件相依 bn.js
  • 解法：webpack 設定 bn.js alias ，有使用 bn.js 的套件強制使用該 alias 設定，故皆用同個，不會再個別重複打包了。
chainWebpack: config => {
  config.resolve.alias.set('bn.js', path.resolve('node_modules', 'bn.js'))
}
  • 以往使用 aws-amplify 都是載整包，後來發現可以載要使用的套件就好：@aws-amplify/core (必要)、＠aws-amplify/api (按需使用).... 等等。
  • 上面兩項打包減少後，約節省 1/3，14.x MB → 10.x MB。

Docker 自訂參數​

  • 下 Docker build 指令時可以給 ARG 參數讓 docker 執行時可以使用 (使用在因應不同正式環境而需要下不同環境參數)：
$ docker build --build-arg NODE_VER=node-v5.9.0-linux-armv7l .
// Dockerfile
ARG NODE_VER // 宣告 ARG 的 NODE_VER 參數
ADD ./${NODE_VER:-node-v5.9.1-linux-armv7l} / // ${參數：預設值} (若參數無值則會用預設值)
RUN ln -s /${NODE_VER} /node
ENV PATH=/node/bin:$PATH
CMD ["node"]

<input> 本身自有預設寬度​

  • 可能是 chrome 的實作這樣或其他瀏覽器也會這樣。
  • 若沒有自行設 width 的話，會保持原本寬度並無法隨著 flex-shrink 縮放，解法是給個寬度就好。
Last updated on