在Windows 8 Metro JavaScript App中使用jQuery会导致安全性错误

Question

由于听起来jQuery是Metro JavaScript应用程序的一个选项,我开始期待Windows 8开发.我安装了Visual Studio 2012 Express RC并启动了一个新项目(空模板和网格模板都有同样的问题).

我制作了jQuery 1.7.2的本地副本,并将其添加为脚本参考.

<!-- SomeTestApp references -->
<link href="/css/default.css" rel="stylesheet" />
<script src="/js/jquery-1.7.2.js"></script>
<script src="/js/default.js"></script>

不幸的是,只要我运行生成的应用程序,它就会抛出一个控制台错误:

HTML1701:无法添加动态内容'a'脚本试图注入可能不安全的动态内容或先前动态修改的元素.例如,使用innerHTML属性添加脚本或格式错误的HTML将生成此异常.使用toStaticHTML方法过滤动态内容,或使用createElement等方法显式创建元素和属性.有关详细信息,请参阅 http://go.microsoft.com/fwlink/?LinkID=247104.

我在一个非缩小版本的jQuery中打了一个断点,发现了令人讨厌的行:

div.innerHTML = "   <link/><table></table><a href='/a' style='top:1px;float:left;opacity:.55;'>a</a><input type='checkbox'/>";

显然,Metro应用程序的安全模型禁止以这种方式创建元素.此错误不会对用户造成任何直接问题,但考虑到其位置,我担心它会导致jQuery中的功能发现测试失败,而不应该.

我绝对希望jQuery $.Deferred能让所有事情变得更轻松.我宁愿能够使用选择器引擎和事件处理系统,但如果必须的话我会没有它们.

如何让最新的jQuery与Metro开发很好地配合？

Answer 1

您需要编辑jQuery源代码,以便将jQuery.support函数传递给MSApp.execUnsafeLocalFunction,这将禁用不安全的内容检查,如下所示:

jQuery.support = MSApp.execUnsafeLocalFunction(function() {

    var support,
        all,
        a,
        select,
        opt,
        input,
        fragment,
        tds,
        events,
        eventName,
        i,
        isSupported,
        div = document.createElement( "div" ),
        documentElement = document.documentElement;


    // lots of statements removed for brevity

    return support;
});

您需要记住删除最后一对括号 - 您不需要execUnsafeLocalFunction自动执行函数,因为它会自动执行它传递的函数.

我建议更好的方法是使用WinJS功能 - 这包括WinJS.Promise对象作为延迟操作的替代(它们本身是Promise模式的实现).您可以使用WinJS.Utilities命名空间进行一些基本的DOM操作.

你应该三思而后行使用jQuery进行延迟操作.该WinJS.Promise对象在整个Metro API中用于表示异步活动,您最终将使用两种相似但不同的方法.

Answer 2

Here is your answer

https://github.com/appendto/jquery-win8

Its official jquery library for windows 8

Answer 3

为了它的价值,我已经移植了大部分jQuery核心来包装原生的WinJS库.它是轻量级的,并提供jQuery所做的一切,添加了一些徽章,通知等插件.

这是一项正在进行中的工作,但我正在努力让一些人加入其中.

https://github.com/rmcvey/winjq

快速撰写(正在添加文档):http://practicaljs.com/jquery-in-windows-8-apps/

Answer 4

在最近的// Build/2012会议之后,本次会谈讨论了如何在Windows 8 Store Apps中使用jQuery.具体来说,他们谈论innerHTML内部脚本注入的确切例外,并讨论在此完成的更新.

AppendTo公司还在该演讲期间正式推出了针对Windows 8的jQuery.从链接中的演讲中给出的演示看起来很整洁.

他们还说在本地环境中从CDN获取Windows 8应用程序的jQuery并不是一个好主意!

Answer 5

GitHub上的JavaScript动态内容填充程序是由Microsoft Open Technologies创建和发布的,用于解决此错误.它尚未经过jQuery测试,但最有可能解决您的问题.在运行任何其他脚本之前,在应用程序开头引用winstore-jscompat.js文件,您不应再看到此错误.