在 Windows 8 Metro JavaScript App 中使用 jQuery 会导致安全错误 [英] Using jQuery with Windows 8 Metro JavaScript App causes security error

问题描述

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

Since it sounded like jQuery was an option for Metro JavaScript apps, I was starting to look forward to Windows 8 dev. I installed Visual Studio 2012 Express RC and started a new project (both empty and grid templates have the same problem).

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

I made a local copy of jQuery 1.7.2 and added it as a script reference.

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

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

Unfortunately, as soon as I ran the resulting app it tosses out a console error:

HTML1701:无法添加动态内容a"脚本试图注入动态内容，或之前动态修改的元素，这可能是不安全的.为了例如，使用 innerHTML 属性添加脚本或格式错误的 HTML会产生这个异常.使用 toStaticHTML 方法进行过滤动态内容，或显式创建元素和属性createElement 等方法.有关更多信息，请参阅http://go.microsoft.com/fwlink/?LinkID=247104.

HTML1701: Unable to add dynamic content ' a' A script attempted to inject dynamic content, or elements previously modified dynamically, that might be unsafe. For example, using the innerHTML property to add script or malformed HTML will generate this exception. Use the toStaticHTML method to filter dynamic content, or explicitly create elements and attributes with a method such as createElement. For more information, see http://go.microsoft.com/fwlink/?LinkID=247104.

我在非缩小版的 jQuery 中设置了一个断点，发现 违规行:

I slapped a breakpoint in a non-minified version of jQuery and found the offending line:

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

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

Apparently, the security model for Metro apps forbids creating elements this way. This error doesn't cause any immediate issues for the user, but given its location, I am worried it will cause capability-discovery tests in jQuery to fail that shouldn't.

我绝对想要 jQuery $.Deferred 来让一切变得更简单.我更希望能够使用选择器引擎和事件处理系统，但如果必须的话，我宁愿没有它们.

I definitely want jQuery $.Deferred for making just about everything easier. I would prefer to be able to use the selector engine and event handling systems, but I would live without them if I had to.

如何获得最新的 jQuery 以配合 Metro 开发?

How does one get the latest jQuery to play nicely with Metro development?

推荐答案

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

You need to edit the jQuery source so that you pass the jQuery.support function to MSApp.execUnsafeLocalFunction, which disables the unsafe content checking, like this:

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会自动执行它传递的函数.

You need to remember to remove the last pair of parenthesis - you don't need a self-executing function because execUnsafeLocalFunction automatically executes the function it is passed.

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

I suggest that a better approach is to use the WinJS features - this includes the WinJS.Promise object as an alternative to deferred operations (which are themselves an implementation of the Promise pattern). And you can do some basic DOM manipulation using the WinJS.Utilities namespace.

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

You should think twice about using jQuery for deferred operations. The WinJS.Promise object is used throughout the Metro APIs to represent async activities and you will end up using two similar-but-different approaches.

这篇关于在 Windows 8 Metro JavaScript App 中使用 jQuery 会导致安全错误的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！