Alfred Zhao 從Oracle起航，領略精彩的IT技術。

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

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

PWA本身配置極其簡單，開啟就好，但是PWA的前提是，你開發的網站必須要使用https安全訪問才可以。

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

1.搞定https所需證書

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

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

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

如果直接使用普通用戶執行certbot會報錯：

[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.

為了簡單，這里直接sudo使用root用戶權限來申請證書：

sudo certbot certonly --standalone -d yourdomain.com

生成的證書路徑默認在這個路徑下：

/etc/letsencrypt/live/yourdomain.com/

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

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

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

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

# 強制 HTTP 跳轉到 HTTPS
server {
    listen 80;
    server_name yourdomain.com www.yourdomain.com;
    return 301 https://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 http://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 https://yourdomain.com$request_uri;
}

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

sudo nginx -t   
sudo systemctl restart nginx

配置證書自動續期：

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

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

crontab -e

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

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

2.解決apex測試問題

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

這里需要對ORDS的一些配置文件做修改：

sudo vi $ORDS_CONFIG/global/settings.xml

添加以下內容：（在合適位置，看文件就懂了）

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

發現還是不行，請教LLM助手給建議，回復說要兩個設置：

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

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

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

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

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

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

但是，從APEX run app時：

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

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

proxy_set_header X-Forwarded-Port 443;

3.開啟PWA功能

在APEX中給已有的APEX應用程序，開啟PWA功能，這個操作就非常簡單，主要下面配置：

Edit Application Definition

• Friendly URLs
• Enable Progressive Web App

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

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

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

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

Safari瀏覽器網頁登錄后會發現有下面紅框中標識的下載標志：

直接點擊它會提示你具體的操作方法，如何添加到手機桌面，如下：

按這個方法操作，直接就會添加到你的手機桌面上，類似和手機APP一樣的感覺：

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

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

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

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