夯名詞:新零售, 區塊鏈, 人工智慧有感

最近聽得多CI BI AI，這類高來高去的名詞，身為一位相對務實的開發人員，對於這些總是環繞在怎麼做到~做到了又如何應用的死循環中。

先有需求再建構/配合模型，自所擁有的管道(軟體服務)蒐集(CI)有用的RAW DATA，送入模型後得到BI(商業智慧)，進送入機器學習建構資源庫未來依此來判別(AI)，感覺上好像是在消滅自己工作一樣，一但有了AI那麼系統開發作業不就會被代勞嗎(=.= 真是想太多了，不過工程師有個好處，沒有理論支援下產出的工人智慧，對某些人來看也會被美化成人工智慧)。

AI在課堂中最早是從類神經網路的建構，透過訓練方式來歸納出許多的 pattern，這些在依照所配得權重以計算出最合適的結果，恩恩...這樣看來如何取代工作呢? 不過市場上所有產品都是需要包裝的，當軟體要搭上這股熱潮再不打算大改的情況下，只好再透過重新包裝來應付，但這些也是得燒掉多的腦細胞。

新零售也是如此，貌似"無人商店"也得沾上一點邊，亞馬遜所提的概念店面東改西湊(東施效顰的概念)，別人有的都加進來沒有的就是優勢? 不過所看的到的都是表象，技術這類的潘朵拉之盒卻得不到；在區塊鏈上因bitcoin而廣受討論，兩個相加起來就是如何去中間話在新零售上，生產->配銷->消費者的概念把中間的"經銷商"由軟體系統取代掉，讓消費者能快速取得新鮮品優的產品(當然能做到價廉就更不可思議了)，可現實真是能如此嗎? 大家都覺得經銷商賺得飽飽的(Ex. 專門剝削生產端宰殺消費者的菜蟲?)，但是許多事情都有他不為人知的專業在，各個環節所需承擔的風險成本往往是被忽視的，用軟體系統+AI來處理掉中間人學術討論上總是誘人的，回歸現實就傷腦筋囉...

拜讀21世紀資本論(超厚)比起看富爸爸窮爸爸系列來的有感，資本市場講求的看中的或許底蘊有那麼1%重要的，其他99%就不是腦袋硬梆梆只會硬幹的人能去求的，當創造話題的大老們衝在前頭，後頭收尾的工程師們...除了爆些新鮮個肝賺取微薄的OO之外，就只能幻想"有夢最美希望相隨"不是口號的一天，呵呵。

~~有段順口溜流傳許久，繼續做自我看著笑笑即可 ~~
東混西混，一帆風順；  苦幹實幹，撤職查辦；
盡職負責，卻遭指責；  任勞任怨，永難如願；
推拖栽贓，滿排勳章；  屢建奇功，打入冷宮；
不拍不吹，狗屎一堆；  全力以赴，升遷耽誤；
苦苦哀求，互踢皮球；  看緊國庫，馬上解僱；
會捧會現，傑出貢獻；  會鑽會溜，考績特優。

summernote 上傳檔案處理

summernote是個很輕量的編輯器，往常都使用CKEditor來提供服務，不過青菜蘿蔔各有所好...其中最常調整的莫過於檔案上傳處理，備忘一下囉...

HTML Header
include id_summernote.css & id_summernote.js
#語系要更換的話，得多include該文本 summernote-zh-TW.js

只需要將DIV放置在愈顯示處
HTML:
<div id="id_summernote" class="summernote"></div>

如果上傳檔案不特別處理的話，預設式以Base64編碼方式存放於編輯區中，這樣存入資料庫將會大大的增加儲存量，於未來存取時可能耗費更多伺服器資源。改成存放圖檔於伺服器中，這樣瀏覽上路由器/交換器/瀏覽器都可能暫存該圖檔資源，而減輕WEB SERVER吞吐頻寬負擔。

JavaScript
<script type="text/javascript">
jQuery(document).ready(function() {
      //載入
              initEditor();
});

  /* 編輯器初始化 */
  function initEditor() {
    $('.summernote').summernote({
        lang: 'zh-TW',       // default: 'en-US'
        toolbar: [
                ["style", ["style"]],
                ["font", ["bold", 'italic', "underline", "clear"]],
                ["fontname", ["fontname"]],
                ['fontsize', ['fontsize']],
    ["color", ["color"]],
                ["para", ["ul", "ol", "paragraph"]],
                ["table", ["table"]],
                ["insert", ["link", "picture", "video", "hr"]],
                ['height', ['height']],
                ["view", ["fullscreen", "codeview", "undo", "redo", "help"]]
            ],
        height: 200,         // set editor height             
        minHeight: null,    // set minimum height of editor
        maxHeight: null,    // set maximum height of editor
        focus: true,         // set focus to editable area after initializing summe
        tabsize: 2,
            dialogsInBody: true,
        callbacks: {
            onImageUpload: function (files) { //the onImageUpload API
                img = sendFile(files[0], $(this));
            }
        }
     
    });  
  }  
  function sendFile(file, editor) {
            data = new FormData();
            data.append("upload", file);         
            $.ajax({
                data: data,
                type: "POST",
                url: "<?=site_url('controler/function'); ?>",
                cache: false,
                contentType: false,
                processData: false,
                success: function (datas) {
                    var data = $.parseJSON(datas);
                    if (data.uploaded == '1')
                      // the insertImage API
                      editor.summernote('insertImage', data.url, 'image name');
                    else
                      console.log(data.error);
                },
error:function(data){
      console.log(data);
}
            });
      }

</script>

至於回傳的資料中，透過JSON編碼方式回傳，這樣有利於處理檔案儲存狀態的追蹤處理。

Nginx return 405 error

最近搬移伺服器，WEB伺服器也同步將Apache改成Nginx，客戶回報標籤列印軟體出現異常無法同步更新，Debug後看到回傳405錯誤，可該URL直接呼叫卻是能取得資料的，爬了些文看到解法...

於conf檔中新增error_page 405 =200 $request_uri;後重啟nginx排除掉問題。

location / {
        error_page 405 =200 $request_uri;
        try_files $uri $uri/ /petel/index.php;
 }

至於後來想想為什麼要用POST方式而不使用GET方式取呢? 往常POST請求也可以做到GET請求的回覆，所以從程式碼共用/使用的方向來想也挺合理的，只不過Apache沒出這種問題吧。

透過CKEditor或Summernote上傳iphone拍的圖片顯示被轉向問題

Bootstrap的RWD設計很方便，不過開發狀況上要考慮的點就挺多的，客戶反映說手機上圖時顯示是反的，但是圖下載下來是正的，乍聽之下挺神奇的不是事實卻是如此。

爬文得知在iphone手機拍攝照片時，會取決於拍照按鈕位置來存檔，所以在圖片的Orientation的狀態上就可能是旋轉的，不過在PC檢視上通常會自動轉回來可是瀏覽器就...參考網誌

另外因為手機的鏡頭跟效能越來越強，所以照片的解析度SIZE變超大，看起來是很舒服不過在WEB應用上就挺占頻寬的，簡單的壓縮功能就一併去實現囉。

//圖檔壓縮與旋轉
function image_resize($targetFile){
if (file_exists($targetFile)){
$img_array = getimagesize($targetFile);
$isResize = false;
$ratio = 512;
if ($img_array[0] > $ratio){
$config['width'] = $ratio;
$height = $img_array[1] / ($img_array[0] / $ratio);
$config['height'] = intval($height);
$isResize = true;
} else if ($img_array[1] > $ratio){
$config['height'] = $ratio;
$width = $img_array[0] / ($img_array[1] / $ratio);
$config['width'] = intval($width);
$isResize = true;
}
if ($isResize){
$this->load->library('image_lib');
$config['image_library'] = 'gd2';
$config['source_image'] = $targetFile;
$config['maintain_ratio'] = TRUE;

//because iphone photo maybe save rotation by sensor
$exif = @exif_read_data($targetFile);
if(!empty($exif['Orientation'])) {
switch($exif['Orientation']) {
  case 8:
   $config['rotation_angle'] = '90';
   break;
  case 3:
   $config['rotation_angle'] = '180';
   break;
  case 6:
   $config['rotation_angle'] = '270';
   break;
}
$this->image_lib->initialize($config);
$this->image_lib->rotate();
}
$config['rotation_angle'] = '0';
$this->image_lib->initialize($config);
$this->image_lib->resize();
}

return true;
} else {
return false;
}

}

啟用 OCSP 加快Apache速度

最近做壓測結果瓶頸點首先出現在SSL上面，想說透過HAProxy來處理443 frontend to 80 backend，不過測試上還需要些時間(也不確定穩定與否)，爬到這篇文章參考網誌貌似能改善些，留存備忘嚕...

1. 檢查你的 OCSP 是否有開啟，在下列網站輸入網址查詢 https://www.digicert.com/help/

2. 啟用 OCSP on Apache Server，httpd.conf新增設定，然後重啟服務。

OCSP httpd.conf

<IfModule ssl_module>
    SSLUseStapling on
    SSLStaplingResponderTimeout 5
    SSLStaplingReturnResponderErrors off                                                                                 
    SSLStaplingCache shmcb:/var/httpd/stapling_cache(128000)
</IfModule>