Dependent installation

docker

Due to domestic installation too slow, so I can use https://docs.docker.com/desktop/ to download speed. The specific downloading process will not be described. Mirror source: “http://hub-mirror.c.163.com”

Docker installation Jenkins

# in the background run a name jk, external port number is3080Docker run -d --name jk-p docker run -d --name jk-p3080:8080 -v ~/docker/jenkins:/var/jenkins_home jenkins/jenkins
Copy the code

After the command is executed, you can start an HTTP service with port number 3080 and open the browser.

  1. Enter http://localhost:3080/ for initialization (may be more long), after the completion of this need the administrator password, cat ~ / docker/Jenkins/secrets/initialAdminPassword can obtain the administrator password.

  2. The next step is to install the plug-in. I suggest the first option, the recommended plug-in (this installation will also be slow, wait patiently).

  3. Create the first administrator account

Docker installation gitlab

docker pull gitlab/gitlab-ce

docker run -d --name gitlab -p 443:443 -p 9001:80 -p 222:22 -v ~/docker/gl/config:/etc/gitlab:Z -v ~/docker/gl/logs:/var/logs/gitlab:Z -v ~/docker/gl/data:/var/opt/gitlab:Z gitlab/gitlab-ce
Copy the code
  1. The initialization process may take a long time, rundocker logs -f gitlabYou can view the progress.
  2. Enter http://localhost:9001 to enter the password for the first time and enter the user name and password (the default user name is root).
  3. Set the IP address of the clone project in HTTPS or SSH mode.
# configure the HTTP protocol to use the access address, no port number default is80
external_url 'http://192.168.1.2:9001Gitlab_rails ['gitlab_ssh_host'] = '192.168.1.2'
gitlab_rails['gitlab_shell_ssh_port'] = 222# This port is run22portmapped222Port # nginx listening80Otherwise, the port number of external_URL is used by default. As a result, the port mapping fails nginx['listen_port'] =80:wq # Save the configuration file and exitCopy the code
  1. If SSH fails, the main cause is that the permission of the key file on the server is incorrect.docker exec -it gitlab shEnter the container and view/etc/gitlabIn the directorySsh_host_ecdsa_key, ssh_host_ED25519_key, ssh_host_Rsa_keyCheck whether the user name and group of the three files are git (chown changes the owning user, CHGRP changes the owning group), and whether the file permission is 600 (chmod can be changed).

Docker to install nginx

docker pull nginx
docker run -d --name nginx -p 80:80 -v ~/nginx/html:/usr/share/nginx/html nginx
Copy the code

summary

  • Localhost :3080, access Jenkins (should run on the server used for the build)
  • Localhost :9001, access gitlab (should run on the server where the source code is placed)
  • Localhost, access to nginx (should run on the server)

configuration

1. Install plug-ins related to GitLab

Home -> System Administration -> Plug-in Management And then switch toOptional plugins, search for GitLab and select GitLab Plugin(I’ve already installed it, so I’m not showing it here), and thenSelect the button in the lower left cornerWait until the installation is complete

2. Home -> System Administration -> System Configuration

The Credentials, when you add themMust be a GitLabAPI token.

The following figure shows how to obtain the GitLabAPI token, the generated token will be hidden after refreshing to ensure security.

When the configuration is complete, it is a good idea to click the Test Connection button to make sure the configuration is correct.

3. Create a job

4. Enter a task name and select a free style

5. Configure related build options

1. General configuration

Select the option that you filled in the previous system configuration,If not selected, the state of the build will not be transmitted back to GitLab

2. Source management

The URL can only be HTTP, so the Credentials below need to use username with password. Otherwise, the code cannot be pulled.

The lower configuration indicates that only theMaster and begin with CIBranch to build. Specific rules can be click on the right side of the question mark to understand.

3. Build triggers

Select Build when a change is Pushed to GitLab. On the right side there are webhook URL for GitLab and below there are some timing options to trigger Build (need to coordinate with GitLab’s configuration).

The Webhooj URL provided by the Jenkins plugin cannot be used directly, because Jenkins needs to be logged in, and the API provided by the external plugin also needs to be logged in, otherwise HTTP 401 will be returned. Thankfully, this login can be done with HTTP basic authentication.

Click Username -> Settings -> API Token -> Add new Token -> Enter name -> Generate, then copy the Token and concatenate it with the previous Webhook URL. Stitching rules for < scheme > : / / < user >, < password > @ < host > : < port > / < path >; ? The < query > # < frag >. Finally can get http://ma1:[email protected]:3080/project/gl

URL splicing rules for those interested can take a look at my previous article

I can save it at this point. Then go to Gitlab for configuration.

4. Gitlab configures webhook urls

Gitlab does not allow native urls by default, so either use a public domain name or change gitlab’s privacy Settings(As shown below)

Then open the project you want to deploy -> Settings -> Webhooks, fill in the URL of the previous concatenate, select the corresponding event, and click Add. After successfully adding, you can clickTestTest whether the hooks work ().

5. Build the environment

Front-end builds are bound to use Node, so this is a mustSelect Provide Node & NPM bin/ Folder to PATH(If not, go to the plug-in center to install it.)

6. Build

  1. Go to the plugin center and install a plugin namedPublish Over SSHPlugin for sending generated files to a remote server.

To configure the plug-in, choose System Management > System Configuration.

2. Build TAB, add build steps, and select execute shell

Replace gl with the corresponding project name

#Delete the previous file
rm -rf /tmp/html.tar.gz

#Run the test
npm run test
#NPM build, package scripts
npm run bd

#Switch to the project directory
cd /var/jenkins_home/workspace/gl
#Package the destination folder as a zipped file
tar -zcvf /tmp/html.tar.gz --exclude .git -C ./dist .
#Publish over SSH is not accessible because you must put the zip file in the project directory
mv /tmp/html.tar.gz ./
Copy the code
  1. Add a TAB and select Send Files or Execute CommonAds over SSH

#Delete/TMP/HTML and create a new one. To prevent an error
rm -rf /tmp/html
mkdir /tmp/html

#Unzip the compressed file to/TMP/HTML and delete the compressed file
tar -xvf ~/html/html.tar.gz -C /tmp/html
rm -rf  ~/html/html.tar.gz

#Copy the extracted file to ~/nginx/ HTML (the local path of docker nginx mapping)
cd /tmp/html
cp -R /tmp/html/* ~/nginx/html
Copy the code

7. Post-build steps

Click “Publish Build Status to Gitlab” and select “Publish Build Status to Gitlab”, so that the status of Jenkins’ build can be seen in THE CI/CD of Gitlab after completion of Jenkins’ build.

6. Push code to trigger build

After you push the code, if everything goes well, you’ll see the build history here, otherwise check the configuration.

7. Browse the web

After pushing the code, it is only static file deployment, so nginx does not need to restart to see the new content.

conclusion

  1. When pushing code, GitLab notifies Jenkins via a Webhook URL
  2. After Jenkins receives the POST request, he triggers the build, including test packaging, and sends the files to the remote server and executes corresponding commands, such as unzip the files and copy them to the nginx-related directory. For nodeJS applications, you need to execute the Node script.
  3. The remote server must have docker and Nginx containers installed in advance, and run nginx service in the background.
  4. If nodejs + nginx is required, you can use docker-compose to simplify command execution and add the exec command to publish over SSH.

If you have any questions, feel free to leave a comment below.