RedHat / CentOS 系列小差異說明

特別先提醒一下,和 RedHat / CentOS 系列的 Apache 管理不大一樣,在 RedHat / CentOS 平台中要啟用特定的模組,只要安裝好對應的模組套件,再重新啟用 httpd 服務即可。

但是在 Ubuntu Server 中,除了要安裝對應的模組套件外,要額外使用 a2emod 指令來指用模組,並重新啟用 Apache 服務才可啟用,不然會發生明明就裝了模組但是一定沒有啟用對應功能的情況,這部份後續會再介紹其使用方式。

安裝指令說明

  • sudo(substitute user [或 superuser] do),是一種程式,用於類Unix作業系統允許使用者透過安全的方式使用特殊的權限執行程式 (通常為系統的超級使用者)。
  • add-apt-repository 將 PPA 添加到您的來源列表中,以便 Ubuntu 知道從該 PPA 以及官方 Ubuntu 源中查找更新。
  • apt-get update 告訴 apt-get 去更新其資料庫,安裝哪些 package 以及從哪裡安裝它。
  • apt-get install 讓 apt-get 去資料庫中找到 package 並下載並安裝指定的文件。

安裝網路工具

$ sudo apt install net-tools

安裝 Apache 伺服器

// 安裝 Apache 與工具
$ sudo apt -y install apache2 apache2-utils

// 檢查 apache 運行狀況
$ sudo service apache2 status

// 利用 netstat 指令確認服務是否有啟動(有發現 80 port 運作中,但是 443 預設沒有啟用)。
$ netstat -tlnp

// 也利用 systemctl 指令查看一下相關服務的啟用情況。
$ sudo systemctl status apache2

啟用 SSL 模組

先啟用 Apache ssl 模組,並 restart  apache2 服務。

$ sudo a2enmod ssl
$ sudo systemctl restart apache2

此時一樣用 netstat 指令查一下,會發現有 443 port 已啟用。但是直接連結網頁會失敗。

// 調整 SSL 網站設定檔
$ sudo a2ensite default-ssl.conf
$ sudo systemctl reload apache2 

Apache 設定檔位置

// 一般設定檔
/etc/apache2/apache2.conf

// SSL 設定檔
/etc/apache2/sites-available/default-ssl.conf

這樣子就完第了 apache server 的初步安裝作業了~

繼續閱讀

文章標籤

MIS 發表在 痞客邦 留言(0) 人氣()

 

在作SA需求訪談時,常需與需求者對於操作畫面的確認,在此提供兩款不錯的可視化表單設計。它是以 Vue & Element UI 作為基本元件,可以快速與需求者當面討論,是不錯的方式。

Form Making 線上展示

form-making

 

Form Generator 線上展示

form-generator

 

文章標籤

MIS 發表在 痞客邦 留言(0) 人氣()

  • 安裝 vue-i18n

繼  在 Node JS 使用 vue-cli 3 快速開發網頁與佈署到 github-pages 後,接下來要實作 i18n 多國語系網站,npm 安裝的方式,指令是 npm install vue-i18n ,在 Vue i18n 官方文件中有提供 Vue-cli 3 專用的 vue add i18n指令

PS nodejs\vue2-apps> vue add i18n
 
� Installing vue-cli-plugin-i18n...
 
+ vue-cli-plugin-i18n@1.0.1
added 17 packages from 15 contributors and audited 1631 packages in 80.325s
 
55 packages are looking for funding
run `npm fund` for details
 
✔ Successfully installed plugin: vue-cli-plugin-i18n
 
? The locale of project localization. en
? The fallback locale of project localization. en
? The directory where store localization messages of project. It's stored under `src` directory. locales
? Enable locale messages in Single file components ? No

安裝完後,由下圖可以知道 vue add i18n指令幫我們作了很多事,實在太方便了

vue-i18n

 

繼續閱讀

文章標籤

MIS 發表在 痞客邦 留言(0) 人氣()

Jenkins 自動部署 Spring Boot 並自動起動

 

當程式存放在 程式版本控制 on GitHub or Gitee or Bitbucket or GitLab 有版本更新時,使用 Jenkins 可以減少人為手工的錯誤,並讓它自動部署及自動起動。這篇文章將 Jenkins 建置在 windows 10 作為說明。

 

  • 下載安裝檔

我們可以到以下連結下載適合的 OS 環境版本安裝,我們選擇熟悉的Windows環境。細部安裝步驟可以參考: Jenkins Master Server安裝

  1.  Jenkins  https://jenkins.io/download/
  2. Java – OpenJDKhttps://developers.redhat.com/products/openjdk/download
  3. Git Tool – https://git-scm.com/download/win
  4. Gradle Tool   gradle-6.5

 

安裝 Jenkins 完後在幾分鐘後重新整理網頁,就過出現以下內容,我們可以依照指示在指定目錄找到初始管理員密碼,取得密碼後在下面輸入,接著按下Continue按鈕。

jenkins-pwd

 

  • 基本的配置設定

管理 Jenkins ->組態設定 : 設定遠端連到系統的網址,以及系統管理員的 email

jenkins-configuration

管理 Jenkins -> Global Tool Configuration : 將 JDKGitGradle 的路徑設好

jenkins-configureTools

  • 設定登入 GitLab 的憑證

Jenkins -> Credentials -> System -> Global credentials (unrestricted)

jenkins-credentials-gitlib

若不知怎麼設定  Personal Access Tokens ,可以參考: 程式版本控制 on GitHub or Gitee or Bitbucket or GitLab

 

繼續閱讀

文章標籤

MIS 發表在 痞客邦 留言(0) 人氣()

 jquery 與 axios 對於 spring boot 的 ajax 請求處理 裡談到現行的網頁操作使用 ajax 技術來節省頻寛,若想與 Vue.js 結合,則不妨使用Axios。而在使用  ajax 技術常會遇到一件事是  session timeout,後端主機會反饋一個 Status Code: 302,且 post url 轉指向 login。這時操作畫面沒有變化,但已經無法與後端主機取得資料。

StatusCode-302

 

要解決這個問題需要前端 HTML 的 java script 與後端主機 spring boot 的 Interceptor 作著手。

首先,前端 ( Front-End ) HTML 裡的 java script 對 axios 送出前加入 "X-REQUEST-TYPE":"axios",以及收到後端主機 spring boot 的 Interceptor 的 401 錯誤作導向登入畫面。

繼續閱讀:

spring boot 對於 axios 執行 ajax 遇到 response.status:302 的處理方式

MIS 發表在 痞客邦 留言(0) 人氣()

Spring Boot 透過 Gmail SMTP 寄信

 

 WordPress Useful Plugin – 使用 WP Mail SMTP 透過 GMail 來寄信 是讓 WordPress 可以透過 Goole API 的方式來寄信,而在 Spring Boot 中也可以透過客製程式來達成這功能。

 

  • 在 build.gradle 加入 dependencies: spring-boot-starter-mail
  1. compile("org.springframework.boot:spring-boot-starter-mail") // Mail

 

  • 在 application.properties 加入連結到 Gmail 的參數
  1. # =================================
  2. # Mail
  3. # =================================
  4. spring.mail.default-encoding=UTF-8
  5. # Gmail SMTP
  6. spring.mail.host=smtp.gmail.com
  7. # TLS , port 587
  8. spring.mail.port=587
  9. spring.mail.username=my.account@gmail.com
  10. spring.mail.password=my.password
  11.  
  12. # Other properties
  13. spring.mail.properties.mail.smtp.auth=true
  14. spring.mail.properties.mail.smtp.starttls.enable=true
  15. spring.mail.properties.mail.smtp.starttls.required=true

在 application.properties 這些的參數設定,也可以透過下方的程式碼來達成。

  1. @Configuration
  2. public class MailConfig {
  3.  
  4. @Bean
  5. public JavaMailSender getJavaMailSender() {
  6. JavaMailSenderImpl mailSender = new JavaMailSenderImpl();
  7. mailSender.setHost("smtp.gmail.com");
  8. mailSender.setPort(587);
  9.  
  10. mailSender.setUsername("my.gmail@gmail.com");
  11. mailSender.setPassword("my.password");
  12.  
  13. Properties props = mailSender.getJavaMailProperties();
  14. props.put("mail.transport.protocol", "smtp");
  15. props.put("mail.smtp.auth", "true");
  16. props.put("mail.smtp.starttls.enable", "true");
  17. props.put("mail.smtp.starttls.required", "true");
  18. props.put("mail.debug", "true");
  19.  
  20. return mailSender;
  21. }
  22.  
  23. }

 

繼續閱讀:  Spring Boot 透過 Gmail SMTP 寄信

文章標籤

MIS 發表在 痞客邦 留言(0) 人氣()

Spring Boot 支援多語系(國際化)的網頁顯示,這在國際化的軟體或公司是必需具備的,要達成這個功能只需要簡單的幾個步驟即可以達到。在 Spring Boot 在 Eclipse 的安裝與設定 最後中,有建議安裝 ResourceBundle Editor 的插件,在此也會用到,不妨先安裝於 Eclipse 中。

  • LocaleResolver

為了讓應用程式能夠確定當前正在使用的語言環境,需要在 class: WebMvcConfig 中添加一個 @Bean(name = "localeResolver") ,記得要設定 name = "localeResolver",不然會出現HTTP Status 500 – Internal Server Error 的錯誤訊息。

  1. /**
  2. * 多語系設定
  3. * @return
  4. */
  5. @Bean(name = "localeResolver")
  6. public LocaleResolver getLocaleResolver() {
  7. CookieLocaleResolver cookieLocaleResolver= new CookieLocaleResolver();
  8. cookieLocaleResolver.setCookieHttpOnly(true);
  9. cookieLocaleResolver.setDefaultLocale(Locale.US);
  10. cookieLocaleResolver.setCookieName("appsLocaleCookie");
  11. cookieLocaleResolver.setCookieMaxAge(60*60);
  12. return cookieLocaleResolver;
  13. }

這裡是使用 CookieLocaleResolver ,所以會在用戶端的電腦建立一個 Cookie 的檔案來存放 appsLocaleCookie 的值,若不想要這麼作,那可以用 SessionLocaleResolver ,如下:

  1. @Bean(name = "localeResolver")
  2. public LocaleResolver localeResolver() {
  3. SessionLocaleResolver slr = new SessionLocaleResolver();
  4. slr.setDefaultLocale(Locale.US);
  5. return slr;
  6. }

 

繼續閱讀:  Spring Boot 多語系設置(國際化)

文章標籤

MIS 發表在 痞客邦 留言(0) 人氣()

在參考  Spring Boot 在 Eclipse 的安裝與設定 後,我們於文章中 使用 Eclipse 快速建立 Spring Starter Project 建立了一個網站,並且利用 程式版本控制 on GitHub or Gitee or Bitbucket or GitLab 將專案上傳到了 GitLab ,如何回到了家或是在另一台電腦工作環境時,Eclipse 如何將這個專案導入進來呢? 其實它很簡單,依照下面的步驟就可以了。

切換到 git 的 Perspective ,選擇 Clone a Git Repository and add this clone to this view ,輸入在 GitLab 專案的 HTTPS 網址,以及帳號/密碼。若對於帳號/密碼不知是什麼的,請參考 程式版本控制 on GitHub or Gitee or Bitbucket or GitLab 

eclipse-git-clone

 

選擇要匯入進來的 Branch ,因為目前只有一個 master ,所以只能選擇它囉。

eclipse-git-clone

 

選擇要放這個專案的本機目錄,以本例是放在 v:\git\gitlab\apps

eclipse-git-clone

 

將這個專案,匯入到 Eclipse 裡

eclipse-git-clone

 

選擇專案匯入的來源,就是剛剛 git clone 到本機的目錄  v:\git\gitlab\apps

eclipse-git-clone

 

最後不要忘記將這個專案加入 Gradle ,這樣就完成了,執行看看這個專案吧,應該是可以運作正常的。

eclipse-git-clone

MIS 發表在 痞客邦 留言(0) 人氣()

 WordPress 實用外掛推薦 有提到 WP Mail SMTP by WPForms & Post SMTP Mailer/Email Log 都是 WordPress 的寄信外掛程式,它可以讓 WordPress 透過本機或外部的郵件主機來寄發信件。

  1. WP Mail SMTP by WPForms 功能說明
  2. WP Mail SMTP by WPForms 透過 Goole API 方式寄信的設定
  3. 建立 Google Cloud IAM 專案
  4. 建立 Google API 憑證
  5. 電子郵件測試驗證

 

  • WP Mail SMTP by WPForms 功能說明

WP Mail SMTP by WPForms 它不使用預設的 mail() 函式,而是重新設定 wp_mail() 函式,它在 設定->一般 畫面,可以點選 Gmail/Mailgun/SendGrid/SMTP 等其中一種郵件程式,經過相關設定就可以寄信了。

WP Mail SMTP plugin includes many different SMTP setup options:

  1. Sendinblue SMTP (Recommended)
  2. Mailgun SMTP
  3. SendGrid SMTP
  4. Gmail SMTP
  5. Microsoft SMTP (Outlook.com and Office 365) [Pro]
  6. Amazon SES SMTP [Pro]
  7. All Other SMTP

繼續閱讀: WordPress Useful Plugin – 使用 WP Mail SMTP 透過 GMail 來寄信

MIS 發表在 痞客邦 留言(0) 人氣()

WordPress 若要搬到新的主機要注意的事項,記錄如下:

用手動來搬家比較安全,因為這才知道你自已在作什麼,主要有下列幾個步驟:

  1. Upload your website to new host
  2. Export/Import Your WordPress Database
  3. Modify two records: siteurl & home on table: wp_options
  4. Modify wp-config.php File
  5. Change all the URL of guid & post content in the posts

 

  • Upload your website to new host

先找到安裝 WordPress 的根目錄

wordpress-root

然後將 WordPress 安裝目錄下的所有檔案如下圖,整個上傳到新網站的根目錄下。(可以使用 FileZilla 來上傳)

wordpress-ftp-to-new-url

繼續閱讀: WordPress 搬家 網站搬移到網址

文章標籤

MIS 發表在 痞客邦 留言(0) 人氣()