I recently ported one of my java script projects to Windows store app and got the error as following<\/p>\n
CSP14321: Resource violated directive ‘script-src ms-appx: ‘unsafe-eval’ blob:’ in Host Defined Policy: inline script, in ms-appx:\/\/13bdc914-5111-4c95-a5e6-82029c5105ec\/index.html at line 21 column 12. Resource will be blocked.<\/p><\/blockquote>\n
If you have something like the following, it won’t work<\/p>\n
<a href=\"javascript:void(0)\" id=\"somelink\" onclick=\"callMethod();\">Link<\/a><\/pre>\nSince I was using jQuery in the project, I simply used\u00a0jQuery to bind click event to the element<\/p>\n
$(\"#somelink\").click(function () {\r\n callMethod();\r\n});\r\n<\/pre>\nand Voila, everything works but I had many pages which had this reference and I had to make this change to all pages. After some research I found that there is an alternate way which is much faster to change. By default\u00a0ms-appx:\/\/\/<\/strong>\u00a0protocol is used in store apps to fetch the content. For web apps specify a specific protocal\u00a0ms-appx-web <\/strong>which is then used for the app. This can be done by changing start page from index.html<\/strong> to\u00a0ms-appx-web:\/\/\/index.html <\/strong>in package.appxmanifest. Also add\u00a0highlighted rule in your package.appxmanifest (You will need to\u00a0modify it in coding\u00a0view and not the visual editor)<\/p>\n
<?xml version=\"1.0\" encoding=\"utf-8\"?>\r\n<Package xmlns=\"http:\/\/schemas.microsoft.com\/appx\/manifest\/foundation\/windows10\" xmlns:mp=\"http:\/\/schemas.microsoft.com\/appx\/2014\/phone\/manifest\" xmlns:uap=\"http:\/\/schemas.microsoft.com\/appx\/manifest\/uap\/windows10\" IgnorableNamespaces=\"uap mp\">\r\n <Identity Name=\"1xxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx\" Version=\"1.0.0.0\" Publisher=\"CN=User\" \/>\r\n <mp:PhoneIdentity PhoneProductId=\"xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx\" PhonePublisherId=\"00000000-0000-0000-0000-000000000000\" \/>\r\n <Properties>\r\n <DisplayName>Application<\/DisplayName>\r\n <PublisherDisplayName>User<\/PublisherDisplayName>\r\n <Logo>images\\storelogo.png<\/Logo>\r\n <\/Properties>\r\n <Dependencies>\r\n <TargetDeviceFamily Name=\"Windows.Universal\" MinVersion=\"10.0.0.0\" MaxVersionTested=\"10.0.0.0\" \/>\r\n <\/Dependencies>\r\n <Resources>\r\n <Resource Language=\"x-generate\" \/>\r\n <\/Resources>\r\n <Applications>\r\n <Application Id=\"App\" StartPage=\"ms-appx-web:\/\/\/index.html\">\r\n <uap:VisualElements DisplayName=\"MyApp\" Description=\"My App Description\" BackgroundColor=\"transparent\" Square150x150Logo=\"images\\Square150x150Logo.png\" Square44x44Logo=\"images\\Square44x44Logo.png\">\r\n <uap:DefaultTile Wide310x150Logo=\"images\\Wide310x150Logo.png\">\r\n <\/uap:DefaultTile>\r\n <uap:SplashScreen Image=\"images\\splashscreen.png\" \/>\r\n <\/uap:VisualElements>\r\n <uap:ApplicationContentUriRules>\r\n <uap:Rule Match=\"ms-appx-web:\/\/\/\" Type=\"include\" WindowsRuntimeAccess=\"all\" \/>\r\n <\/uap:ApplicationContentUriRules>\r\n <\/Application>\r\n <\/Applications>\r\n <Capabilities>\r\n <Capability Name=\"internetClient\" \/>\r\n <\/Capabilities>\r\n<\/Package><\/pre>\nQuick and easy..<\/p>\n
<\/p>\n","protected":false},"excerpt":{"rendered":"
I recently ported one of my java script projects to Windows store app and got the error as following CSP14321: Resource violated directive ‘script-src ms-appx: ‘unsafe-eval’ blob:’ in Host Defined Policy: inline script, in ms-appx:\/\/13bdc914-5111-4c95-a5e6-82029c5105ec\/index.html at line 21 column 12. Resource will be blocked. If you have something like the following, it won’t work <a href=”javascript:void(0)” id=”somelink” onclick=”callMethod();”>Link<\/a> Since I was using jQuery in the project, I simply used\u00a0jQuery to bind click event to the element $(“#somelink”).click(function () { callMethod(); }); and Voila, everything works but I had many pages which had this reference and I had to make this change to all pages. After some research I found that there is an alternate way which is much faster to change. By default\u00a0ms-appx:\/\/\/\u00a0protocol is used in store apps to fetch the content. For web apps specify a specific protocal\u00a0ms-appx-web which is then used for the app. This can be done[…]<\/p>\n","protected":false},"author":5,"featured_media":1540,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[14,23,24,17,21],"tags":[],"class_list":["post-833","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-how-to","category-html","category-javascript","category-jquery","category-windows-store-app"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/www.netexl.com\/blog\/wp-json\/wp\/v2\/posts\/833","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.netexl.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.netexl.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.netexl.com\/blog\/wp-json\/wp\/v2\/users\/5"}],"replies":[{"embeddable":true,"href":"https:\/\/www.netexl.com\/blog\/wp-json\/wp\/v2\/comments?post=833"}],"version-history":[{"count":2,"href":"https:\/\/www.netexl.com\/blog\/wp-json\/wp\/v2\/posts\/833\/revisions"}],"predecessor-version":[{"id":836,"href":"https:\/\/www.netexl.com\/blog\/wp-json\/wp\/v2\/posts\/833\/revisions\/836"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.netexl.com\/blog\/wp-json\/wp\/v2\/media\/1540"}],"wp:attachment":[{"href":"https:\/\/www.netexl.com\/blog\/wp-json\/wp\/v2\/media?parent=833"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.netexl.com\/blog\/wp-json\/wp\/v2\/categories?post=833"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.netexl.com\/blog\/wp-json\/wp\/v2\/tags?post=833"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}