current position:Home>Eight blog views / hexubs

Eight blog views / hexubs

2022-04-29 04:21:12Xia ordinary

【 Roof placement 】【 special column 】 use Github Pages+Hexo Build a blog

 Insert picture description here

1. register LeanCloud

Go to LeanCloud Register and log in
 Insert picture description here
 Insert picture description here

2. establish & Configure the application

I'm gonna go ahead and create an app
 Insert picture description here
Enter the app name ( Name at will ), Choose development , Click Create
 Insert picture description here
After the creation is successful, click the settings in the upper right corner of the application
 Insert picture description here
Click on Storage , establish Class,Class The name is set to Counter( It has to be for Counter), Choose unlimited , Click Create
 Insert picture description here
Click settings after creation , Click application Key, obtain App ID and App Key, Copy standby
 Insert picture description here

3. Modify theme profile

The theme profile /themes/next/_config.yml Medium leancloud_visitors: Of enable Set to true, And will App ID and App Key fill
 Insert picture description here

4. Configure the domain name , Set up network security

Click Security Center , Fill in the domain name corresponding to your blog ( Pay attention to the protocol 、 The domain name and port number should be strictly consistent )

because App ID and App Key Is completely exposed , So prevent others from using , We can set... In the application settings Web Secure domain name , Only the added domain name can use this application , Prevent someone Hack Our database . Click Settings , Security Center ,Web Domain name security , add to Blog domain name , Click Save to OK 了
 Insert picture description here

5. Restart deployment Hexo

hexo clean
hexo g
hexo d

6. Background management

When the above parts are configured , When our blog page first opened , It will automatically send information to the server , In the application just created test Of Counter Create a piece of data in the table .
 Insert picture description here

7. Deploy the cloud engine to ensure that the number of visitors is not tampered with at will

Click the cloud engine on the left in turn -> Deploy -> Online editing
 Insert picture description here
Click Create function
 Insert picture description here
Select... In the pop-up window Hook type , In the choice Hook Place selection beforeUpdate, In the choice Class Place selection Counter class . After pasting the code below , Point save .

var query = new AV.Query("Counter");
if (request.object.updatedKeys.indexOf('time') !== -1) {
    return query.get( (obj) {
        if (obj.get("time") + 1 !== request.object.get("time")) {
            throw new AV.Cloud.Error('Invalid update!');

Then click deploy... To the right of the Create button -> Production environment -> Deploy

To be displayed, the deployment is completed :1 If an instance is deployed successfully
 Insert picture description here

8. Some of the pit

Many articles end here , But there are still some pits …

Solve the problem that some articles do not display the number of readings ,LeanCloud Automatic deployment failed ?

terms of settlement : Manually create LeanCloud Of Counter data row
 Insert picture description here
Imitate existing data formats to create :
 Insert picture description here
 Insert picture description here
 Insert picture description here
If your manual creation fails , I'm going to check url Is the format correct .

Solve the number of readings : Counter not initialized! More info at console err msg.

 Insert picture description here
Method 1 、 Installing a plug-in hexo-leancloud-counter-security
Command line execution npm install hexo-leancloud-counter-security
 Insert picture description here
Method 2 、 The theme profile _config.yml The corresponding item in security Set as false

solve hexo+next The number of times you read the home page has always been 0, The reading times in the article can be displayed normally ?

A lot on the Internet hexo Add reading statistics are old versions next Theme approach , The new version has been collected leancloud, Just open the topic below lean_cloud Function and in

/next/layout/_macro/post.swig The following code is enough

{# LeanCould PageView #}
          {% if theme.leancloud_visitors.enable %}
             <span id="{
   { url_for(post.path) }}" class="leancloud_visitors" data-flag-title="{
   { post.title }}">
               <span class="post-meta-divider">|</span>
               {% if theme.post_meta.item_text %}
          {% endif %}

copyright notice
author[Xia ordinary],Please bring the original link to reprint, thank you.

Random recommended