Pannellum JS连接到Azure BLOB MVC时出现的CORS问题

Question

我使用Pannellum js在我的MVC应用程序中显示图像。目前，我正在使用本地文件服务器来存储和显示图像。现在，我已将所有图像移动到Azure BLOB容器。

问题是我在从blob检索图像时遇到CORS错误：

​

​

我已经在网上查看了很多解决方案。但我的情况是他们都不管用。我已经使用"createCORSRequest“为XMLHttpRequest设置了全局CORS规则，但不起作用。我还在配置中设置了<add name="Access-Control-Allow-Origin" value="*" />，并为我的方法设置了AllowCrossSiteJsonAttribute。

作为参考，我的BLOB URL、https://inspecttv.blob.core.windows.net和我的站点是https://www.inspectanytime.tv/

下面是我将BLOB图像传递给Json并以某种方式传递给JavaScript的代码。

string Json = "[";
                    string Photos = "";
                    //string SiteUrl = "http://inspectanytime.azurewebsites.net";

                    foreach (tblAT_PropertyImage tbl in LST)
                    {
                        string thumbimage = tbl.Photo.ToString().Substring(0, tbl.Photo.ToString().LastIndexOf('.')) + "_thumb" + tbl.Photo.ToString().Substring(tbl.Photo.ToString().LastIndexOf('.'));
                        string FullImage = AzureCloud.GetFileFromCloud(tbl.Photo, AzureCloud.AzureContainers.inspectimagefiles); // SiteUrl + "/ViewerImage.ashx?p=" + tbl.Photo;

                        string Thumb = AzureCloud.GetFileFromCloud(thumbimage, AzureCloud.AzureContainers.inspectimagefiles); //SiteUrl + "/ViewerThumb.ashx?p=" + tbl.Photo;
                        string SinglePhoto = "{\"image\":\"" + FullImage + "\",\"imageThumb\":\"" + Thumb + "\",\"description\":\"" + tbl.Tag + "\",\"Address\":\"" + Address + "\"}";
                        if (Photos != "")
                        {
                            Photos += "," + SinglePhoto;
                        }
                        else
                        {
                            Photos += SinglePhoto;
                        }
                    }
                    Json += Photos;
                    Json += "]";

Answer 1

问题出在CORS上。这篇来自Mozilla的文章，列举并深入解释了CORS的实现。

https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS

如果这不是生产站点，您可以使用https://crossorigin.me/

只需将http: //someurl/panorama.jpg替换为https: //Crosssorigin.me/http: //someurl/panorama.jpg