Html “解析 'srcset' 属性值失败,因为它的 'w' 描述符无效”是什么意思。意思?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/31074180/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-29 11:42:13  来源:igfitidea点击:

What does "Failed parsing 'srcset' attribute value since its 'w' descriptor is invalid." mean?

htmlwordpress

提问by Doug

I get Chrome errors on my website that say:

我在我的网站上收到 Chrome 错误,内容为:

Failed parsing 'srcset' attribute value since its 'w' descriptor is invalid.
Dropped srcset candidate http://i2.wp.com/domain.net/wp-content/.../image.jpg?resize=425%2C200

解析“srcset”属性值失败,因为它的“w”描述符无效。
删除了 srcset 候选 http://i2.wp.com/domain.net/wp-content/.../image.jpg?resize=425%2C200

Any idea what this means?

知道这是什么意思吗?

I am using WordPress as my website platform. I also use its Photon feature (within its Jetpack framework). My suspicion is that it has to do with this feature. Are image dimensions getting specified incorrectly or something?

我使用 WordPress 作为我的网站平台。我还使用了它的 Photon 功能(在它的 Jetpack 框架内)。我怀疑它与此功能有关。图像尺寸是否被错误地指定?

What are 'w' descriptors?

什么是“w”描述符?



UPDATE: Here is the HTML:

更新:这是HTML:

<img src="http://i1.wp.com/gaithersburgpsychologist.net/wp-content/uploads/2015/02/lightbulb.jpg?resize=425%2C200"
   srcset="http://i1.wp.com/gaithersburgpsychologist.net/wp-content/uploads/2015/02/lightbulb.jpg?resize=425%2C200 w, http://i1.wp.com/gaithersburgpsychologist.net/wp-content/uploads/2015/02/lightbulb.jpg?resize=450%2C320 w"
   sizes="(min-width: 768px) 720px, (min-width: 992px) 700px, (min-width: 1200px) 850px, calc(100vw-20px)"
   alt="Change your thoughts and you change your world.">

回答by SandroMarques

I had a similar error:

我有一个类似的错误:

failed parsing srcset attribute value since it has an unknown descriptor

解析 srcset 属性值失败,因为它有一个未知的描述符

and the problem was caused by a spacein the image path URL.

问题是由图像路径 URL 中的空格引起的。

回答by oligofren

tldr; Your html is invalid and you are missing the actual width number.

tldr; 您的 html 无效,并且您缺少实际的宽度数。

This is a valid img tag with srcset:

这是一个带有 srcset 的有效 img 标签:

<img src="phone.jpg" srcset="phone-small.jpg 256w, phone-big.jpg 512w" />

It says that if your browser understands srcsetit should use the small image when the width is approx 256 px wide, and the bigger image when it is 512 px wide.

它说,如果您的浏览器理解srcset它应该在宽度约为 256 像素宽时使用小图像,而在宽度为 512 像素时使用更大的图像。

In your image tag you have nothing in front of the w:

在您的图像标签中,您前面没有任何内容w

srcset="http://...resize=425%2C200 w, ...

srcset="http://...resize=425%2C200 w, ...

Notice there is nothing specifying the width? That's the problem. Change it to something like 600wto use the pic for screen widths of 600 pixels, etc.

注意没有指定宽度?那就是问题所在。将其更改为类似600w将图片用于 600 像素的屏幕宽度等。

回答by Guillaume Le Mière

In my case I was generating my srcset using a webpack loader called srcset-loaderwho was outputing a JSON object instead of a proper string.

在我的例子中,我使用名为srcset-loader的 webpack 加载器生成我的 srcset ,它输出 JSON 对象而不是正确的字符串。

回答by Eli

In my case, as with all cases above the image URL was corrupt:

就我而言,与上述所有情况一样,图像 URL 已损坏:

Example:

例子:

https://aaaa.aaaa.com/?somequery

Replacing /? with ? helped.

替换 /? 和 ?有帮助。