preface

I believe that most friends who do Zhejiang political nail application must experience a pit of "partial success". How to check? It may not be difficult for old drivers, but for novice drivers who apply Zhejiang political nails for the first time, there will be a feeling that they can't start. Because you feel that everything comes up according to the documents. Tell me secretly. Do you have this feeling? Hahaha
No matter how you operate the burial point, here I also introduce my burial point. I hope to provide some help to those friends who are still distressed and have not succeeded in the burial point and get out of the pit of the burial point as soon as possible.
Tip: I use vue's single page development method. Other development methods are only for reference.

1, Buried point classification

Zhezheng nail embedding point code is divided into:

• Stability monitoring code (Emas): stability monitoring code (Emas) only needs to be added on the home page
• Traffic analysis code (A +): each page of traffic analysis code (A +) needs to be added.
  • General collection SDK
  • Foundation buried point
  • User information embedding point

Stability monitoring code (Emas) I believe there is basically no difficulty, just paste it on the home page. The traffic analysis code needs to be encapsulated in a js, and then called once per page.

2, Stability monitoring code (Emas)

There is little difficulty in embedding this point. Generally, after the application is approved and put on the shelf, the application technician of zhezheng nail will send a document to the person submitting the approval form (generally the owner), which contains:

• apply name
• Application identification
• Official App Key
• Official App Secret
• Zhezheng nail tenant Id of the owner
• Zhejiang government nail domain name in formal environment
• And the code of the buried point
  • Stability monitoring
  • General collection SDK
  • Foundation buried point
  • User information embedding point

We only need to post the stability monitoring code in the head of the home page (index. HTML), because the stability code already contains the formal bid and signkey. For example:

<script src='https://wpk-gate.zjzwfw.gov.cn/static/wpk-jssdk.1.0.2/wpkReporter.js' crossorigin='true'></script>
<script>
  try {
    const config = {
      bid: 'xxxxxxxxxx',
      signkey: 'xxxxxxxxxxx',
      gateway: 'https://wpk-gate.zjzwfw.gov.cn'
    };
    const wpk = new wpkReporter(config);
    wpk.installAll();
    window._wpk = wpk;
  } catch (err) {
    console.error('WpkReporter init fail', err);
  }
</script>

3, Flow analysis code (A +)

Traffic analysis code should be added to each page, but the "general collection SDK" is a fixed value, so it can be placed on the home page.

General collection SDK

The next step is the embedding point of the general collection SDK, which has almost no difficulties. These are fixed codes. We only need to stick them behind the stability monitoring code. For example:

(function(w, d, s, q, i) {
    w[q] = w[q] || [];
    var f = d.getElementsByTagName(s)[0],j = d.createElement(s);
    j.async = true;
    j.id = 'beacon-aplus';
    j.src = 'https://alidt.alicdn.com/alilog/mlog/aplus_cloud.js';
    f.parentNode.insertBefore(j, f);
  })(window, document, 'script', 'aplus_queue');

  aplus_queue.push({
    action: 'aplus.setMetaInfo',
    arguments: ['aplus-rhost-v', 'alog.zjzwfw.gov.cn']
  });
  aplus_queue.push({
    action: 'aplus.setMetaInfo',
    arguments: ['aplus-rhost-g', 'alog.zjzwfw.gov.cn']
  });
  
  var u = navigator.userAgent
  var isAndroid = u.indexOf('Android') > -1
  var isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/)

  aplus_queue.push({
    action: 'aplus.setMetaInfo',
    arguments: ['appId', isAndroid ? '28302650' : isIOS ? '28328447' : '47130293']
  });

It's probably soy sauce purple

Foundation embedment point and user information embedment point

I believe that as long as there is a problem with the embedded point, it is basically the problem here. Because these two embedded point codes are required for each page, we encapsulate these two codes into a js file and call them every time the route is switched.
​

Foundation buried point

// Single page application or "single page" needs to supplement PV log parameters asynchronously, and the following embedding points are also required:
aplus_queue.push({
  action: 'aplus.setMetaInfo',
  arguments: ['aplus-waiting', 'MAN']
});//
// Execute sendPV after routing switching of single page application or after asynchronously obtaining the parameters required by pv log:
aplus_queue.push({
  'action':'aplus.sendPV',
  'arguments':[{
    is_auto: false
  }, {
    // Your current app information, please do not modify these two lines
    sapp_id: 'xxxx',
    sapp_name: 'xxxxxx',
    //Custom PV parameter key value pairs (only this kind of tiled json, not multi-layer nesting),
    page_id: 'page ID，And page Parameters are used together to ensure uniqueness',
    page_name: 'Page Chinese name',
    page_url: 'page URL'
  }]
})

analysis:

• sapp_id: this value can be found in the official configuration file given by zhezheng
• sapp_name: same as above
• page_id: the unique ID of each page. You can use the page component name because it is also unique in the project
• page_name: the Chinese name of each page, just the Chinese name of the page in vue
• page_url: the Url of the page. The route of the page can be transmitted from vue

My processing method is to add a meta to each page route on the route side, including ID and title attributes, so that each page can get the page only by passing the route when calling the encapsulation method_ id,page_name,page_url. For example:
​

Packaging method:

I created a baseaplus JS file. The specific contents are as follows. There are two points to note:

1. settings is a configuration file. I put sapp_id and SAP_ Name is written in it
2. Local cache is an encapsulated cache class. When the application is opened for the first time, the obtained user information of Zhejiang Zhengpin is cached in localStorage. getUserInfoCache is to obtain the cached user information.
3. In the embedding point of member nickname and member ID, pay attention to the case. The small hump is returned on the Zhejiang political nail document, and the deserialized back-end on my side has become a large hump, which needs attention here. It depends on your situation.

import GLOBAL from '../settings'
import { getUserInfoCache } from './local-cache'

/**
 * Add foundation buried point
 * @param {object} route route
 */
export function addBaseAplus(route) {
    //Foundation buried point
    // Single page application or "single page" needs to supplement PV log parameters asynchronously, and the following embedding points are also required:
    aplus_queue.push({
        action: "aplus.setMetaInfo",
        arguments: ["aplus-waiting", "MAN"],
    });

    // Execute sendPV after routing switching of single page application or after asynchronously obtaining the parameters required by pv log:
    aplus_queue.push({
        action: "aplus.sendPV",
        arguments: [
            {
                is_auto: false,
            },
            {
                // Your current app information, please do not modify these two lines
                sapp_id: GLOBAL.sapp_id,
                sapp_name: GLOBAL.sapp_name,
                // User defined PV parameter key value pairs (only such tiled json, not multi-layer nesting), such as:
                page_id: route.meta.id,
                page_name: route.meta.title,
                page_url: route.path,
            },
        ],
    });

    //User information embedding point
    // If collecting user information is asynchronous, you need to execute the BLOCK embedding point first
    aplus_queue.push({
        action: 'aplus.setMetaInfo',
        arguments: ['_hold', 'BLOCK']
    });

    let userInfo = getUserInfoCache();

    // Set member nickname
    aplus_queue.push({
        action: "aplus.setMetaInfo",
        arguments: ["_user_nick", userInfo.NickNameCn]
    });

    // Set member ID
    aplus_queue.push({
        action: "aplus.setMetaInfo",
        arguments: ["_user_id", userInfo.AccountId]
    });

    // dd.getUUID().then(res => {
    //     aplus_queue.push({
    //         action: "aplus.setMetaInfo",
    //         arguments: ["_dev_id", "device ID is business defined and used to define a unique device ID. this is not required at present and can not be set."]
    //     });
    // })

    // If collecting user information is asynchronous, you need to set the user information before executing the START embedding point
    // At this time, the logs block ed will be sent out one by one with user information
    aplus_queue.push({
        action: 'aplus.setMetaInfo',
        arguments: ['_hold', 'START']
    });
}

Page call

Every page should be called like this!!!
Every page should be called like this!!!
Every page should be called like this!!!

4, The buried point is partially successful

After the embedding point is completed, wait for the data update of the embedding point of zhezheng nail. The group says it usually looks like five or six in the afternoon. Then you can go to Appropriate to take Check the buried point on the.
Basically, the stability monitoring can be successful. If the reference in the flow analysis appears on the left, it indicates that it is successful. If it appears on the right, it indicates that it is only partially successful and needs to be checked. For example:

Successful examples:

Failure example:

Troubleshooting method

Can refer to https://www.yuque.com/docs/share/a2ca4143-dba7-4b8e-8bf5-f0746a7214c3#ljnli In the document, submit the log API block document.
But for those students who haven't checked, they don't know if they see the log according to the method in the document. As the comment in the document says, "listen to your words, such as listening to your words", the writing is not generally difficult to understand.

In fact, the new students just don't know what the focus of the log is. Just understand this. In fact, this has been mentioned in the "precautions h and FAQ s for embedding points" in the document.

We can exclude one by one:

• Ensure that the methods encapsulated in the previous section "basic embedded points and user information embedded points" are called on each page.
• page_id,page_name,page_ Check URL, user information and other parameters. Ensure page_ Unique ID (check routing configuration), page_url and page_name filled in as required.
• Ensure that user information is reported. In fact, most of it may be because_ user_ Caused by an empty ID.

Since the registration free authorization code cannot be obtained locally through dd.getAuthCode({}), this method can only be called in Zhejiang Zhengpin environment or proprietary pin environment, so the user information cannot be obtained locally.
However, we can add a log at the back-end user information interface to record the login free authorization code passed in, then write the value to the front-end, bypass the dd.getAuthCode({}) method and directly call the user information interface, so that we can get the user information of Zhejiang political nail or proprietary nail locally. Then you can follow Language bird document Get the report log as mentioned above. Check whether these items (page_id, page_name, page_url and user information) are transmitted.

After understanding, whether it is not so difficult to find out.
​

Write at the end

If you don't think it's clear, you can put it forward. I'll try to add it again, so that everyone can understand it as much as possible.
If this article solves your buried point problem, please praise it.
After stepping on the pit, you will feel how happy it is if someone can give advice!
Finally, looking at the hair falling on the table, I feel much stronger!!

If you think this article is helpful to you, please pay attention to my official account.