http头-Azure blob中的Web VTT标题即使在启用CORS后也不起作用

我想用mp4视频播放.vtt字幕文件http://attendedstorage.com/videotest2.html

但是，.vtt是否托管Azure blob尚未显示。我已经在Chrome和IE10中进行了测试。

我确实设置了"内容类型：txt/vtt"。

这个问题有三个部分：

1）浏览器没有根据Chrome开发工具读取.vtthttp://cropme.ru/a672cceae9962b975f15b6ddacfe061e-我需要帮助弄清楚为什么。。。

2）我还为blob服务启用了CORS。但是，当我无法使用以下工具设置"Access Control Allow Origin:*"或"Access Control Allow Origin:*.attendedstorage.com"时：

根据http://cropme.ru/546c699f8a1264994c18a624eeaa5060-Cerebrata AMS-设置CORS，但没有可用于设置"访问控制允许来源：*"的http标头http://cropme.ru/20ac02af8b883e7cf09f4f076e137770

根据http://cropme.ru/f95fbbcf94c26b65f48163ee4dc98194-Zudio-无法设置"Access Control Allow Origin:*"每http://cropme.ru/bad39b334aad865a20ac016f981038be-Cloudberry-允许设置"Access Control Allow Origin:*"，但在查看是否已注册时不保留它。

我还没有达到我知道如何直接使用API的水平，所以我更喜欢使用工具。

3）我还在azure网站的视频文件夹中测试了mp4和vtt，但即使在同一个域上，vtt也无法识别。域标题下方：

    WEBVTT HEADER 
    Remote Address:137.117.84.54:80
    Request URL:http://attendedstorage.com/test3.vtt
    Request Method:GET
    Status Code:404 Not Found
    Request Headersview source
    Accept:*/*
    Accept-Encoding:gzip,deflate,sdch
    Accept-Language:en-US,en;q=0.8
    Cache-Control:no-cache
    Connection:keep-alive
    Host:attendedstorage.com
    Pragma:no-cache
    Referer:http://attendedstorage.com/videotest3.html
    User-Agent:Mozilla/5.0 (Windows NT 5.1) AppleWebKit/537.36 (KHTML, like Gecko)              
    Chrome/34.0.1847.116 Safari/537.36
    Response Headersview source
    Content-Length:103
    Content-Type:text/html
    Date:Sun, 20 Apr 2014 23:49:36 GMT
    Server:Microsoft-IIS/8.0
    X-Powered-By:ASP.NET
    MP4 VIDEO HEADER
    Request URL:http://attendedstorage.com/test3.mp4
    Request Headers CAUTION: Provisional headers are shown.
    Accept-Encoding:identity;q=1, *;q=0
    Cache-Control:no-cache
    Pragma:no-cache
    Range:bytes=0-
    Referer:http://attendedstorage.com/videotest3.html
    User-Agent:Mozilla/5.0 (Windows NT 5.1) AppleWebKit/537.36 (KHTML, like Gecko) 
    Chrome/34.0.1847.116 Safari/537.36

更新：我已经修改了http://attendedstorage.com/videotest3.html测试将视频链接到轨道（意味着这不应该在同一域原点）http://attendedstorage.com/test3.mp4和https://attendedstorage.com/test3.vtt.以下是Chrome控制台所说的：

    InText track from origin 'https://assetsattendedstorage.com'has been blocked from loading:         
    Not at same origin as the document, and parent of track element does not have a 'crossorigin' 
    attribute. Origin 'http://attendedstorage.com' is therefore not allowed access. 
    videotest3.html:1
    GET http://attendedstorage.com/test3.vtt 404 (Not Found) videotest3.html:1

这使我认为，为了解决上述问题的第3）部分，如果这是"跟踪元素的父元素"，我还需要在azure网站中设置http标头-我正在尝试在azure Powershell上阅读，但我更喜欢通过GUI或工具（如果存在的话）来进行设置，该工具允许我更改attendedstorage.com azure网站中的http标头，因为我需要一段时间才能理解Powershell。我仍然不明白为什么在这种情况下需要这样做，因为视频和音轨与html文件来自同一个域。这也留下了第2）部分的问题，因为我确实在blob中启用了CORS，但我无法使用工具更改blob中的http标头"Access Control Allow Origin:*"。

我在所有屏幕截图中注意到的一件事是，对于允许的原点，您试图将值设置为http://*.attendedstorage.com。我猜想是它造成了问题。在允许的来源中定义的URL应该与跨浏览器请求来源的实际URL完全匹配（这是区分大小写的）。来自documentation page:

AllowedOrigins:允许生成通过CORS针对存储服务的请求。源域是请求源自的域。请注意，原点必须是与用户年龄发送的来源完全区分大小写的匹配到服务。您也可以使用通配符"*"来允许所有源域通过CORS进行请求。在上面的例子中，域http://www.contoso.com和http://www.fabrikam.com可以使用CORS对服务进行请求。

您可以尝试指定实际域名（http://attendedstorage.com、https://attendedstorage.com），看看这是否有帮助。如果这不起作用，请尝试指定*（即允许所有域名）来缩小问题范围。

我不确定您的场景。然而，上周我在从JavaScript直接将内容/bob上传到云时也遇到了同样的问题。我的问题的解决方案是我创建SAS（安全访问签名）的方式，这是一个有用的MSDN博客帮助了我，也可能帮助到你们所有人。

我丢失的代码是

private static void ConfigureCors(ServiceProperties serviceProperties)
{
    serviceProperties.Cors = new CorsProperties();
    serviceProperties.Cors.CorsRules.Add(new CorsRule()
    {
        AllowedHeaders = new List<string>() { "*" },
        AllowedMethods = CorsHttpMethods.Put | CorsHttpMethods.Get | CorsHttpMethods.Head | CorsHttpMethods.Post,
        AllowedOrigins = new List<string>() { "*" },
        ExposedHeaders = new List<string>() { "*" },
        MaxAgeInSeconds = 1800 // 30 minutes
     });
}

它基本上为SASUrl添加了一些规则，我可以将我的文件上传到blob。

关于parent of track element does not have a 'crossorigin' attribute.问题，它不是指azure blob存储，而是指加载曲目的HTML文件。crossrorigin是要设置为<track >标记父级的属性，例如<video controls crossorigin="anonymous">。

如果您可以解决在azure中设置HTTP标头的问题，那么将属性crossrorigin添加到视频或音频标签应该可以解决整个问题。

相关内容

最新更新

热门标签：