Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(59)

Issues Search
    My Issues | Starred     Open | Closed | All

Side by Side Diff: chrome/common/extensions/docs/contentSecurityPolicy.html

Issue 9212044: Improving `content_security_policy` documentation. (Closed) Base URL: svn://svn.chromium.org/chrome/trunk/src
Patch Set: Created 8 years, 11 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch | Annotate | Revision Log
« no previous file with comments | « no previous file | chrome/common/extensions/docs/examples/tutorials/analytics.zip » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
1 <!DOCTYPE html><!-- This page is a placeholder for generated extensions api doc. Note: 1 <!DOCTYPE html><!-- This page is a placeholder for generated extensions api doc. Note:
2 1) The <head> information in this page is significant, should be uniform 2 1) The <head> information in this page is significant, should be uniform
3 across api docs and should be edited only with knowledge of the 3 across api docs and should be edited only with knowledge of the
4 templating mechanism. 4 templating mechanism.
5 3) All <body>.innerHTML is genereated as an rendering step. If viewed in a 5 3) All <body>.innerHTML is genereated as an rendering step. If viewed in a
6 browser, it will be re-generated from the template, json schema and 6 browser, it will be re-generated from the template, json schema and
7 authored overview content. 7 authored overview content.
8 4) The <body>.innerHTML is also generated by an offline step so that this 8 4) The <body>.innerHTML is also generated by an offline step so that this
9 page may easily be indexed by search engines. 9 page may easily be indexed by search engines.
10 --><html xmlns="http://www.w3.org/1999/xhtml"><head> 10 --><html xmlns="http://www.w3.org/1999/xhtml"><head>
11 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 11 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
12 <link href="css/ApiRefStyles.css" rel="stylesheet" type="text/css"> 12 <link href="css/ApiRefStyles.css" rel="stylesheet" type="text/css">
13 <link href="css/print.css" rel="stylesheet" type="text/css" media="print"> 13 <link href="css/print.css" rel="stylesheet" type="text/css" media="print">
14 <script type="text/javascript" src="../../../third_party/jstemplate/jstempla te_compiled.js"> 14 <script type="text/javascript" src="../../../third_party/jstemplate/jstempla te_compiled.js">
15 </script> 15 </script>
16 <script type="text/javascript" src="js/api_page_generator.js"></script> 16 <script type="text/javascript" src="js/api_page_generator.js"></script>
17 <script type="text/javascript" src="js/bootstrap.js"></script> 17 <script type="text/javascript" src="js/bootstrap.js"></script>
18 <script type="text/javascript" src="js/sidebar.js"></script> 18 <script type="text/javascript" src="js/sidebar.js"></script>
19 <title>Tutorial: Google Analytics - Google Chrome Extensions - Google Code</ti tle></head> 19 <title>Content Security Policy (CSP) - Google Chrome Extensions - Google Code< /title></head>
20 <body> <div id="gc-container" class="labs"> 20 <body> <div id="gc-container" class="labs">
21 <div id="devModeWarning"> 21 <div id="devModeWarning">
22 You are viewing extension docs in chrome via the 'file:' scheme: are you expecting to see local changes when you refresh? You'll need run chrome with -- allow-file-access-from-files. 22 You are viewing extension docs in chrome via the 'file:' scheme: are you expecting to see local changes when you refresh? You'll need run chrome with -- allow-file-access-from-files.
23 </div> 23 </div>
24 <!-- SUBTEMPLATES: DO NOT MOVE FROM THIS LOCATION --> 24 <!-- SUBTEMPLATES: DO NOT MOVE FROM THIS LOCATION -->
25 <!-- In particular, sub-templates that recurse, must be used by allowing 25 <!-- In particular, sub-templates that recurse, must be used by allowing
26 jstemplate to make a copy of the template in this section which 26 jstemplate to make a copy of the template in this section which
27 are not operated on by way of the jsskip="true" --> 27 are not operated on by way of the jsskip="true" -->
28 <div style="display:none"> 28 <div style="display:none">
29 29
(...skipping 224 matching lines...) Expand 10 before | Expand all | Expand 10 after
254 <li><a href="hosting.html">Hosting</a></li> 254 <li><a href="hosting.html">Hosting</a></li>
255 <li><a href="external_extensions.html">Other Deployment Option s</a></li> 255 <li><a href="external_extensions.html">Other Deployment Option s</a></li>
256 </ul> 256 </ul>
257 </li> 257 </li>
258 </ul> 258 </ul>
259 </li> 259 </li>
260 <li><h2><a href="apps.html">Packaged Apps</a></h2></li> 260 <li><h2><a href="apps.html">Packaged Apps</a></h2></li>
261 <li><h2><a href="tutorials.html">Tutorials</a></h2> 261 <li><h2><a href="tutorials.html">Tutorials</a></h2>
262 <ul> 262 <ul>
263 <li><a href="tut_debugging.html">Debugging</a></li> 263 <li><a href="tut_debugging.html">Debugging</a></li>
264 <li class="leftNavSelected">Google Analytics</li> 264 <li><a href="tut_analytics.html">Google Analytics</a></li>
265 <li><a href="tut_oauth.html">OAuth</a></li> 265 <li><a href="tut_oauth.html">OAuth</a></li>
266 </ul> 266 </ul>
267 </li> 267 </li>
268 <li><h2>Reference</h2> 268 <li><h2>Reference</h2>
269 <ul> 269 <ul>
270 <li>Formats 270 <li>Formats
271 <ul> 271 <ul>
272 <li><a href="manifest.html">Manifest Files</a></li> 272 <li><a href="manifest.html">Manifest Files</a></li>
273 <li><a href="match_patterns.html">Match Patterns</a></li> 273 <li><a href="match_patterns.html">Match Patterns</a></li>
274 </ul> 274 </ul>
(...skipping 13 matching lines...) Expand all
288 </ul> 288 </ul>
289 </li> 289 </li>
290 </ul> 290 </ul>
291 </div> 291 </div>
292 <script> 292 <script>
293 initToggles(); 293 initToggles();
294 </script> 294 </script>
295 295
296 <div class="g-unit" id="gc-pagecontent"> 296 <div class="g-unit" id="gc-pagecontent">
297 <div id="pageTitle"> 297 <div id="pageTitle">
298 <h1 class="page_title">Tutorial: Google Analytics</h1> 298 <h1 class="page_title">Content Security Policy (CSP)</h1>
299 </div> 299 </div>
300 <!-- TABLE OF CONTENTS --> 300 <!-- TABLE OF CONTENTS -->
301 <div id="toc"> 301 <div id="toc">
302 <h2>Contents</h2> 302 <h2>Contents</h2>
303 <ol> 303 <ol>
304 <li> 304 <li>
305 <a href="#toc-requirements">Requirements</a> 305 <a href="#H2-0">Default Policy Restrictions</a>
306 <ol>
307 <li>
308 <a href="#H3-1">Inline JavaScript will not be executed</a>
abarth-chromium 2012/01/24 16:42:36 Also, eval is banned.
Mike West 2012/01/25 16:08:29 I note that down in the body. This line is just th
309 </li><li>
310 <a href="#H3-2">Only local script and and object resources are loaded</a>
311 </li>
312 </ol>
313 </li><li>
314 <a href="#H2-3">Relaxing the default policy</a>
306 <ol> 315 <ol>
307 <li style="display: none; "> 316 <li style="display: none; ">
308 <a>h3Name</a> 317 <a>h3Name</a>
309 </li> 318 </li>
310 </ol> 319 </ol>
311 </li><li> 320 </li><li>
312 <a href="#toc-installing">Installing the tracking code</a> 321 <a href="#H2-4">Tightening the default policy</a>
313 <ol> 322 <ol>
314 <li style="display: none; "> 323 <li style="display: none; ">
315 <a>h3Name</a> 324 <a>h3Name</a>
316 </li>
317 </ol>
318 </li><li>
319 <a href="#toc-tracking-pageviews">Tracking page views</a>
320 <ol>
321 <li style="display: none; ">
322 <a>h3Name</a>
323 </li>
324 </ol>
325 </li><li>
326 <a href="#toc-debugging">Monitoring analytics requests</a>
327 <ol>
328 <li style="display: none; ">
329 <a>h3Name</a>
330 </li>
331 </ol>
332 </li><li>
333 <a href="#toc-tracking-events">Tracking events</a>
334 <ol>
335 <li style="display: none; ">
336 <a>h3Name</a>
337 </li>
338 </ol>
339 </li><li>
340 <a href="#toc-samplecode">Sample code</a>
341 <ol>
342 <li style="display: none; ">
343 <a>h3Name</a>
344 </li> 325 </li>
345 </ol> 326 </ol>
346 </li> 327 </li>
347 <li style="display: none; "> 328 <li style="display: none; ">
348 <a href="#apiReference">API reference</a> 329 <a href="#apiReference">API reference</a>
349 <ol> 330 <ol>
350 <div></div> 331 <div></div>
351 <div></div> 332 <div></div>
352 <div></div> 333 <div></div>
353 <div></div> 334 <div></div>
354 </ol> 335 </ol>
355 </li> 336 </li>
356 </ol> 337 </ol>
357 </div> 338 </div>
358 <!-- /TABLE OF CONTENTS --> 339 <!-- /TABLE OF CONTENTS -->
359 340
360 <!-- Standard content lead-in for experimental API pages --> 341 <!-- Standard content lead-in for experimental API pages -->
361 <p id="classSummary" style="display: none; "> 342 <p id="classSummary" style="display: none; ">
362 For information on how to use experimental APIs, see the <a href="expe rimental.html">chrome.experimental.* APIs</a> page. 343 For information on how to use experimental APIs, see the <a href="expe rimental.html">chrome.experimental.* APIs</a> page.
363 </p> 344 </p>
364 345
365 <!-- STATIC CONTENT PLACEHOLDER --> 346 <!-- STATIC CONTENT PLACEHOLDER -->
366 <div id="static"><div id="pageData-name" class="pageData">Tutorial: Goog le Analytics</div> 347 <div id="static"><div id="pageData-name" class="pageData">Content Securi ty Policy (CSP)</div>
367 <div id="pageData-showTOC" class="pageData">true</div> 348 <div id="pageData-showTOC" class="pageData">true</div>
368 349
369 <p>This tutorial demonstrates using Google Analytics to track the usage of your 350 <p>
370 extension.</p> 351 Content Security Policy is a language used to describe restrictions on the
371 352 content that can be loaded and executed by your extension. In order to
372 <h2 id="toc-requirements">Requirements</h2> 353 mitigate a large class of potental cross-site scripting issues, Chrome's
373 <p> 354 extension system enforces a fairly strict <strong>Content Security Policy
374 This tutorial expects that you have some familiarity writing extensions for 355 (CSP)</strong> that has a few impacts on the way you build extensions and
375 Google Chrome. If you need information on how to write an extension, please 356 applications.
376 read the <a href="gettingstarted.html">Getting Started tutorial</a>. 357 </p>
377 </p> 358
378 359 <p>
379 <p> 360 In general, CSP works as a black/whitelisting mechanism for resources loaded
380 You will also need a <a href="http://www.google.com/analytics">Google 361 or execute by your extensions. Defining a reasonable policy for your extension
381 Analytics account</a> set up to track your extension. Note that when setting 362 enables you to carefully consider the resources that your extension requires,
382 up the account, you can use any value in the Website's URL field, as your 363 and to ask the browser to ensure that those are the only resources your
383 extension will not have an URL of its own. 364 extension has access to. These policies provide security over and above the
384 </p> 365 <a href="manifest.html#permissions">host permissions</a> your extension
385 366 requests; they're an additional layer of protection, not a replacement.
386 <p style="text-align: center"> 367 </p>
387 <img src="images/tut_analytics/screenshot01.png" style="width:400px;height:82p x;" alt="The analytics setup with info for a chrome extension filled out."> 368
388 </p> 369 <p>
389 370 On the web, such a policy is defined via an HTTP header or <code>meta</code>
390 <p> 371 element. Inside Chrome's extension system, neither is an appropriate
391 Also note that Google Analytics requires version <strong>4.0.302.2</strong> 372 mechanism. Instead, an extension's policy is defined via the extension's
392 of Google Chrome to work correctly. Users with an earlier version of Google 373 <a href="manifest.html"><code>manifest.json</code></a> file as follows:
393 Chrome will not show up on your Google Analytics reports. View 374 </p>
394 <a href="faq.html#faq-dev-14">this FAQ entry</a> to learn how to check which 375
395 version of Google Chrome is deployed to which platform. 376 <pre>{
396 </p> 377 ...,
397 378 "content_security_policy": "[POLICY STRING GOES HERE]"
398 <h2 id="toc-installing">Installing the tracking code</h2> 379 ...
399 380 }</pre>
400 <p> 381
401 The standard Google Analytics tracking code snippet fetches a file named 382 <p class="note">
402 <code>ga.js</code> from an SSL protected URL if the current page 383 For full details regarding CSP's syntax, please take a look at
403 was loaded using the <code>https://</code> protocol. <strong>It is strongly 384 <a href="http://dvcs.w3.org/hg/content-security-policy/raw-file/tip/csp-specif ication.dev.html">
404 advised to use the SSL protected ga.js in an extension</strong>, 385 the Content Security Policy specification
405 but Google Chrome extension 386 </a>.
406 pages are hosted under <code>chrome-extension://</code> URLs, so the tracking 387 </p>
407 snippet must be modified slightly to pull <code>ga.js</code> directly from 388
408 <code>https://ssl.google-analytics.com/ga.js</code> instead of the default 389 <a name="H2-0"></a><h2>Default Policy Restrictions</h2>
409 location. 390
410 </p> 391 <p>
411 392 By default, Chrome defines a content security policy of:
412 <p> 393 </p>
413 Below is a modified snippet for the 394
414 <a href="http://code.google.com/apis/analytics/docs/tracking/asyncTracking.htm l">asynchronous 395 <pre>script-src 'self'; object-src 'self'</pre>
415 tracking API</a> (the modified line is bolded): 396
416 </p> 397 <p>
417 398 This policy limits extensions in two ways:
418 <pre>(function() { 399 </p>
419 var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.asy nc = true; 400
420 <strong>ga.src = 'https://ssl.google-analytics.com/ga.js';</strong> 401 <a name="H3-1"></a><h3>Inline JavaScript will not be executed</h3>
421 var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore( ga, s); 402
422 })(); 403 <p>
423 </pre> 404 Inline JavaScript, as well as dangerous string-to-JavaScript methods like
424 405 <code>eval</code>, will not be executed. This restriction bans both inline
425 <p> 406 <code>&lt;script&gt;</code> blocks <strong>and</strong> inline event handlers
426 Here is a background page which loads the asynchronous tracking code and 407 (e.g. <code>&lt;button onclick="..."&gt;</code>).
427 tracks a single page view: 408 </p>
428 </p> 409
429 410 <p>
430 <pre>&lt;!DOCTYPE html&gt; 411 The first restriction wipes out a huge class of cross-site scripting attacks
431 &lt;html&gt; 412 by making it impossible for you to accidentally execute script provided by a
432 &lt;head&gt; 413 malicious third-party. It does, however, require you to write your code with a
433 ... 414 clean separation between content and behavior (which you should of course do
434 &lt;/head&gt; 415 anyway, right?). An example might make this clearer. You might try to write a
435 &lt;body&gt; 416 <a href="browserAction.html#popups">Browser Action's popup</a> as a single
436 &lt;script&gt; 417 <code>popup.html</code> containing:
437 var _gaq = _gaq || []; 418 </p>
438 _gaq.push(['_setAccount', 'UA-XXXXXXXX-X']); 419
439 _gaq.push(['_trackPageview']); 420 <pre>&lt;!doctype html&gt;
440 421 &lt;html&gt;
441 (function() { 422 &lt;head&gt;
442 var ga = document.createElement('script'); ga.type = 'text/javascript'; g a.async = true; 423 &lt;title&gt;My Awesome Popup!&lt;/title&gt;
443 ga.src = 'https://ssl.google-analytics.com/ga.js'; 424 &lt;script&gt;
444 var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBe fore(ga, s); 425 function clickHandler(element) {
445 })(); 426 // Do something awesome with `element`!
446 &lt;/script&gt; 427 }
447 428 &lt;/script&gt;
448 ... 429 &lt;/head&gt;
449 &lt;/body&gt; 430 &lt;body&gt;
450 &lt;/html&gt; 431 &lt;button onclick="clickHandler(this)"&gt;Click for awesomeness!&lt;/button &gt;
451 </pre> 432 &lt;/body&gt;
452 433 &lt;/html&gt;</pre>
453 <p> 434
454 Keep in mind that the string <code>UA-XXXXXXXX-X</code> should be replaced 435 <p>
455 with your own Google Analytics account number. 436 Two things will need to change in order to make this work the way you expect
456 </p> 437 it to. First, the <code>clickHandler</code> definition needs to move into an
457 438 external JavaScript file (<code>popup.js</code> would be a good target).
458 <h2 id="toc-tracking-pageviews">Tracking page views</h2> 439 Second, the inline event handler definition must be rewritten in terms of
459 440 <code>addEventListener</code> and extracted into <code>popup.js</code>. This
460 <p> 441 might look something like the following:
461 The <code>_gaq.push(['_trackPageview']);</code> code will track a single 442 </p>
462 page view. This code may be used on any page in your extension. When 443
463 placed on a background page, it will register a view once per browser 444 <pre>popup.js:
464 session. When placed on a popup, it will register a view once every time 445 =========
465 the popup is opened. 446
466 </p> 447 function clickHandler(e) {
467 448 // Do something awesome with `e.target`!
468 <p> 449 }
469 By looking at the page view data for each page in your extension, you can 450
470 get an idea of how many times your users interact with your extension per 451 // Add event listeners once the DOM has fully loaded by listening for the
471 browser session: 452 // `DOMContentLoaded` event on the docuent, and adding your listeners to
472 </p> 453 // specific elements when it triggers.
473 454 document.addEventListener('DOMContentLoaded', function () {
474 <p style="text-align: center"> 455 document.querySelector('button').addEventListener('click', clickHandler);
475 <img src="images/tut_analytics/screenshot02.png" style="width:300px;height:119 px;" alt="Analytics view of the top content for a site."> 456 });
476 </p> 457
477 458 popup.html:
478 <h2 id="toc-debugging">Monitoring analytics requests</h2> 459 ===========
479 460
480 <p> 461 &lt;!doctype html&gt;
481 To ensure that tracking data from your extension is being sent to Google 462 &lt;html&gt;
482 Analytics, you can inspect the pages of your extension in the 463 &lt;head&gt;
483 Developer Tools window (see the 464 &lt;title&gt;My Awesome Popup!&lt;/title&gt;
484 <a href="tut_debugging.html">debugging tutorial</a> for more information). 465 &lt;script src="popup.js"&gt;&lt;/script&gt;
485 As the following figure shows, you should see requests for a file named 466 &lt;/script&gt;
486 <strong>__utm.gif</strong> if everything is set up correctly. 467 &lt;/head&gt;
487 </p> 468 &lt;body&gt;
488 469 &lt;button&gt;Click for awesomeness!&lt;/button&gt;
489 <p style="text-align: center"> 470 &lt;/body&gt;
490 <img src="images/tut_analytics/screenshot04.png" style="width:683px;height:418 px;" alt="Developer Tools window showing the __utm.gif request"> 471 &lt;/html&gt;</pre>
491 </p> 472
492 473 <a name="H3-2"></a><h3>Only local script and and object resources are loaded</h3 >
493 <h2 id="toc-tracking-events">Tracking events</h2> 474
494 475 <p>
495 <p> 476 Script and object resources can only be loaded from the extension's
496 By configuring event tracking, you can determine which parts of your 477 package, not from the web at large. This ensures that your extension only
497 extension your users interact with the most. For example, if you have 478 executes the code you've specifically approved, preventing an active network
498 three buttons users may click: 479 attacker from maliciously redirecting your request for a resource.
499 </p> 480 </p>
500 481
501 <pre> &lt;button&gt;Button 1&lt;/button&gt; 482 <p>
502 &lt;button&gt;Button 2&lt;/button&gt; 483 Instead of writing code that depends on jQuery (or any other library) loading
503 &lt;button&gt;Button 3&lt;/button&gt; 484 from an external CDN, consider including the specific version of jQuery in
504 </pre> 485 your extension package. That is, instead of:
505 486 </p>
506 <p> 487
507 Write a function that sends click events to Google Analytics: 488 <pre>&lt;!doctype html&gt;
508 </p> 489 &lt;html&gt;
509 490 &lt;head&gt;
510 <pre> function trackButton(button_id) { 491 &lt;title&gt;My Awesome Popup!&lt;/title&gt;
511 _gaq.push(['_trackEvent', 'button' + button_id, 'clicked']); 492 &lt;script src="<strong>http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jq uery.min.js</strong>"&gt;&lt;/script&gt;
512 }; 493 &lt;/script&gt;
513 </pre> 494 &lt;/head&gt;
514 495 &lt;body&gt;
515 <p> 496 &lt;button&gt;Click for awesomeness!&lt;/button&gt;
516 And call it when each button is pressed: 497 &lt;/body&gt;
517 </p> 498 &lt;/html&gt;</pre>
518 499
519 <pre> &lt;button onclick="trackButton(1);"&gt;Button 1&lt;/button&gt; 500 <p>
520 &lt;button onclick="trackButton(2);"&gt;Button 2&lt;/button&gt; 501 Download the file, include it in your package, and write:
521 &lt;button onclick="trackButton(3);"&gt;Button 3&lt;/button&gt; 502 </p><p>
522 </pre> 503
523 504 </p><pre>&lt;!doctype html&gt;
524 <p> 505 &lt;html&gt;
525 The Google Analytics event tracking overview page will give you metrics 506 &lt;head&gt;
526 regarding how many times each individual button is clicked: 507 &lt;title&gt;My Awesome Popup!&lt;/title&gt;
527 </p> 508 &lt;script src="<strong>jquery.min.js</strong>"&gt;&lt;/script&gt;
528 509 &lt;/script&gt;
529 <p style="text-align: center"> 510 &lt;/head&gt;
530 <img src="images/tut_analytics/screenshot03.png" style="width:300px;height:482 px;" alt="Analytics view of the event tracking data for a site."> 511 &lt;body&gt;
531 </p> 512 &lt;button&gt;Click for awesomeness!&lt;/button&gt;
532 513 &lt;/body&gt;
533 <p> 514 &lt;/html&gt;</pre>
534 By using this approach, you can see which parts of your extension are 515
535 under-or-overutilized. This information can help guide decisions about UI 516 <a name="H2-3"></a><h2>Relaxing the default policy</h2>
536 redesigns or additional functionality to implement. 517
537 </p> 518 <p>
538 519 There is no mechanism for relaxing the restriction against executing inline
539 <p> 520 JavaScript. In particular, setting a script policy that includes
540 For more information about using the event tracking API, see the 521 <code>unsafe-inline</code> will have no effect. This is intentional.
541 Google Analytics 522 </p>
542 <a href="http://code.google.com/apis/analytics/docs/tracking/eventTrackerOverv iew.html">developer 523
543 documentation</a>. 524 <p>
544 </p> 525 If, on the other hand, you have a need for some external JavaScript or object
545 526 resources, you can relax the policy to a limited extent by whitelisting
546 <h2 id="toc-samplecode">Sample code</h2> 527 specific HTTPS origins from which scripts should be accepted. Only HTTPS
547 528 origins will be accepted, whitelisting insecure HTTP resources will have no
548 <p> 529 effect. This is intentional.
abarth-chromium 2012/01/24 16:42:36 Maybe explain why allowing HTTP scripts would be p
Mike West 2012/01/25 16:08:29 Good idea. I've added a sentence or two, and linke
549 A sample extension that uses these techniques is 530 </p>
550 available in the Chromium source tree: 531
551 </p> 532 <p>
552 533 A relaxed policy definition which allows script resources to be loaded from
553 <blockquote> 534 <code>https://example.com/</code> might look like:
554 <a href="http://src.chromium.org/viewvc/chrome/trunk/src/chrome/common/extensi ons/docs/examples/tutorials/analytics/">.../examples/tutorials/analytics/</a> 535 </p>
555 </blockquote> 536
556 <p></p> 537 <pre>{
538 ...,
539 "content_security_policy": "script-src 'self' https://example.com; object-src 'self'",
540 ...
541 }</pre>
542
543 <p class="note">
544 Note that both <code>script-src</code> and <code>object-src</code> are defined
545 by the policy. Chrome will not accept a policy that doesn't limit each of
546 these values to (at least) <code>'self'</code>.
547 </p>
548
549 <p>
550 Making use of Google Analytics is the canonical example for this sort of
551 policy definition. It's common enough that we've provided an Analytics
552 boilerplate of sorts in the <a href="samples.html#analytics">Event Tracking
553 with Google Analytics</a> sample extension, and a
554 <a href="tut_analytics.html">brief tutorial</a> that goes into more detail.
555 </p>
556
557 <a name="H2-4"></a><h2>Tightening the default policy</h2>
558
559 <p>
560 You may, of course, tighten this policy to whatever extent your extension
561 allows in order to increase security at the expense of convinience. To specify
562 that your extension can only load resources of <em>any</em> type (images, etc)
563 from its own package, for example, a policy of <code>default-src 'self'</code>
564 would be appropriate. The <a href="samples.html#mappy">Mappy</a> sample
565 extension is a good example of an extension that's been locked down above and
566 beyond the defaults.
567 </p>
557 </div> 568 </div>
558 569
559 <!-- API PAGE --> 570 <!-- API PAGE -->
560 <div class="apiPage" style="display: none; "> 571 <div class="apiPage" style="display: none; ">
561 <a name="apiReference"></a> 572 <a name="apiReference"></a>
562 <h2>API reference: chrome.apiname </h2> 573 <h2>API reference: chrome.apiname </h2>
563 574
564 <!-- PROPERTIES --> 575 <!-- PROPERTIES -->
565 <div class="apiGroup"> 576 <div class="apiGroup">
566 <a name="properties"></a> 577 <a name="properties"></a>
(...skipping 195 matching lines...) Expand 10 before | Expand all | Expand 10 after
762 _uff=0; 773 _uff=0;
763 urchinTracker(); 774 urchinTracker();
764 } 775 }
765 catch(e) {/* urchinTracker not available. */} 776 catch(e) {/* urchinTracker not available. */}
766 </script> 777 </script>
767 <!-- end analytics --> 778 <!-- end analytics -->
768 </div> 779 </div>
769 </div> <!-- /gc-footer --> 780 </div> <!-- /gc-footer -->
770 </div> <!-- /gc-container --> 781 </div> <!-- /gc-container -->
771 </body></html> 782 </body></html>
OLDNEW
« no previous file with comments | « no previous file | chrome/common/extensions/docs/examples/tutorials/analytics.zip » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698