[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"blog-ddev-wordpress-走出本機端的設定方式":3},{"id":4,"slug":5,"title":6,"description":7,"content":8,"date":9,"image":10,"imageAlt":6,"author":11,"categories":14,"path":18,"minRead":19},3757,"ddev-wordpress-走出本機端的設定方式","DDEV -WordPress 走出本機端的設定方式","DDEV -WordPress 走出本機端的設定方式 以全端工程師來說，ddev 這套工具對本機端開發真的有巨 […]","\u003Ch1>DDEV -WordPress 走出本機端的設定方式\u003C\u002Fh1>\n\u003Cp>以全端工程師來說，ddev 這套工具對本機端開發真的有巨大的幫助。像我現在針對 WordPress 相關的專案時，就先採用 ddev 作為本機開發的優先選項。\u003C\u002Fp>\n\u003Cp>而有時製作的內容想先丟給像是設計師啦、PM甚至是客戶，用直接實例呈現跟對方討論時，其實也能用一些內網穿透的proxy工具來處理，ddev 就跟最常用的 ngrok 有整合可以透過 config 直接呼叫 ngrok 啟動，讓本機端也能走到外部網路。\u003C\u002Fp>\n\u003Cp>說明文件在這邊：\u003Ca href=\"https:\u002F\u002Fddev.readthedocs.io\u002Fen\u002Fstable\u002Fusers\u002Ftopics\u002Fsharing\u002F\">https:\u002F\u002Fddev.readthedocs.io\u002Fen\u002Fstable\u002Fusers\u002Ftopics\u002Fsharing\u002F\u003C\u002Fa>\u003C\u002Fp>\n\u003Cp>簡單記錄一下設定流程\u003C\u002Fp>\n\u003Ch2>設定 ngrok 網域\u003C\u002Fh2>\n\u003Col>\n\u003Cli>註冊 ngrok ，與啟用網域，文件在\u003Ca href=\"https:\u002F\u002Fngrok.com\u002Fblog-post\u002Ffree-static-domains-ngrok-users\">這邊\u003C\u002Fa>\u003C\u002Fli>\n\u003Cli>啟用網域後，我們會拿到一組臨時網域，例如 wp23.ngrok-free.app\u003C\u002Fli>\n\u003Cli>設定 .ddev\u002Fconfig.yaml ，在文件中加入\u003C\u002Fli>\n\u003C\u002Fol>\n\u003Cpre>\u003Ccode class=\"language-php\">ngrok_args: --domain wp23.ngrok-free.app\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Col start=\"4\">\n\u003Cli>設定 wp-config-ddev.php ，因為 ddev 預設的位置應該是 \u003Ca href=\"https:\u002F\u002Fwordpress.ddev.site\u002F\">https:\u002F\u002Fwordpress.ddev.site\u003C\u002Fa> ，要修改 ddev 內的 wp-config \u003C\u002Fli>\n\u003C\u002Fol>\n\u003Cpre>\u003Ccode class=\"language-php\">define('WP_HOME', 'https:\u002F\u002Fwp23.ngrok-free.app');\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Col start=\"5\">\n\u003Cli>檢查有無需要取代的字串，這是 WordPress 的老毛病，進行之前建議先進行 DB  \u003Ca href=\"https:\u002F\u002Fddev.readthedocs.io\u002Fen\u002Fstable\u002Fusers\u002Fusage\u002Fcommands\u002F#export-db\">備份\u003C\u002Fa> 或 \u003Ca href=\"https:\u002F\u002Fddev.readthedocs.io\u002Fen\u002Fstable\u002Fusers\u002Fusage\u002Fcommands\u002F#snapshot\">快照\u003C\u002Fa>\u003C\u002Fli>\n\u003C\u002Fol>\n\u003Cpre>\u003Ccode class=\"language-php\">ddev wp search-replace https:\u002F\u002Fwordpress.ddev.site https:\u002F\u002Fwp23.ngrok-free.app\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Col start=\"6\">\n\u003Cli>現在執行 ddev share ，應該就能看到 \u003Ca href=\"https:\u002F\u002Fwp23.ngrok-free.app\">https:\u002F\u002Fwp23.ngrok-free.app\u003C\u002Fa> 可以用囉，就可以直接丟給外部使用者了，YA!\u003C\u002Fli>\n\u003C\u002Fol>\n","2024-05-13T10:01:51","\u002Fapi\u002Fproxy-image?url=https%3A%2F%2Fpost.billxu.net%2Fwp-content%2Fuploads%2F2024%2F05%2Fa72d9c63-7740-4941-99cd-255a1444e0c3.jpeg",{"name":12,"link":13},"Chih Fan","http:\u002F\u002Fpost.billxu.net",[15],{"name":16,"slug":17},"WordPress","wordpress","\u002Fblog\u002Fddev-wordpress-走出本機端的設定方式",1]