育心文具行

作者: Jerry Lin

  • Mac 使用 Homebrew 安裝 php 7.3

    有時會需要更改 Mac 內建的 PHP 版本或是新增一個 PHP 來使用，這時候會需要使用 Homebrew 來安裝：

    Homebrew
    The Missing Package Manager for macOS (or Linux).
    /bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"

    安裝好 Homebrew 之後，安裝 php 7.3 會發現已經不支援了，參考 stackoverflow 會得知需要用別的來源：

    brew tap shivammathur/php
    brew install shivammathur/php/[email protected]

    注意 tap 動作只需要成功執行一次就行。

    安裝時可能會遇到的注意事項：

      1. Xcode 會提示需要更新（如果都沒更新的話），只需要按照提示更新即可。
      2. 會得到 php 的位置資訊，例如我安裝以後得到的位置就是 
        /usr/local/opt/[email protected]/bin/php
      3. 要確認 install 之後有沒有正確 link ，我需要兩個版本，原版本是 8.1.14 所以並不會正確執行，也沒有必要執行。參考這裡，另外建議檢查一下 ~/.bash_profile 之中有沒有指定 PATH。

    2023-10-23 update:

    現在 PHP 已經更新到 8.2 啦，上述 brew 的方式依然可以更新，安裝時更換版本號碼即可。安裝成功後檢查 ~/.bash_profile 的 PATH 更新為新版本，之後刷新指令 source ~/.bash_profile 就行的。

  • HTTrack Website Copier 砍站工具在 MacOS 上實現

    HTTrack 是一個砍站軟體，他在 windows 上有 GUI 介面，不過在 Mac 上只有 command line 介面，也不難處理，對於下載網頁的靜態資源還是不錯用的。

    安裝和執行方法參考：

    [MAC] HTTrack Website Copier砍站軟體!移植到MAC的安裝與使用教學
    說到砍站軟體，大家第一印象不外乎就是HTTrackWebsiteCopier，說到這套砍站軟體，算是最老牌同時也是最簡易好上手的砍站軟體，說到這一個…

    滿詳盡的，這邊就不贅述。

    要注意的重點：

    1. 使用 Homebrew 安裝，在教學網頁中第一步驟為安裝 Homebrew 過程。 Homebrew 官網參考請點這裡。
    2. 有需要其他安裝版本的話可以參考官網下載（這塊沒特別試過，請小心服用）。
    3. 雖然是廢話，不過還是要提醒一下，砍站軟體並不能完整複製網頁/網站，並非砍下來直接打開看就是一模一樣的。
  • PHP 源碼掃描實作，使用 SonarQube

    PHP 源碼掃描實作，使用 SonarQube

    PHP 的原始碼弱點掃描實作，這邊使用 SonarQube 的社區版，這邊實作是參考這個連結，使用 MacOS 實現。

    首先先提供相關資源網站：

    SonerQube 官網和下載網址：

    Download | SonarQube
    Get the latest LTS and version of SonarQube the leading product for Code Quality and Security from the official download page.

    SonerQube 的套件 sonarscanner 安裝文件：

    SonarScanner | SonarQube Docs

    JDK 官網下載：

    www.oracle.com

    JDK 安裝教學：

    MAC中安裝JDK、Maven
    一、安裝JDK 1、開啟JDK官網，選擇對應版本，並選擇maxOS系統，此處以Java 8為例。 …

    下載 SonarQube 社區版解壓縮後，在 command line 中找到執行的指令，像是 MacOS 是在資料夾/bin/macosx-universal-64/ 裡面。進入資料夾中輸入：

    ./sonar.sh console

    即可在瀏覽器 http://localhost:9000/ 中開啟網頁。預設帳號密碼 admin/admin 登入後更換密碼。

    以下重點整理：

    1. 新增專案，選擇語言等操作完成後，會產生一組程式碼，該組程式碼是提供進入要掃描的資料夾根目錄中使用的。
    2. 在掃描之前，系統會提示需要安裝 SonarScanner ，請選擇 MacOS 版本，推薦加入 bash 中方便運作，參考這裡。
    3. 需要先安裝 JDK ，無法在 root 環境使用。
    4. 掃描後看結果可能心情會不太好，不過系統提到的都滿有道理的，建議改一下。

  • 你知道可以移動 Mac 上方選單列圖示嗎？

    自己是 Mac 愛用者，目前在用的 MacBook Pro  已經邁入第 N 個年頭了。有時開啟應用程式的選項真的太多了，導致 Mac 上方選單列版面變的超擠，而且選項很容易和選單列圖示衝突變的看不到。

    後來發現除了切換應用程式或是回到桌面，讓選單列全部露出之外，還可以在選單列上，按住 Command 按鍵不放，滑鼠移動到圖示上就可以點擊拖曳改變位置啦！

    可以把越常用的拖曳到越右邊，這樣就比較不容易被應用程式的選項檔到。

     

  • WordPress 個古老故事 – jQuery 使用

    WordPress 開發時會發現，使用前端的 jQuery 不能用錢字符號（$），這是一個稱之為兼容模式的東西，會比較安全，但是也會發現說如果一直打 “jQuery” 這串字打久了真的會很累。整個前端文件也會落落長。

    Avoiding Conflicts with Other Libraries | jQuery Learning Center

    幾個方法：

    (function($) {
console.log($('#隨便一個 ID').length);
})( jQuery );

    或是：

    jQuery(document).ready(function( $ ) {
	console.log($('#隨便一個 ID').length);
});

  • 一些常用的工具網站分享

    常用很多工具，每次都要 Google ，雖然關鍵字已經記起來的，不過還是列一個列表比較心安（？

    1. Python 線上測試，這是 2.7 版的，可以自行切換版本。這個網站還有很多程式語言線上測試的工具，可以參考選用。
      Online Python Compiler – Online Python Editor – Online Python IDE – Python Coding Online – Practice …
    2. JSON 解析。很多 JSON 資料需要解析成能看的格式。
      Json Parser Online
      Analyze your JSON string as you type with an online Javascript parser, featuring tree view and syntax highlighting. Processing is done locally: no data send to server.
    3. JSON 編輯器。製作 API 文件需要。
      JSON Editor Online – view, edit and format JSON online
      JSON Editor Online is a web-based tool to view, edit, format, transform, and diff JSON documents.
    4. MD5 產生器。這網站中也有提供許多編碼或是加解密的工具。
      MD5 轉換 – 將字串轉換為MD5 – ez2o Studio
      利用線上將字串轉換為MD5，不需要再另外寫程式處理。

      另外有時會需要有更安全的 MD5 hash ，可以用這個 Chrome 套件：
      MD5 Hasher
      Chrome extension to generate MD5 hashes
    5. 動態指定尺寸產生圖片。這是說明文件，可以透過底下說明文件的 API 取得指定尺寸的圖片，作為測試圖片使用。
      Dynamic image resizing
      Learn how to dynamically resize & adapt images to fit the page layout by changing URL parameters. No image processing server is required.
    6. Jerry 這裡。 這有些 email 測試，QR Code 掃描等工具，是自己做有用到的功能，不定期更新。社交登入以後可以使用網站排程檢查的功能。
      Dashboard | crazyjerry.studio
    7. Beautify CSS / HTML / JS 。 把壓縮過的 js / html / css 還原。
      Online JavaScript beautifier
    8.  JS / CSS 壓縮。因為比較不常用 html 壓縮，所以目前用到這個。
      Minify JS and CSS online, or include the minifier in your project for on-the-fly compression.
      Minify JS and CSS online, or include the minifier in your project for on-the-fly compression.

    以上，有想到用到再補充。

     

  • PHP 使用 PHP Code 的格式印出陣列

    使用 php 有時需要把程式碼印出來，提供動態的程式範例或是安裝的初始設定用途，雖然說大部分的應用場景只會使用到一次，但是資料量大的時候也是滿麻煩的。

    這邊提供一個範例將 array 印出來並且依照 php 格式作為 php file 儲存起來：

    $data = array('a'=>'b');
    file_put_contents('test.php', '<?php $arr = ' . var_export($data, true) . ';');

    參考：

    php – How can add in data of "file_put_contents" an array and a variable? – Stack Overflow

  • Line 開發自動圖文選單（Rich Menu）的小眉角

    Line 機器人開發中，有一個功能是添加不同的圖文選單。可以依據不同場景、不同用戶客製化內容：

    Using rich menus
    The LINE Developers site is a portal site for developers. It contains documents and tools that will help you use our various developer products. Creating LINE Login and Messaging API applications and …

    其中有一個 Set the default rich menu 的功能，他和 Link rich menu to user 會互動的不是很好，如果使用這兩支 API 來作為單一用戶的場景切換，很容易造成用戶需要離開當下對話視窗再重新進來才能生效。不如統一使用 Link rich menu to user  方法處理切換即可。

    參考：

    Using rich menus
    The LINE Developers site is a portal site for developers. It contains documents and tools that will help you use our various developer products. Creating LINE Login and Messaging API applications and …

  • 購物車串接第三方金流 session 會被清空的原因

    原因是出在 SameSite 的設定，請標明 cookie 中的 SameSite 屬性。

    參考：

    FAQ知識庫 | 綠界 ECPay 客服中心
    綠界金流程式串接常見技術問題。

    也請記得強制使用 https 。

    舉個例子：
    Set-Cookie: remote_session=abc123; SameSite=None; Secure

    關於 SameSite 的介紹可參考：

    SameSite | OWASP
    SameSite on the main website for The OWASP Foundation. OWASP is a nonprofit foundation that works to improve the security of software.

  • WordPress 核心架構圖/堆棧圖 相關檔案結構說明鏈結

    最近用 wordpress 處理一些 MVP 的實作，沒想到竟然要對他做技術文件，這邊先筆記一下避免以後有相同需求找不到來源。

    注意來源取自官網，有些可能是過時的資訊。

    Modules

    source: https://codex.wordpress.org/File:WP_27_modules.JPG

    Wordrpess Site Architecture

    Site Architecture 1.5 « WordPress Codex

    Code Reference | Functions, Hooks, Classes Methods

    Reference | WordPress Developer Resources
    Want to know what’s going on inside WordPress? Find out more information about its functions, classes, methods, and hooks.

    Database Description

    Database Description
    Srouce: https://codex.wordpress.org/Database_Description