因(yin)為(wei)使用手機登錄APEX程(cheng)序時，每次都要先(xian)到手機瀏覽器的入口感覺不(bu)方便且不(bu)專業，所以能不(bu)能像APP那樣直接點擊進(jin)入呢？

最簡單的(de)方式(shi)，就是使用PWA來實現類似APP程序一樣的(de)移動端登錄(lu)。

PWA本身配置(zhi)極其簡單(dan)，開(kai)啟(qi)就好，但(dan)是PWA的前提是，你開(kai)發的網站必須要使用(yong)https安全(quan)訪問才可(ke)以(yi)。

• 1.搞定https所需證書
• 2.解決apex測試問題
• 3.開啟PWA功能
• 4.體驗“移動端APP”效果

1.搞定https所需證書

使用 ORDS + Nginx 前端代理 是目前 Oracle APEX 部署(shu)中最推(tui)薦(jian)的模(mo)式之一(yi)：既安全、靈活又高(gao)性(xing)能。

下面演示 在 OEL 系統下使用 Certbot + Nginx 為 ORDS 配置免費 HTTPS 的完整方案。
本文假設你申請的域名為yourdomain.com，我所有(you)貼出(chu)的配置也都全部替換這個域名方便大家理解(jie)。

sudo dnf install epel-release -y
sudo dnf install nginx -y

--error,這個在OEL源中沒有下面的certbot、python3-certbot-nginx這兩個包
--sudo dnf install certbot python3-certbot-nginx -y

--改為使用pip安裝 Certbot + Nginx 插件
pip3 install certbot certbot-nginx

--安裝之后，需要確認certbot命令可用（環境變量有效，root用戶也可以執行）
$ which certbot
/u01/kbot/anaconda3/bin/certbot
$ sudo ln -s /u01/kbot/anaconda3/bin/certbot /usr/bin/certbot
$ ls -l /usr/bin/certbot 
lrwxrwxrwx 1 root root 31 Jun 20 01:58 /usr/bin/certbot -> /u01/kbot/anaconda3/bin/certbot

如果直接(jie)使用普通用戶執行certbot會(hui)報錯(cuo)：

[Errno 13] Permission denied: '/var/log/letsencrypt/.certbot.lock'
Either run as root, or set --config-dir, --work-dir, and --logs-dir to writeable paths.

為了簡(jian)單(dan)，這里直接(jie)sudo使用(yong)root用(yong)戶(hu)權限來申請證書(shu)：

sudo certbot certonly --standalone -d yourdomain.com

生成的(de)證書路(lu)徑(jing)默認在這個路(lu)徑(jing)下：

/etc/letsencrypt/live/yourdomain.com/

你只需把這些(xie)證書手動(dong)配置進你的 Nginx：

ssl_certificate     /etc/letsencrypt/live/yourdomain.com/fullchain.pem;
ssl_certificate_key /etc/letsencrypt/live/yourdomain.com/privkey.pem;

創建或(huo)編輯(ji) Nginx 配(pei)置文件(有些配(pei)置是后(hou)面遇(yu)到實(shi)際問題后(hou)加上去的)：

sudo vi /etc/nginx/conf.d/apex.conf

# 強制 HTTP 跳轉到 HTTPS
server {
    listen 80;
    server_name yourdomain.com www.yourdomain.com;
    return 301 //yourdomain.com$request_uri;
}

# HTTPS 主站配置
server {
    listen 443 ssl;
    server_name yourdomain.com;

    ssl_certificate     /etc/letsencrypt/live/yourdomain.com/fullchain.pem;
    ssl_certificate_key /etc/letsencrypt/live/yourdomain.com/privkey.pem;

    ssl_protocols TLSv1.2 TLSv1.3;
    ssl_ciphers HIGH:!aNULL:!MD5;
    ssl_prefer_server_ciphers on;

    location / {
        proxy_pass //localhost:8080;
        proxy_http_version 1.1;
        proxy_set_header Host $host;
        proxy_set_header X-Forwarded-Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto $scheme;
        proxy_set_header X-Forwarded-Port 443;
    }
}

# Unique 
server {
    listen 443 ssl;
    server_name www.yourdomain.com;

    ssl_certificate     /etc/letsencrypt/live/yourdomain.com/fullchain.pem;
    ssl_certificate_key /etc/letsencrypt/live/yourdomain.com/privkey.pem;

    return 301 //yourdomain.com$request_uri;
}

檢查配(pei)置(zhi)是(shi)否正(zheng)確(會自動檢查配(pei)置(zhi)的Nginx文件)，之后重啟Nginx：

sudo nginx -t   
sudo systemctl restart nginx

配置證書自動續期：

雖然這里我是通過 --standalone 獲得證書，但仍然可(ke)以(yi)自動續期并 reload Nginx。

編輯定時任務：
使用 sudo -s 切換到root用(yong)戶(hu)。

crontab -e

0 3 * * * certbot renew --post-hook "systemctl reload nginx"

注：這里并不需要再執行 certbot --nginx，因為我們已經獲得了證書，而且現在的需求是配置好 Nginx 使用已有證書，不必重復申請。
如(ru)果(guo)你將來更改了域名或 Nginx 配置中(zhong)想讓 Certbot 自動更新文件，那么再用 --nginx 模式也可以，但當前完全(quan)沒必要。

2.解決apex測試問題

https搞定之后，發現使用https登錄apex的workspace還是有問題，報錯HTTP 403以及ORDS-13002：

這里(li)需要對ORDS的一(yi)些配(pei)置(zhi)文件做(zuo)修改：

sudo vi $ORDS_CONFIG/global/settings.xml

添(tian)加以(yi)下內容(rong)：（在合適位置(zhi)，看文件就懂(dong)了(le)）

<entry key="security.allow_origin">//yourdomain.com</entry>

發現還(huan)是不行，請教LLM助手給建議，回復說(shuo)要(yao)兩個(ge)設(she)置：

  <!-- 允許 CORS 來源 -->
  <entry key="security.allow_origin">//yourdomain.com</entry>

  <!-- 允許跨域 Cookie Session 來源 -->
  <entry key="security.externalSessionTrustedOrigins">//yourdomain.com</entry>

設置好之后，依次(ci)重啟ORDS和NGINX：

nohup ords serve >> ~/ords.log &
systemctl restart nginx

測試OK，使用之前學習apex期間做的一個DEMO程序，可以正常訪(fang)問：

//yourdomain.com/ords/r/ws_whale/whalestudy/home

但是，從APEX run app時：

//yourdomain.com:80/ords/r/ws_whale/aireport?session=4407332749203

會自動加一(yi)(yi)個80端口，反而(er)導(dao)致問題(ti)(ti)。這個問題(ti)(ti)是(shi)因為Nginx配置文件(jian)問題(ti)(ti)，加一(yi)(yi)行(上面配置文件(jian)已經是(shi)修改過(guo)的版本，所以你實(shi)際(ji)去測試的話，就不會有(you)任何問題(ti)(ti))：

proxy_set_header X-Forwarded-Port 443;

3.開啟PWA功能

在(zai)APEX中給已(yi)有的APEX應用程序，開(kai)啟PWA功能，這個操作就(jiu)非常(chang)簡單(dan)，主(zhu)要下面配置：

Edit Application Definition

• Friendly URLs
• Enable Progressive Web App

這里引用官方apex培訓的課程給出的直觀截圖，一目了然，找不到位置的同學可直接參考這個圖示：

4.體驗“移動端APP”效果

開啟了PWA，就可以實現在手機等移動端有使用APP的效果，還是以之前學習使用的DEMO程序來測試。
我(wo)們只需要這樣做：

先從apex中直接run你的apex app，復制瀏覽器地址欄中具體的url地址，復制發給手機。
然(ran)后手機復制這個地址，iPhone的話就(jiu)在自帶(dai)的Safari瀏(liu)覽(lan)器打開(kai)（注意不要(yao)微信直接(jie)打開(kai)，要(yao)使用手機的瀏(liu)覽(lan)器打開(kai)）

Safari瀏覽器網頁登錄后會發(fa)現有(you)下(xia)面紅框中標(biao)識的下(xia)載(zai)標(biao)志(zhi)：

直接點(dian)擊(ji)它會提示你具(ju)體的(de)操作方(fang)法(fa)，如(ru)何添(tian)加到(dao)手機(ji)桌面(mian)，如(ru)下：

按這個方法(fa)操作(zuo)，直接就會添加到你的(de)手機(ji)桌面(mian)上，類似和手機(ji)APP一樣(yang)的(de)感覺(jue)：

點擊打開就是這樣的效果：

此刻，恍惚間(jian)居然有開發出(chu)一款手機APP的(de)爽感，雖然它只是PWA（Progressive Web App）...

編者注：
PWA是網頁的增強版，優勢在于開發效率、跨平臺和免安裝，適合輕量級場景。
手機APP是原生體驗的代表，優勢在于性能與功能深度，適合高頻復雜需求。
隨著Web技(ji)術的演(yan)進，PWA的能(neng)力(li)正在逼近原生應(ying)用，但兩者仍會根據場景長期共(gong)存。

OK，把APEX程序變成(cheng)“移動(dong)端APP”的演示結束(shu)，感興趣的同學自己嘗試下吧。