| OLD | NEW |
|---|
| (Empty) | |
| 1 <meta name="doc-family" content="apps"> |
| 2 <h1 class="page_title">Understand the Architecture</h1> |
| 3 <div id="pageData-showTOC" class="pageData">true</div> |
| 4 <p> |
| 5 Packaged apps integrate closely with a user’s operating system. |
| 6 They are designed to be run outside of a browser tab, |
| 7 to run robustly in offline and poor connectivity scenarios and |
| 8 to have far more powerful capabilities than are available |
| 9 in a typical web browsing environment. |
| 10 The app container, programming, and security models |
| 11 support these packaged app requirements. |
| 12 </p> |
| 13 <h2 id="container">App container model</h2> |
| 14 <p> |
| 15 The app container describes the visual appearance |
| 16 and loading behavior of packaged apps. |
| 17 Packaged apps look different than traditional web apps |
| 18 because the app container does not show any traditional web page UI controls; |
| 19 it simply contains a blank rectangular area. |
| 20 This allows an app to blend with “native” apps on the system, |
| 21 and it prevents the user from “messing” with the app logic |
| 22 by manually changing the URL. |
| 23 </p> |
| 24 <p> |
| 25 Packaged apps are loaded differently than web apps. |
| 26 Both load the same type of content: |
| 27 HTML documents with CSS and JavaScript; |
| 28 however, a packaged app is loaded in the app container, |
| 29 not in the browser tab. |
| 30 Also, the app container must load the main document |
| 31 of the packaged app from a local source. |
| 32 This forces all packaged apps to be at least minimally functional |
| 33 when offline and it provides a place |
| 34 to enforce stricter security measures. |
| 35 </p> |
| 36 <img src="{{static}}/images/container.png" |
| 37 width="671" |
| 38 height="172" |
| 39 alt="how app container model works"> |
| 40 <h2 id="programming">Programming model</h2> |
| 41 <p> |
| 42 The programming model describes the lifecycle |
| 43 and window behavior of packaged apps. |
| 44 Similar to native apps, |
| 45 the goal of this programming model is to give users |
| 46 and their systems full control over the app lifecycle. |
| 47 The packaged app lifecycle should be independent |
| 48 of browser window behavior or a network connection. |
| 49 </p> |
| 50 <p> |
| 51 The “event page” manages the packaged app lifecycle |
| 52 by responding to user gestures and system events. |
| 53 This page is invisible, only exists in the background, |
| 54 and can be closed automatically by the system runtime. |
| 55 It controls how windows open and close and |
| 56 when the app is started or terminated. |
| 57 There can only be one “event page” for a packaged app. |
| 58 <p> |
| 59 <p> |
| 60 <iframe title="YouTube video player" width="610" height="380" src="http://www.yo
utube.com/embed/yr1jgREbH8U" frameborder="0" allowfullscreen></iframe> |
| 61 </p> |
| 62 <h3>App lifecycle at a glance</h3> |
| 63 <p> |
| 64 For detailed instructions on how to use the programming model, |
| 65 see <a href="app_lifecycle.html">Manage App Lifecycle</a>. |
| 66 Here's a brief summary of the packaged app lifecyle |
| 67 to get you started: |
| 68 </p> |
| 69 <br> |
| 70 <table border="0"> |
| 71 <tr> |
| 72 <th scope="col"> Stage </th> |
| 73 <th scope="col"> Summary </th> |
| 74 </tr> |
| 75 <tr> |
| 76 <td>Installation</td> |
| 77 <td>User chooses to install the app and explicitly accepts the |
| 78 <a href="manifest.html#permissions">permissions</a>. |
| 79 </td> |
| 80 </tr> |
| 81 <tr> |
| 82 <td>Startup</td> |
| 83 <td>The event page is loaded, |
| 84 the 'launch' event fires, |
| 85 and app pages open in windows. |
| 86 You |
| 87 <a href="app_lifecycle.html#eventpage">create the windows</a> |
| 88 that your app requires, |
| 89 how they look, and how they communicate |
| 90 with the event page and with other windows. |
| 91 </td> |
| 92 </tr> |
| 93 <tr> |
| 94 <td>Termination</td> |
| 95 <td>User can terminate apps at any time |
| 96 and app can be quickly restored to previous state. |
| 97 <a href="app_lifecycle.html#H3-7">Stashing data</a> |
| 98 protects against data loss.</td> |
| 99 </tr> |
| 100 <tr> |
| 101 <td>Update</td> |
| 102 <td>Apps can be updated at any time; |
| 103 however, the code that a packaged app is running |
| 104 cannot change during a startup/termination cycle.</td> |
| 105 </tr> |
| 106 <tr> |
| 107 <td>Uninstallation</td> |
| 108 <td>User can actively uninstall apps. |
| 109 When uninstalled, no executing code or |
| 110 private data is left behind.</td> |
| 111 </tr> |
| 112 </table> |
| 113 <h2 id="security">Security model</h2> |
| 114 <p> |
| 115 The packaged apps security model protects users |
| 116 by ensuring their information is managed |
| 117 in a safe and secure manner. |
| 118 <a href="app_csp.html">Comply with CSP</a> |
| 119 includes detailed information on how to comply with content security policy. |
| 120 This policy blocks dangerous scripting |
| 121 reducing cross-site scripting bugs |
| 122 and protecting users against man-in-the-middle attacks. |
| 123 </p> |
| 124 <p> |
| 125 Loading the packaged app main page locally provides a place |
| 126 to enforce stricter security than the web. |
| 127 Like Chrome extensions, |
| 128 users must explicitly agree to trust the packaged app on install; |
| 129 they grant the app permission to access and use their data. |
| 130 Each API that your app uses will have its own permission. |
| 131 The packaged apps security model also provides the ability |
| 132 to set up privilege separation on a per window basis. |
| 133 This allows you to minimize the code in your app |
| 134 that has access to dangerous APIs, |
| 135 while still getting to use them. |
| 136 </p> |
| 137 <p> |
| 138 Packaged apps reuse Chrome extension process isolation, |
| 139 and take this a step further by isolating storage and external content. |
| 140 Each app has its own private storage area |
| 141 and can’t access the storage of another app |
| 142 or personal data (such as cookies) for websites that you use in your browser. |
| 143 All external processes are isolated from the app. |
| 144 Since iframes run in the same process as the surrounding page, |
| 145 they can only be used to load other app pages. |
| 146 You can use the <code>object</code> tag to |
| 147 <a href="app_external.html">embed external content</a>; |
| 148 this content runs in a separate process from the app. |
| 149 </p> |
| 150 <p> |
| 151 <iframe title="YouTube video player" width="610" height="380" src="http://www.yo
utube.com/embed/EDtiWN42lHs" frameborder="0" allowfullscreen></iframe> |
| 152 </p> |
| 153 <p class="backtotop"><a href="#top">Back to top</a></p> |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 10832042:
Extensions Docs Server: Doc conversion script (Closed)
Base URL: svn://svn.chromium.org/chrome/trunk/src