# Web\&H5接入APM
#### Web\&H5接入APM
1. 登录[APM控制台](https://console.huaweicloud.com/apm2/)。
2. 在左侧导航栏选择"前端监控 \> 前端站点"，单击"接入前端站点"。 
   
   
   
3. 选择"Web\&H5"，选择所属应用，输入站点名称，用于区分前端站点。单击"创建前端站点"，完成操作。 
   ![](https://support.huaweicloud.com/usermanual-apm2/public_sys-resources/note_3.0-zh-cn.png)
   - 创建前端站点成功后，appId会自动生成。
   
   - 站点名称填写前，"创建前端站点"按钮置灰。
   
   - 前端站点创建成功后，在"前端监控 \> 前端站点"操作列单击"编辑"，可以查看SDK拓展配置项参数对应的参数。 
     
   
   - 前端监控数据通过自动生成的appId上报，没有经过有效鉴权，可能产生脏数据。
    
   
   
4. 接入业务埋码探针。 
   复制下方代码，将其粘贴在Index.html的\<body\>中。注意，需要将代码粘贴在\<body\>内容的第一行。
   - 固定版本接入。
     ```
     <script>
         !function(x, n) {
           window[n] = window[n] || {};
           window[n].config = { domain: "https://rum.rnd.*****.com",appId: "",apiRepo: true,thirdApi: true,hashMode: true,JsErrClean: true,smartJsErr: true,webResource: true,traceType: "apm"};
         var o = document.createElement('script');
         o.src = x, o.async = !0;
         var d = document.body.firstChild;
         document.body.insertBefore(o, d);
       }('https://test-static-resource.obs.*****.ulanqab.****.com/js-agent/jsagent.min.js', '__fr');
     </script>
     ```
     
   
   - 最新版本接入。
     ```
     <script>
         !function(x, n) {
           window[n] = window[n] || {};
           window[n].config = { domain: "https://rum.rnd.****.com",appId: "",apiRepo: true,thirdApi: true,hashMode: true,JsErrClean: true,smartJsErr: true,webResource: true,traceType: "apm"};
         var o = document.createElement('script');
         o.src = x, o.async = !0;
         var d = document.body.firstChild;
         document.body.insertBefore(o, d);
       }('https://test-static-resource.obs.****.ulanqab.****.com/js-agent/jsagent.min.js', '__fr');
     </script>
     ```