使用VSCode+Docker搭建PHP遠(yuǎn)程開發(fā)環(huán)境

為什么

搭建VSCode+Docker搭建PHP遠(yuǎn)程開發(fā)環(huán)境搭建,主要解決以下幾個問題:

  • 微信開發(fā)調(diào)試問題。
  • 隨時隨地辦公問題(具體參看code-server)。
  • 減少本地環(huán)境污染,PHP與Node版本可能沖突(dyld: Library not loaded: /usr/local/opt/icu4c/lib/libicui18n.64.dylib)。
  • 減少硬盤使用。

基礎(chǔ)環(huán)境

本地

  • MacOS

  • VSCode

  • Docker Desktop

遠(yuǎn)程

  • CentOS

  • Docker CE

本機(jī)不使用MacOS,而用Windows,準(zhǔn)備好SSH工具應(yīng)該也沒問題。遠(yuǎn)程服務(wù)器,推薦購買阿里云,使用*NIX系統(tǒng)都沒有問題。

步驟

  • 配置ssh登錄遠(yuǎn)程服務(wù)器

  • 安裝Docker

  • 安裝PHP

  • 安裝Nginx

  • 配置VSCode

  • 測試

以上為使用VSCode+Docker搭建PHP遠(yuǎn)程開發(fā)環(huán)境搭建的主要過程。

配置SSH遠(yuǎn)程登錄

在本機(jī)上生成密鑰對,然后把公鑰放到服務(wù)器相應(yīng)用戶的~/.ssh目錄,開啟服務(wù)器SSH配置。

生成密鑰

進(jìn)入~/.ssh如果有管理多個ssh,最好~/.ssh

mkdir ~/.ssh/aliyun
cd ~/.ssh/aliyun
ssh-keygen

系統(tǒng)會詢問你文件名和秘鑰密碼,可以一路回車過去,會生成兩個文件:

  • id_rsa 私鑰
  • id_rsa.pub 公鑰

服務(wù)器ssh配置

把上一步生成的公鑰發(fā)送到服務(wù)器(scp,FillZilla等)上,然后在服務(wù)器上執(zhí)行下面命令。(authenrized_keys的權(quán)限必須是600或更小,否則會連接失?。?/p>

cat id_rsa.pub >> ~/.ssh/authorized_keys
chmod 600 ~/.ssh/authorized_keys
chmod 700 ~/.ssh

修改服務(wù)器上的ssh配置文件,位置:/etc/ssh/sshd_config

RSAAuthentication yes
PubkeyAuthentication yes

PermitRootLogin no //禁止root登錄
PasswordAuthentication yes //允許密碼登錄,根據(jù)你的情況設(shè)置

然后重啟ssh服務(wù)

systemctl restart sshd

配置別名

Host server_alias(你的服務(wù)器別名)
 HostName test.com/192.168.1.1(域名或IP)
 Port 22
 User user
 Identifier id_rsa

保存后,登錄時只需執(zhí)行

ssh server_alias

安裝Docker

Docker安裝無特殊說明,參考官方文檔進(jìn)行安裝即可,本機(jī)Docker可以不用啟動。

本機(jī)

https://docs.docker.com/docker-for-mac/install/

遠(yuǎn)程

https://docs.docker.com/engine/install/centos/

安裝PHP

因?yàn)樾枰惭bPHP擴(kuò)展,所以通過編寫Dockerfile來生成鏡像。通過https://hub.docker.com/_/php 可以查看相關(guān)配置。注意修改國內(nèi)源,同時不要使用最新版本鏡像,否則下載依賴包時可能出現(xiàn)問題。如下是我的 Dockerfile,大家可以參考。

FROM php:7.3-fpm
LABEL maintainer="L4qiang@gmail.com"
LABEL Description="PHP7.3開發(fā)環(huán)境"

# dependency
RUN sed -i 's#http://deb.debian.org#https://mirrors.163.com#g' /etc/apt/sources.list \
    && apt-get update \
    && apt-get install -y net-tools dnsutils inetutils-ping wget git unzip

# composer
RUN curl -sS https://getcomposer.org/installer | php
RUN mv composer.phar /usr/local/bin/composer
RUN chmod +x /usr/local/bin/composer
RUN composer config -g repo.packagist composer https://packagist.phpcomposer.com

# php-ext
RUN docker-php-ext-install -j$(nproc) bcmath calendar exif gettext sockets dba mysqli pcntl pdo_mysql shmop sysvmsg sysvsem sysvshm iconv
RUN pecl install xdebug && docker-php-ext-enable xdebug

RUN apt-get install -y --no-install-recommends libfreetype6-dev libjpeg62-turbo-dev libpng-dev \
    && docker-php-ext-configure gd --with-freetype-dir=/usr/include/ --with-jpeg-dir=/usr/include/ \
    && docker-php-ext-install -j$(nproc) gd

RUN apt-get install -y --no-install-recommends libzip-dev && \
    rm -r /var/lib/apt/lists/* && \
    docker-php-ext-install -j$(nproc) zip

構(gòu)建容器

docker build -t php-dev .
docker run --name -d -p 9000:9000 -v /data/Workspace/www:/var/www/html -v /data/Workspace/log/php:/var/log/php php-dev

安裝Nginx

在遠(yuǎn)程服務(wù)器用Docker安裝Nginx,通過https://hub.docker.com/_/nginx 可以查看一些配置。一般會將nginx的整個配置目錄 copy 到本地一份,然后在運(yùn)行的時候?qū)⒛夸浗壎ǖ?nginx 容器的配置目錄

獲取配置

docker run --name tmp-nginx -d nginx
docker cp tmp-nginx:/etc/nginx /data/nginx/conf
docker rm -f tmp-nginx

修改配置

    server {
       charset utf-8;
       client_max_body_size 128M;

       listen 80; ## listen for ipv4
       server_name php.goldsyear.com;

       root /var/www/html/;
       index       index.php;

       location / {
            try_files $uri $uri/ /index.php$is_args$args;
        }

        location ~ ^/assets/.*\.php$ {
            deny all;
        }

       location ~ \.php$ {
           include fastcgi_params;
           fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
           fastcgi_pass 172.17.0.1:9000;
       }

       location ~* /\. {
           deny all;
       }
    }

注意/var/www/html/為php-dev中的地址。172.17.0.1為docker宿主網(wǎng)卡地址,可通過ip addr show docker0 來查看,一般為172.17.0.1。

構(gòu)建容器

docker run -p 80:80 --name nginx -v /data/nginx/conf:/etc/nginx -d nginx:stable

VSCode配置

安裝Remote Development插件

打開VSCode,切換到插件面板,搜索Remote Development并安裝,會同時安裝Remote-WSL,Remote-Containers,Remote-SSH這三個插件。

配置SSH

創(chuàng)建工作目錄,如/Users/airhead/WorkSpace/followme/docker

使用VSCode打開目錄,增加.vscode\settings.json

{
    "docker.host": "ssh://root@ip",
    "terminal.integrated.shellArgs.osx": ["-s", "ssh-add ~./ssh/goldsyear-aliyun"]
}

注意,docker.host不是一個地址不能使用別名。

測試

此時切換的VSCode的Docker面板,會看到php-dev(根據(jù)自己的情況查看),右鍵Attach Visual St?udio Code,會打開一個新的VSCode。

打開目錄/var/www/html,創(chuàng)建inde.php

<?php
    echo phpinfo();
?>

使用瀏覽器查看或用wget查看

wget http://php.goldsyear.com/index.php -O index.html
2020-05-19 16:20:51 (1.25 MB/s) - ‘index.html’ saved [99370]

總結(jié)

通過以上的配置就可以在VSCode中遠(yuǎn)程開發(fā)了,此次配置PHP遠(yuǎn)程開發(fā)環(huán)境,最容易出現(xiàn)問題的地方是PHP鏡像的構(gòu)建,可能會因?yàn)楦鞣N原因出錯,要保持耐心多試幾次。

參考鏈接

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

友情鏈接更多精彩內(nèi)容