分類: 网站

中文繁簡轉換工具用上 Bootstrap 後漂亮多了，使用 JavaScript 來請求表格減少了頁面的跳轉，用起來也比較方便。於是產生一個新需求就是想統計下「轉換」按鈕被點擊了多少次。關於自定義事件目標的具體介紹，可以參考 Plausible 的官方文檔Custom event goals，我這裏只是羅列下具體步驟。

前端 html 中的修改

確保 Plausible 配置有下面的第二行

<script async defer data-domain="<yourdomain.com>" src="https://plausible.yourdomain.com/js/plausible.js"></script>
<script>window.plausible = window.plausible || function() { (window.plausible.q = window.plausible.q || []).push(arguments) }</script>

在需要統計的地方執行這行 JavaScript

plausible('my_event');

Plausible 後臺的設置

打開 Plausible 後臺，在左上角的域名處選擇 Site Settings。在 Goals 區域點擊 + Add goal。然後 Goal trigger 選擇 Custom event，Event name 要輸入 JavaScritp 請求的參數，這裏就是「my_event」。最後點擊 Add goal 就完成了。

計算得出的中國城市飲用水中全氟辛烷磺酸（PFASs）的平均濃度（ng/L）

不同國家和美國各州發布的飲用水中 PFAS 準則

數據來源及完整論文請參閱：Per- and polyfluoroalkyl substances (PFASs) in Chinese drinking water: risk assessment and geographical distribution。Liu, L., Qu, Y., Huang, J. et al. Per- and polyfluoroalkyl substances (PFASs) in Chinese drinking water: risk assessment and geographical distribution. Environ Sci Eur 33, 6 (2021). https://doi.org/10.1186/s12302-020-00425-3

如何在 WordPress 中展示上面的數據圖表

這裏使用了開源的js插件 DataTables 來展示上面的圖表。安裝方法可以參考官方安裝文檔，非常簡單。考慮到文件裏推薦的 CDN 方法在中國可能水土不服，所以我使用本地的安裝方法。在下載頁面勾選需要的組件（我只選了必須的 css 和 js，由於 WordPress 已自帶 jquery，所以不用選jquery）然後下載到一個 zip 包。我是將其上傳到 WordPress 的 wp-content/uploads/share/js 目錄中，然後解壓並修改文件所有者爲nginx( chown nginx:nginx -R DataTables )，就可以使用了。文章裏用到的代碼如下：

<link rel="stylesheet" type="text/css" href="/wp-content/uploads/share/js/datatables.min.css"/>
<script type="text/javascript" src="/wp-content/uploads/share/js/datatables.min.js"></script>

<table id="table_id" class="display">
    <thead>
        <tr>
            <th>Column 1</th>
            <th>Column 2</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>Row 1 Data 1</td>
            <td>Row 1 Data 2</td>
        </tr>
        <tr>
            <td>Row 2 Data 1</td>
            <td>Row 2 Data 2</td>
        </tr>
    </tbody>
</table>

<script>
jQuery(document).ready(function($) {
    $('#table_id').DataTable();
} );
</script>

首先感謝 EU.org 提供的 free 二級域名，本站從即日起開始在新域名 https://ft.shaman.eu.org 下更新，原 https://ft.wupo.info 會在一 周 天後跳轉到本站。 https://emanon.wupo.info 由於停更，所以本次不會遷移到新域名，但是會在明年域名到期後下線。Emanon 有一個自然觀察的 Youtube 頻道，裡面都是些常見物種記錄。

本次遷移域名遇到的小問題

由於不是很緊迫，所以我是在同一個服務器上複製了一份數據庫，然後又複製了一份 wordpress 文件夾，最後再複製一份 nginx 的配置文件就搞定了。如果遇到 nginx 500 錯誤，記得檢查文件權限。需要在數據庫里操作的幾處我列一下：

#如果只是修改域名，則只需執行下面兩行
update options set option_value="https://ft.shaman.eu.org" where option_name="siteurl";
update options set option_value="https://ft.shaman.eu.org" where option_name="home";

#如果要修改用戶的電子郵箱
update users set user_email='[email protected]' where user_login='user1';
#如果要修改管理員的電子郵箱
update options set option_value='[email protected]' where option_name='admin_email';

還有一個問題是，配置 cloudflare 時出現循環 301 Moved Permanently 跳轉。原因是 cloudflare 默認的 SSL/TLS 設置是 Flexible，這種模式意味着用戶到 cloudflare 是 https，而 cloudflare 到我的服務器卻是 http。但是我的服務器也配置了如果是 http 就重定向到 https。於是就循環請求了。解決辦法是把 cloudflare的 SSL/TLS 設置為 Full (strict) 模式。

nginx 和 cloudflare 設置 301 跳轉都很簡單，這裡寫下用 cloudflare 設置跳轉的方法。在 Page Rule 中新建一條（免費用戶最多可以創建三條）Page Rule。URL matches 填「*ft.wupo.info/*」，接着的兩個下拉框分別選「Forwarding URL」和「301 - Permanent Redirect」，最後一個輸入框填「https://ft.shaman.eu.org/$2」。保存並啟用就可以了。

本文更新於 2020/11/04。

我的 WordPress 安裝了 Limit Login Attempts 插件，其中可以設置輸入錯誤密碼 m 次封鎖這個 IP n 小時，並記錄下這個 IP。本站最近有很多來自 Cloudflare IP 的錯誤登錄嘗試，於是我試圖使用下面兩個方法攔截，可惜結果證明無效。於是我使用了 OTP （One-time password）來增加暴力破解的難度，直到再次找到可行的攔截方法。我還安裝了一個修改 WordPress 登錄頁網址的插件 WPS Hide Login，應該也能有些作用。

Cloudflare Firewall

免費 Cloudflare 用戶可以創建 5 個防火牆規則，我建立了如下兩條：

(http.host in {"ft.wupo.info"} and ip.geoip.asnum in {13335})
(ip.src in {173.245.48.0/20 103.21.244.0/22 103.22.200.0/22 103.31.4.0/22 141.101.64.0/18 108.162.192.0/18 190.93.240.0/20 188.114.96.0/20 197.234.240.0/22 198.41.128.0/17 162.158.0.0/15 104.16.0.0/12 172.64.0.0/13 131.0.72.0/22} and http.host eq "ft.wupo.info")

我隨便查了幾個 Cloudflare IP 的 AS 編號都是 13335,所以第一條就是如果 IP 的 AS 編碼是 13335 就攔截。順便推薦個我經常用的查 IP 的網站 IP-API。

第二條是根據 IP 地址來封鎖，從這裡獲得 Cloudflare 的 IP 。

(ip.geoip.country ne "KP" and http.host eq "ft.wupo.info")

如果想根據 IP 所在國家來限制訪問也是可以的，上面的便是限制了北韓以外 IP 的訪問本站。

在 Limit Login Attempts 插件中限制 IP

這個就是一行一個填已經攔截的 IP 就可以了，可以把所有 IP 複製下來，然後粘貼到 LibreOffice Calc 中，按需要進行排序後複製出 IP 列貼回插件中就可以了。