Open a new ecological posture | Use WordPress to store remote attachments to COS

Before reading this article, you have probably heard of WordPress. It is a blogging platform developed in PHP language. Users can set up their own websites on servers that support PHP and MySQL databases, or they can use WordPress as a A Content Management System (CMS) to use.

WordPress is powerful and extensible, mainly due to its numerous plug-ins and easy expansion of functions. Basically, all functions that a complete website should have can be achieved through its third-party plug-ins.

This article will introduce how to implement the remote attachment function by using plugins, store WordPress media library attachments on Tencent Cloud Object Storage COS, and accelerate it through Tencent Cloud CDN to achieve all functions.

1. Introduction

First, let's understand that saving the media library attachments on COS has the following benefits:

• Accessories will have higher reliability;
• When users view image attachments, they will be directly connected to the COS server, which does not occupy the downlink bandwidth/traffic of your server, and the user access speed is faster;
• It can cooperate with Tencent Cloud CDN to further improve the speed of users viewing image attachments and optimize website access speed.

2. Preparations

1. Build a WordPress blog platform.

• You can download the latest version of WordPress and view the installation guide on the official WordPress page.
• You can also choose a cloud server (Cloud Virtual Machine, CVM) image with pre-installed WordPress blogging platform in the image market when installing the server system.

2. Create a public read/private write bucket. The recommended region of the bucket is the same as the region of the CVM running the WordPress blogging platform. For details, please refer to the documentation on creating a bucket.

3. Find the bucket you just created in the bucket list, and click its bucket name to enter the bucket page.

​

4. In the left navigation bar, click Overview to view and record the access domain name.

​

​

3. Install and configure the plugin

(1) Install the plug-in

In the WordPress admin, click Plugins > Install Plugin to start installing the plugin. You can obtain and install plugins in the following two ways:

• Search for Sync QCloud COS directly in the background for installation (recommended).
• You can also download the source code of the latest releases from Github, upload and install through the WordPress background, or directly upload the source code to the WordPress plugin directory wp-content/plugins , and then enable it in the background.

(2) Configure plug-ins

1. Click Settings on the left navigation bar of WordPress, and then configure the relevant information of COS on the page. The configuration instructions are shown in the following table:

configuration item	configuration value
bucket name	The name that was customized when the bucket was created
Bucket Region	The region selected when creating the bucket
APPID	APPID is the account you get after successfully applying for a Tencent Cloud account. It is automatically assigned by the system and is fixed and unique. You can view it in the account information.
SecretID, SecretKey	Access key information, which can be obtained from Cloud API Keys
Do not upload thumbnails	After checking, the corresponding thumbnail file will not be uploaded, it is recommended not to check
Do not keep backups locally	If checked, the source file will not be kept locally, it is recommended not to check
local folder	Local save path, such as wp-content/uploads
URL prefix	The format is /<local folder>, for example https://examplebucket-1250000000.cos.ap-shanghai.myqcloud.com/wp-content/uploads

2. After the configuration is complete, click Save.

3. Upload a new file for testing, view the attachment details, view the URL of the attached image, and confirm that the URL of the attached image points to Tencent Cloud COS.

4. Expansion

1. Use CDN to speed up access:
If the bucket needs to be configured with CDN acceleration, please refer to the CDN acceleration configuration document. In the plugin settings, modify the URL prefix to the default CDN acceleration domain name or custom acceleration domain name.

2. Replace the resource address in the database:
If it is not a newly created site, the database must be the old resource link address. We need to replace the resource address. The plugin provides a replacement function, please remember to back it up before the first replacement.

• Fill in the original resource domain name for the old domain name, such as https://example.com/
• Fill in the current resource domain name for the new domain name, such as https://img.example.com/

3. Set up cross-domain access:
Refer to the corresponding resource link in the article, and the console will prompt a cross-domain error No 'Access-Control-Allow-Origin' header is present on the requested resource.

The reason is that the header is not added. You need to add HTTP Header configuration in CORS settings for cross domain access. There are two ways to configure it:

i. Configure on CDN console

• If all domain names are allowed, the configuration is as follows:

 Access-Control-Allow-Origin: *

ii. Only allow your personal domain name access, the configuration is as follows:

 Access-Control-Allow-Origin: https://example.com

4. Set back to source:

If you do not upload resources in the WordPress background media library, it is recommended to enable the back-to-source setting. After it is enabled, when the client accesses the COS source file for the first time, when COS finds that the object cannot be hit, it returns a 302 HTTP status code to the client and jumps to the address corresponding to the back-to-source address. At this time, the object is provided to the client by the source site to ensure that access.

At the same time, COS copies the file from the source site and saves it to the directory corresponding to the bucket; COS directly hits the object and returns it to the client during the second access.

V. Summary

This article introduces the WordPress media library attachment remote to object storage COS practice sharing, and then we will bring you a series of related content about the ecological platform/plug-in. In addition, we will also bring you a variety of ecological empowerment activities. , please stay tuned!

Information about ecological plugins and other activities
Welcome to join the exchange group to get the latest information on ecological activities

— END —