websharper webgl 演示安全问题？答案

【问题标题】：websharper webgl demo security issue?websharper webgl 演示安全问题？
【发布时间】：2016-04-19 03:00:22
【问题描述】：

玩了一下 websharper 并尝试让 webgl demo 在我的系统上运行。我修改了给定的演示代码，以便可以在 SinglePage 应用程序中使用它。另外，我将演示使用的纹理更改为我系统上实际拥有的纹理。

let MakeAndBindTexture (gl : WebGL.RenderingContext) f =
    Img []
    |>! Events.OnLoad (fun img ev ->
        let tex = gl.CreateTexture()
        gl.ActiveTexture(gl.TEXTURE0)
        gl.BindTexture(gl.TEXTURE_2D, tex)
        gl.PixelStorei(gl.UNPACK_FLIP_Y_WEBGL, 1)
        gl.TexImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, img.Dom)
        gl.TexParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR)
        gl.TexParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR)
        f ())
    |> fun img -> img -< [Attr.Src "mandel.jpg"] // <<-- located in project root
    |> ignore

用谷歌浏览器测试它，（不涉及网络服务器 - 从项目根文件夹运行 index.html，我得到以下错误日志：

SinglePageApplication1.min.js:42 Uncaught SecurityError: Failed to execute 'texImage2D' on 'WebGLRenderingContext': the cross-origin image at file:///E:/R/playground/ConsoleApplication7/SinglePageApplication1/mandel.jpg 可能未加载。

另一方面，Microsoft Edge 成功运行并产生了预期的结果。

现在，我当然想知道，与其他路径相同的 .jpg 如何会导致 google chrome 出现安全错误。

另外，我想知道我是否有机会让它在谷歌浏览器中运行，不知何故......

我还尝试了 mandel.jpg 的其他位置，例如 ...min.js 文件旁边。但是所有位置都产生了相同的错误。

【问题讨论】：

标签： google-chrome f# webgl websharper

【解决方案1】：

Chrome 对本地网页 in order to protect you from attacks where you may open a malicious webpage locally, for example because someone sent it to you as an email attachment 执行非常严格的同源策略。

换句话说，假设文件SinglePageApplication1.min.js 是由不受信任的来源发送给您的。是否应该允许加载（并可能监视/修改）文件mandel.jpg？也许您只是碰巧将.js 文件放在了Documents 文件夹中，而mandel.jpg 是您也保存在那里的私人文档。所以 Chrome 说不，不能访问。

出于开发目的，您有两种选择，详见here：

通过使用 --allow-file-access-from-files 标志启动 Chrome 来禁用安全措施
在本地网络服务器（Suave 或 IIS）上安装您的 SPA，并通过 http://localhost/ 访问它

【讨论】：

有道理 - 答案，但在我看来，这是他们做出的一个非常随机的决定。因此，无服务器 html 在加载之前是可以的……嗯……不……脚本加载有效……并且…… css 文件加载有效……但是无法加载图像？在我看来，他们应该克服它并拒绝从本地文件系统加载任何内容。
问题是谁正在加载。 Chrome 信任 它自己的渲染引擎 来加载和显示文件而不会做任何恶意的事情 (duh)，但它不知道某些随机脚本真正在做什么。因此，来自不同文件的<img> 标记可以正常显示，但脚本既不能直接加载图像，也不能访问该标记的内容（其来源不同）。
他说什么，但*不要使用那面旗帜！！！存在它是有原因的“安装像Suave或IIS这样的服务器不需要巨大的痛苦。如果你在Linux或OSX上，只需cd到包含文件的文件夹并输入python -m SimpleHTTPServer。如果你'在任何操作系统上，另一个选项是devd。超级简单。一个小文件，它就可以工作。