Google Cloud的MySQL炸掉了 之 參數調整方法

搜尋了一下,還蠻多人有一樣的困擾的,MySQL突然就被衝到炸掉。
首先第一步,調閱MySQL log來看一下,發現記憶體調用失敗,於是把內部log打開:

[mysqld_safe]
log_error=/var/log/mysql/mysql_error.log

[mysqld]
log_error=/var/log/mysql/mysql_error.log

發現總是跑出

InnoDB: The InnoDB memory heap is disabled

如果沒開,他會直接吃主機記憶體,處理一下 /etc/mysql/my.cnf,加入這句:

innodb_use_sys_malloc =  0

重開後就出現訊息

InnoDB: Initializing buffer pool, size = 128.0M

是的,預設buffer pool為128MB,稍微爬文了一下發現是夠用的,以中型網站來說。
這個參數並不是越大越好,要看機器本身夠不夠用。

—-參考文獻—-
[1] Ubuntu 安裝和設定 MySQL – http://www.arthurtoday.com/2009/11/ubuntu-910-mysql.html
[2] mytop – MySQL 效能監測工具 – http://www.arthurtoday.com/2013/04/ubuntu-install-mytop.html
[3] Amazon EC2 免費實例: MySQL 崩潰之資料庫 log 查看及設定調教 – http://40era.com/4245/
[4] 15.14 InnoDB Startup Options and System Variables – http://dev.mysql.com/doc/refman/5.7/en/innodb-parameters.html
[5] How and When To Enable MySQL Logs – http://www.pontikis.net/blog/how-and-when-to-enable-mysql-logs
[6] How to Fix ERROR InnoDB: The InnoDB memory heap is disabled – https://www.debian-tutorials.com/how-to-fix-error-innodb-the-innodb-memory-heap-is-disabled

不透過Less更改Bootstrap3漢堡選單的breakpoint

這樣比較快XD

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
@media (max-width: 1200px) {
    .navbar-header {
        float: none;
    }
    .navbar-left,.navbar-right {
        float: none !important;
    }
    .navbar-toggle {
        display: block;
    }
    .navbar-collapse {
        border-top: 1px solid transparent;
        box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);
    }
    .navbar-fixed-top {
        top: 0;
        border-width: 0 0 1px;
    }
    .navbar-collapse.collapse {
        display: none!important;
    }
    .navbar-nav {
        float: none!important;
        margin-top: 7.5px;
    }
    .navbar-nav>li {
        float: none;
    }
    .navbar-nav>li>a {
        padding-top: 10px;
        padding-bottom: 10px;
    }
    .collapse.in{
        display:block !important;
    }
}

—-參考文獻—-
[1] Change bootstrap navbar collapse breakpoint without using LESS – http://stackoverflow.com/questions/19827605/change-bootstrap-navbar-collapse-breakpoint-without-using-less

快速針對 WordPress 的 wpdb 進行debug

直接貼入程式碼使用即可

<?php
// Print last SQL query string
echo 'Last Query : ' . $wpdb->last_query . '<br>';
// Print last SQL query result
echo 'Last Result : ';
var_dump( $wpdb->last_result );
// Print last SQL query error
echo 'Last Error : ' . $wpdb->last_error . '<br>';
?>

指定單一資料夾權限給WebFaction的新SSH使用者

因為客戶Host在WebFaction上,而我們的WebFaction也有其他客戶共用,所以不能讓他的FTP有太多權限,如果只在WebFaction的Panel上增加SSH使用者,他的權限可以大到能瀏覽整個Project List及裡面的檔案,為了隱私權我們只好透過SSH調整一下在主機上的使用者權限

我們假設新使用者名稱為 new_user_001

1. 透過Terminal連線到WebFaction,使用最高權限帳號

2. 先開放整個HOME給新使用者

setfacl -m u:new_user_001:--x $HOME

3. 移除webapps底下所有檔案的權限

setfacl -m u:new_user_001:--- $HOME/webapps/* 

**注意:這邊的語法僅適用目前Host已存在的專案,若日後有新增專案,這個指令要再做一次!
**或者也可以針對新專案更改權限設定:

setfacl -m u:new_user_001:--- $HOME/webapps/新專案名稱

4. 給予指定資料夾 讀取/寫入/執行 的權限

setfacl -R -m u:new_user_001:rwx $HOME/webapps/專案名稱

5. 給予指定資料夾在未來有新增檔案時的 讀取/寫入/執行 的權限

setfacl -R -m d:u:new_user_001:rwx $HOME/webapps/專案名稱

6. 為現在登入的最高權限者,給予指定資料夾 group owner 權限

chmod g+s $HOME/webapps/專案名稱

7. 為現在登入的最高權限者,給予指定資料夾所有權限

setfacl -R -m d:u:目前登入的最高權限使用者:rwx $HOME/webapps/專案名稱

———參考文獻———-
[1] General Topics (Granting Access to Specific Users) – https://docs.webfaction.com/software/general.html#granting-access-to-specific-users

[2] 第十三章、Linux 帳號管理與 ACL 權限設定 (13.3.1 什麼是 ACL 與如何支援啟動 ACL) – http://linux.vbird.org/linux_basic/0410accountmanager.php#acl_talk

透過 FileZilla 存取 Google Cloud Platform 主機

想從 FileZilla 存取 Google Cloud Platform 上的 instance,只需要 Generate SSH Key 即可!

進 Terminal,使用者帳號即可,此時不需切換本地端 root

Step 1. 安裝Google Cloud SDK

安裝

curl https://sdk.cloud.google.com | bash

全部預設位置即可

重開 Terminal

exec -l $SHELL

初始化Google Cloud SDK

gcloud init

輸入預設project ID(不是數字那個)
接下來他會要求你clone default project,不需要,除非你想在本地端config

Step 2. Generate SSH Key

注意這邊需要切換 Google Cloud Platform 上 instance 的 root!

$ gcloud compute ssh [email protected]

這樣產生的key才能full access directory

Step 3. 在 FileZilla 新增 SSH Key

Edit->Settings or FileZilla->Settings,找 SFTP 頁面
選 Add keyfile
然後,因為預設產生的key位置在.ssh,是隱藏檔,要手動導向隱藏頁面
command-shift-G,輸入~/.ssh
選擇非public key
然後自己新增站台,帳號輸入root,免密碼,大功告成!

——————————參考文獻——————————
[1] Transferring files to your hosting server on Compute Engine – https://cloud.google.com/compute/docs/tutorials/transfer-files

如何帥氣的使用Sublime Text 3

st3
這是我目前的開發環境XD

其實我剛開始進入前端領域時是相當不習慣的,第一次做網頁是用Dreamweaver,直接用編輯器寫網頁對我來說真的很困難,但是經過了四個月的時間,現在打開Dreamweaver反而不會用了。好吧,今天我來分享一下幾個讓自己寫程式時看起來比較帥的好東西。

1. Package Control

相關網址:https://packagecontrol.io/

為了讓Sublime Text可以用快速的方法裝上外掛,一定要把Package Control裝起來
(2016-09-25更新:從Sublime Text 3124開始,安裝後會有一鍵安裝Package Control的功能)

如果需要手動安裝,請參考安裝說明:
https://packagecontrol.io/installation

2. HTML-CSS-JS Prettify

相關網址:https://packagecontrol.io/packages/HTML-CSS-JS%20Prettify

這東西很好用,有時拿到別人亂糟糟的code或是自己不小心寫code沒在排版的,超方便的一鍵排版外掛就是這個拉!不管是html、css、js檔都可以幫你排的票漂亮亮喔!在安裝這個外掛前,電腦裡要先裝好Node.js,然後就直接用Package Control尋找外掛:

  • 在Sublime Text裡鍵入 Ctrl+Shift+P 或 Cmd+Shift+P 叫出Package Control
  • 輸入 install, 選擇 Package Control: Install Package
  • 輸入 prettify, 選擇 HTML-CSS-JS Prettify

3. Color Highlighter

相關網址:https://packagecontrol.io/packages/Color%20Highlighter

這個外掛可以直接在編輯器裡顯示出色碼對應的顏色,算是輔助型工具,我會搭配Sip來用。

4. 佈景主題相關

Material Theme

相關網址:https://packagecontrol.io/packages/Material%20Theme

這個是我今年使用的佈景主題,因為Seti UI壞掉惹所以才換,但是在Search模式時按鈕會怪怪的,只要下方區塊有彈出其他功能,按鈕有時會出現bug。

Theme – Brogrammer

相關網址:https://packagecontrol.io/packages/Theme%20-%20Brogrammer

這個是根據下載量推薦才裝的,感覺還可以,我裝只是以防Material的按鈕bug

Seti_UI

相關網址:https://packagecontrol.io/packages/Seti_UI

其實預設的Sublime Text佈景主題就還蠻耐看的了,但是這次介紹的Seti_UI可是連檔案圖示都很精美喔!
(2016-09-25更新:已經沒在用這主題了,但還是先留著)

  • 在Sublime Text裡鍵入 Ctrl+Shift+P 或 Cmd+Shift+P 叫出Package Control
  • 輸入 install, 選擇 Package Control: Install Package
  • 輸入 seti, 選擇 Seti_UI

安裝完成之後記得在個人設定那邊導入這個佈景主題:

選單 Preferences -> Settings – User

{
  "theme": "Seti.sublime-theme",
}

其實他還有一些layout設定可以調整,就自己去官網找範例囉!

解決WordPress改網址後圖片出不來的問題

最近在做網站時,都是在host以測試網址先架好wordpress,資料也都上架後才買網址然後更換,就會有很多文章的圖片無法正常顯示,因為主要網址已經換掉了,即使在wordpress後台設定改了網址,也只會影響到wordpress預設欄位的網址,很多theme的post meta不會自動更新網址,只好手動去phpMyAdmin敲一些SQL指令了:

在SQL指令那邊複製貼上以下文字(記得把網址換成自己的來源與目標網址)

1
2
3
4
UPDATE wp_options SET option_value = replace(option_value, 'http://舊網址', 'http://新網址') WHERE option_name = 'home' OR option_name = 'siteurl';
UPDATE wp_posts SET guid = replace(guid, 'http://舊網址','http://新網址');
UPDATE wp_posts SET post_content = replace(post_content, 'http://舊網址', 'http://新網址');
UPDATE wp_postmeta SET meta_value = replace(meta_value,'http://舊網址','http://新網址');

Chrome 新版的書籤管理員好難用 之 取消方法

Chrome 新版書籤

最近突然發現,Chrome加入書籤的方式改變了,原本滿懷期待的進入書籤管理員想一探究竟,沒想到是悲劇的開始…

以前習慣先把書籤全部塞到”其他書籤”裡,滿到一個程度之後才開始移動、分類,新版的書籤系統無法進入”其他書籤”資料夾,而且也沒有”尚未分類的書籤”這個選項,也就是說不管我分類了沒,一次只能顯示全部的書籤,不知道該怎麼管理…

這時腦中突然想到Google Labs這個單字,馬上在網址輸入以下指令:

chrome://flags/

Chrome Flags

搜尋關鍵字”bookmarks”,應該是第二個搜尋結果,把”啟用強化書籤”選成[已停用]

強化書籤

之後最下方會提醒使用者重啟瀏覽器,這奇怪的書籤管理員就暫時不會來煩你拉~

但是不知道哪一天他會變成強制的新功能就是了…也許花一點時間來適應他比較實際一點。