Gitee map bed changed to Alibaba cloud OSS map bed

I was busy some time ago, and I wanted to write some blogs, but I found that the pictures in the article could not be displayed, so I put it down first. Now that I'm done, I'll start researching what's wrong with the blog.

The blog pictures cannot be displayed. In fact, it is obvious that there is a problem with the picture storage, so I first checked Gitee (I used Gitee as a picture bed when I reorganized the blog last time), and it was ruled out because Gitee itself turned off function as a drawing bed. Therefore, I have to change a picture bed. When I was looking for a suitable picture bed last time, I have tried many kinds, each with its own characteristics, but the platform I have tried is really not suitable for the framework of my blog, which will make the whole The framework of the blog has become very messy. After Baidu, I saw someone introducing Alibaba Cloud’s OSS. In fact, I was a little uneasy about this platform at the beginning, mainly because of the fees. In the end, I decided to try it for a while, and the next step is my deployment step. Although there were some problems in the middle, it went smoothly overall (all the problems that occurred were solved by me).

There are three main parts that need to be set: the first part is the operation of the platform on Alibaba Cloud; the second part is about PicGo (a tool for uploading pictures) and the related parameter configuration of the OSS image bed; the third part is about the content of the blog Modifications. It is mainly about the operation of the Alibaba Cloud platform, and secondly about
the parameter configuration of the picture bed in PicGo. There is not much to operate in the blog, just change the link of the picture. Let’s record everything here. Although the principle is simple, some small details will be involved in the operation.

OSS-related operations

Purchase Alibaba Cloud OSS resource package

• You need to go to the Alibaba Cloud official website to purchase the OSS resource package:

You can choose a package according to your own needs. I bought a cheaper one and I want to try it first.

Create a user under the Alibaba Cloud account

(The user and Alibaba Cloud account here are not the same thing, so they can be understood separately)

• First, click Access Control under the Alibaba Cloud account:
  

• Next, create a user in the user under identity management on the left:
  

• Then fill in the relevant information when creating a user:
  

The display name can simply explain what the purpose of this user creation is, and you can fill in the content you want, and I fill in it here is relatively simple.

Note: OpenAPI call access needs to be checked.

• Save relevant information after creating a user
  

Click to download the csv file to download the relevant form. The user information is stored in the form, which can be saved and downloaded. Just copy and paste it when needed. Among them, AccessKey ID and AccessKey Secret will be used later.

• Authorize the user
  

Find the user that has just been created, check it and click Add Permission, and select the permission policy of AliyunOSSFullAccess on the right.

Create buckets

I think Bucket has something to do with the storage structure of big data. If you want to know more about it, you can find articles on the storage structure of big data.

• Activate Object Storage Service OSS

To create a Bucket, you need to go to the OSS workbench. When you enter, you find that this function is not enabled. After clicking Alibaba Cloud, find the object storage OSS, and click to activate after it is displayed that it is not activated.

If it shows that the activation is successful, it is completed. Click on the management console to create a Bucket.

• Create buckets

After clicking the Bucket list, click Create Bucket:

When creating a Bucket, you can choose whether to enable related functions. If you have a need, you can research it. I don’t have any special requirements here. I only need to display blog pictures, so I only need to enable public read in the read and write permissions . .

Here is a little introduction and explanation about Bucket:

PicGo configuration

• You can understand it by looking at the picture:

Changes in the blog

Just change the prefix of the original picture link to the prefix of Alibaba Cloud.

https://nora-blogimg.oss-cn-hangzhou.aliyuncs.com/BlogImage/ image name

https://gitee.com/nora2nan/blog-image/raw/master/ image name

The prefix of my original Gitee picture bed is the following one, just change the same part as the prefix of the picture link on Alibaba Cloud now. Just use the replace function directly in the editing project.

---

During the intermediate configuration process, I encountered a problem. After pushing the locally modified blog file to github, the file in the github warehouse did not change, but the local display had been uploaded. After troubleshooting this problem for a while, I found that it was a public file on github. If the key is invalid, just fill in the public key again. Generally speaking, the public key is stored in the .ssh directory under the user on the C drive. This directory may be hidden, so you need to click to show the hidden directory.

When changing the image path in the blog, I was wondering if I could set this prefix as a variable, and only need to change one location in subsequent changes, instead of replacing them one by one like now, although I can use the built-in tool to choose to replace them all , but there are still some troubles. Since I haven't learned about SCSS-related content in detail, I don't know much about it. Baidu didn't find the exact answer after that, and I will add it after I have the answer later.