您的位置：首页 > 网站推广 > 经验心得  >  MIP校验规则介绍 MIP校验规则是什么

MIP校验规则介绍 MIP校验规则是什么

 更新时间：2016年12月21日 21:01  点击：1936
MIP校验规则是什么，MIP页面会有严格的规范校验，不允许存在任何校验不通过的问题存在，下面小编将为大家详细介绍MIP校验规则。

本文档意在帮助开发者找到校验的内容和规则，快速定位校验不通过的原因。

MIP HTML 标签和属性错误

1. 缺少强制性标签

提示

MANDATORY_TAG_MISSING
错误说明 "The mandatory tag '%1' is missing or incorrect."
错误说明 强制性标签'xxx'缺失或错误
修复方法 添加（或者更正）强制性html标签

在MIP HTML中，强制性标签包括：

说明

备注
<!doctype html> 大小写均可
<html mip> 强制小写
<head> 强制小写
<meta charset="utf-8"> utf-8不区分大小写，无单引号或者双引号限制
<meta name="viewport" content="width=device-width,initial-scale=1"> 强制小写，无单引号或者双引号限制
< link rel="stylesheet" type="text/css" href="https://mipcache.bdstatic.com/static/v1/mip.css" > 强制小写，无单引号或者双引号限制，v1.1.1会根据版本不同而不同
<script src="https://mipcache.bdstatic.com/static/v1/mip.js" ></script > 强制小写，无单引号或者双引号限制，v1.1.2会根据版本不同而不同
<body> 强制小写
<link rel="canonical" href="http(s)://xxx"> 强制小写

PS：meta 标签 name="viewport" 时, content的值必须且最少含有 width=device-width, minimum-scale=1 以及 initial-scale=1这3个属性且顺序不固定。

2. 禁用标签

提示

DISALLOWED_TAG
错误说明 "The tag '%1' is disallowed."
错误说明 禁止使用'xx'标签
修复方法 删除禁用标签

大部分 HTML 标签都是允许使用的，禁用或者需要替换的标签使用请参考：MIP HTML规范

3. 无效属性值

提示

INVALID_ATTR_VALUE
错误说明 "The attribute '%1' in tag '%2' is set to the invalid value '%3'."
错误说明 标签'xx'中的属性'xx'的属性值'xx'无效
修复方法 修改为有效属性值

当html标签有属性值不正确的时候，会报这个错误。mip中需要注意的有：

a：href属性不允许使用javascript:协议，

a：target属性需要设置为_blank

mip-img

src：必须是一个url

mip-pix

src：必须是一个支持https的地址url，

如果选用百度云提供的https代理，url中带"t={TIME}&title={TITLE}&host={HOST}&from=baidu"

其他html基本页面属性规范不变

注意：

1. MIP HTML中的url强制是https的

2. <a>标签:

<a href="javascript:xxx()"></a> 错

- <a href="xxx" target="_blank"></a> 对

4. 属性值的无效值

提示

INVALID_PROPERTY_VALUE_IN_ATTR_VALUE
错误说明 "The property '%1' in attribute '%2' in tag '%3' is set to '%4', which is invalid."
错误说明 标签'xx'中存在属性'yy','yy'中存在属性'zz'，属性'zz'的属性值'aa'无效
修复方法 更正无效属性值

可能出现属性值的无效值的情况：

<meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">

width的属性值device-width

initial-scale的属性值1

<script type="application/ld+json"></script>

<script type="application/json"></script>

除了外链 MIP 所需 js，script标签的type的属性值应该为application/ld+json 或 application/json

注意：除上述给出的值外均为无效值

5. 缺少强制性属性

提示

MANDATORY_ONEOF_ATTR_MISSING
错误说明 "The tag '%1' is missing a mandatory attribute - pick one of %2."
错误说明 标签'xx'的强制性属性'xx'缺失
修复方法 添加正确是属性

例如 mip html中 mip-img 和 mip-pix具有强制性属性的src：

mip-img

src

mip-pix

src

6. 直接父标签错误

提示

WRONG_PARENT_TAG
错误说明 "The parent tag of tag '%1' is '%2', but it can only be '%3'."
错误说明 标签'a'的直接父标签应该是'b'，而不是'c'
修复方法 添加所需的父标签

有一些标签有制定的直接父标签，如下示例给出了每个标签必须的直接父标签：

!doctype 的直接父标签是 root

head 的直接父标签是 html

body 的直接父标签是 html

link 的直接父标签是 head

meta 的直接父标签是 head

style mip-custom 的直接父标签是 head

style 的直接父标签是 boilerplate

7. 非法父级标签

提示

DISALLOWED_TAG_ANCESTOR
错误说明 "The tag '%1' may not appear as a descendant of tag '%2'."
错误说明 标签'a'不应该是标签'b'的子标签
修复方法 删除非法嵌套标签

如：

<body>的子标签写在了<head>中

8. 强制父级标签

提示

MANDATORY_TAG_ANCESTOR
错误说明 "The tag '%1' may only appear as a descendant of tag '%2'."
错误说明 标签'a'只能是标签'b'的子级标签
修复方法 删除标签或者给标签添加正确的父级标签

img 必须是noscript的子级标签

video 必须是noscript的子级标签

audio 必须是noscript的子级标签

head 中使用 noscript 时必须作为head的最后一个子节点, body中的noscript没有限制

9. 唯一标签重复

提示

DUPLICATE_UNIQUE_TAG
错误说明 "The tag '%1' appears more than once in the document."
错误说明 标签'xx'只能出现一次
修复方法 删除多余的标签

一份html中，有的标签具有唯一性，也就是说只能出现一次，当html中有重复的唯一标签的时候，应该报错。

以下是唯一标签列表：

<doctype html>

<html mip>

<head>

<link rel="canonical" href=...>

<meta charset="utf-8">

<meta viewport>

<style mip-custom>

<body>

MIP校验工具地址：https://www.mipengine.org/validator/validate

本节的主要内容为MIP HTML规范说明，这是了解MIP的第一步，下面小编将为大家带来MIP HTML规范的详细说明介绍。

头部使用规范

  • 起始标签使用 <!doctype html>

  • html标签必须加上mip标记，即: <html mip>

  • 必须包含 <head>和 <body>标签

  • 必须在head标签中包含字符集声明: <meta charset="utf-8">，字符集统一为utf-8

  • 必须在head标签中包含viewport设置标签: <meta name="viewport" content="width=device-width,initial-scale=1">，推荐包含minimum-scale=1

  • 必须在head标签中包含 < link rel="stylesheet" type="text/css" href="https://mipcache.bdstatic.com/static/v1/mip.css" >

  • 必须在body标签中包含 <script src="https://mipcache.bdstatic.com/static/v1/mip.js" ></script >

  • 必须在head标签中包含 <link rel="canonical" href="http(s)://xxx" >

页面元素使用规范

MIP HTML 禁止使用对页面性能以及安全有较大影响的标签，请将其替换为MIP的特有标签（例如:将img标签替换为mip-img）:

标签 使用范围 备注
img 替换为mip-img
video 替换为mip-video
audio 替换为mip-audio
iframe 替换为mip-iframe
style 替换为<style mip-custom> 只能在head标签中使用一次
script 禁止使用 禁止使用script标签, 以下两种情况除外：1）外链mip组件所需js，2）type为 "application/ld+json" 或 "application/json"
svg 允许使用
button 允许使用
link 允许使用
a 允许使用,建议使用mip-link组件代替 不可以href="javascript:"，target必须设置为_blank
frame 禁止使用
frameset 禁止使用
object 禁止使用
param 禁止使用
applet 禁止使用
embed 禁止使用
form 替换为mip-form 内部允许使用input、textarea标签
input elements 禁止使用 包括: select, option

HTML 属性

  • MIP HTML 中所有on开头的属性都不允许使用，如：onclick，onmouseover。
  • MIP HTML 中允许使用on属性。
  • MIP HTML 中不允许使用style属性。

自定义样式使用规范

出于性能考虑，html 中不允许使用内联style，所有样式只能放到head 的 style 标签里。

正确：

<head>

<stylemip-custom>

p{color:#00f;}

</style>

</head>

<body>

<p>Hello World!</p>

</body>

错误：

<pstyle="color:#00f;">Hello World!</p>

验证规范

MIP校验工具地址：https://www.mipengine.org/validator/validate

本次一聚教程网为大家带来的是mip完整dome，让大家初步的了解mip加速是怎么实现的，下面请看详细的介绍。

完整DOME如下：

为防止js自动生成，所以使用了截图的形式。

1.jpg

本次为大家带来的是MIP加速原理介绍，将为您详细阐释MIP页面的加速原理，下面请看详细内容。

经过精心设计的JavaScript

为了去除臃肿的客户端脚本，MIP文件不允许自定义JavaScript；对一些强依赖JavaScript的功能（如：广告、统计和交互），MIP提供与MIP runtime兼容的封装好的组件来实现。

JavaScript 引用原则：

  • 目前MIP不允许用户自定义JavaScript，需要用MIP 组件的形式引进来，从而确保安全性和性能表现

  • 可以引用mip-iframe来引入实现部分富交互的功能，这样，即使开发时使用最影响性能的document.write，也不会影响主页面的渲染

  • MIP组件是开源的，允许开发者自定义功能组件，项目也将持续提供多样的组件，以适应不同的需求

所有静态资源需要标明尺寸

在页面开发时，资源常常不会被设定宽高，特别是使用广告或者通过调用 `document.write() 注入的时候。由于资源大小不能确定，页面经常要进行反复重新的绘制；

现在，MIP要求将所有的资源（广告、图片、音频和视频）标明尺寸。当资源真正加载时，所有资源大小可以被立即推断出并迅速的用于计算页面布局，加载中的资源将无缝呈现，不必因为页面频繁更新布局而影响到用户的阅读体验。

不允许任何机制阻止页面渲染

开发者的任何自定义脚本，都需要用MIP的tag反馈给MIP，例如mip-ad、mip-iframe等，这些方式不会阻塞页面的layout和渲染。

控制外部资源加载

MIP runtime会控制外部资源的额加载来确保其高效性，从而使用户想阅读的内容尽快出现在屏幕中。

封装交互功能

MIP提倡网页能给用户直接简单的体验，但这并不意味着MIP限制了页面的生动和有趣。MIP runtime提供了高度优化的被封装的JavaScript，开发者无需投入过多精力去实现复杂的交互功能。

只允许inline的css

css的加载，会阻止页面的渲染，css内联可以减少客户端的开销。

只允许GPU加速的动画

MIP只允许用transforms和opacity来完成动画效果，当动画能在GPU上执行时，仅触发渲染层合并。

MIP 缓存

MIP另一个重要的意义在于能够帮站长加速网页，百度将会把MIP网页缓存到百度CDN中。只要符合MIP标准，都可以使用MIP缓存。

开放且持续更新

MIP是一个开源项目，所有的标准并非一成不变。我们会持续不断进行优化，期待您的共同参与！

[!--infotagslink--]

相关文章

  • Nest.js参数校验和自定义返回数据格式详解

    这篇文章主要给大家介绍了关于Nest.js参数校验和自定义返回数据格式的相关资料，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧...2021-03-28

  • 校验非空的注解@NotNull如何取得自定义的message

    这篇文章主要介绍了校验非空的注解@NotNull如何取得自定义的message，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教...2021-09-29

  • 浅析Promise的介绍及基本用法

    Promise是异步编程的一种解决方案，在ES6中Promise被列为了正式规范，统一了用法，原生提供了Promise对象。接下来通过本文给大家介绍Promise的介绍及基本用法，感兴趣的朋友一起看看吧...2021-10-21

  • PHP YII框架开发小技巧之模型(models)中rules自定义验证规则

    YII的models中的rules部分是一些表单的验证规则，对于表单验证十分有用，在相应的视图（views）里面添加了表单，在表单被提交之前程序都会自动先来这里面的规则里验证，只有通过对其有效的限制规则后才能被提交，可以很有效地保证...2015-11-24

  • 详解element-ui 表单校验 Rules 配置 常用黑科技

    这篇文章主要介绍了element-ui 表单校验 Rules 配置 常用黑科技，本文通过实例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下...2020-07-11

  • 解决antd Form 表单校验方法无响应的问题

    这篇文章主要介绍了解决antd Form 表单校验方法无响应的问题，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧...2020-10-28

  • PHP中print_r、var_export、var_dump用法介绍

    文章详细的介绍了关于PHP中print_r、var_export、var_dump区别比较以及这几个在php不同的应用中的用法，有需要的朋友可以参考一下 可以看出print_r跟var_export都...2016-11-25

  • Framewrok7 视图介绍（views、view）使用介绍

    下面我们来看一篇关于Framewrok7 视图介绍（views、view）使用介绍吧，希望这篇文章能够帮助到各位朋友。 一、Views 与View的介绍 1，Views (<div class="views">) （1）Vi...2016-10-02

  • vue实现滑块拖拽校验功能的全过程

    vue验证滑块功能,在生活中很多地方都可以见到,使用起来非常方便,这篇文章主要给大家介绍了关于vue实现滑块拖拽校验功能的相关资料,需要的朋友可以参考下...2021-08-04

  • Monolog PHP日志类库使用详解介绍

    PHP日志类库在低版本中我们都没有看到了但在高版本的php中就有了，下面我们来看一篇关于PHP日志类库使用详解介绍吧． Monolog遵循PSR3的接口规范，可以很轻易的替换...2016-11-25

  • c#栈变化规则图解示例(栈的生长与消亡)

    多数情况下我们不需要关心栈的变化，下文会给出一个具体的示例。另外，理解栈的变化对于理解作用域也有一定的好处，因为C#的局部变量作用域是基于栈的。...2020-06-25

  • php获取当前url地址的方法介绍

    这篇文章介绍了php获取当前url地址的方法小结，有兴趣的同学可以参考一下 本文实例讲述了php获取当前url地址的方法。分享给大家供大家参考，具体如下： js 获取： ...2017-01-22

  • 不错的mod_perl编程的简单应用实例介绍

    介绍性指南 mod_perl 是个庞大而复杂的工具，它内建了许多模块帮助你方便地构建动态网站。这篇指南的目的是帮助你构建一个良好的 mod_perl 模块，并从中理解 mod_perl 的实现...2020-06-29

  • PHP-GTK 介绍及其应用

    1. PHP-GTK介绍 1.1 PHP-GTK PHP-GTK是PHP的延伸模组，它可以让程式设计师写出在客户端执行的、且独立的GUI的程式。这个模组不允许在浏览器上显视GTK+的程式，它一开始就...2016-11-25

  • PHP 获取文件目录权限函数fileperms介绍

    在php中要获取或目录权限我们可使用fileperms函数来获取，fileperms() 函数返回文件或目录的权限,。若成功，则返回文件的访问权限。若失败，则返回 false。 例子 1 ...2016-11-25

  • 详解javascript传统方法实现异步校验

    这篇文章主要为大家介绍了javascript实现异步校验的方法，感兴趣的小伙伴们可以参考一下...2016-01-24

  • 解决Mybatis-plus找不到对应表及默认表名命名规则的问题

    这篇文章主要介绍了解决Mybatis-plus找不到对应表及默认表名命名规则的问题,本文给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下...2020-11-18

  • php设置时区方法介绍

    php默认时区是欧美国家的所以与我们中国时区相差了整整8小时哦，下面我来给各位介绍php设置时区方法，有需要了解的朋友可进入参考。 在 php.ini 中，默认是 date.timez...2016-11-25

  • yii2中的rules 自定义验证规则详解

    yii2的一个强大之处之一就是他的Form组件，既方便又安全。本文给大家介绍yii2中的rules 自定义验证规则，需要的朋友参考下...2016-04-23

  • OpenCart网站迁移步骤详细介绍

    OpenCart是国外著名的开源电子商务系统，由英国人Daniel一人独立开发，其社区非常活跃，由各国网友翻译出来的语言包已经达到18种，其中包括中文，俄文，法文，西班牙文，德文等等，下面...2016-10-10