OLD | NEW |
1 {{+bindTo:partials.standard_nacl_article}} | 1 {{+bindTo:partials.standard_nacl_article}} |
2 | 2 |
3 <section id="running"> | 3 <section id="running"> |
4 <span id="devcycle-running"></span><h1 id="running"><span id="devcycle-running">
</span>Running</h1> | 4 <span id="devcycle-running"></span><h1 id="running"><span id="devcycle-running">
</span>Running</h1> |
5 <div class="contents local" id="contents" style="display: none"> | 5 <div class="contents local" id="contents" style="display: none"> |
6 <ul class="small-gap"> | 6 <ul class="small-gap"> |
7 <li><a class="reference internal" href="#introduction" id="id5">Introduction</a>
</li> | 7 <li><a class="reference internal" href="#introduction" id="id6">Introduction</a>
</li> |
8 <li><a class="reference internal" href="#portable-native-client-pnacl-applicatio
ns" id="id6">Portable Native Client (PNaCl) applications</a></li> | 8 <li><a class="reference internal" href="#portable-native-client-pnacl-applicatio
ns" id="id7">Portable Native Client (PNaCl) applications</a></li> |
9 <li><a class="reference internal" href="#native-client-applications-and-the-chro
me-web-store" id="id7">Native Client applications and the Chrome Web Store</a></
li> | 9 <li><a class="reference internal" href="#native-client-applications-and-the-chro
me-web-store" id="id8">Native Client applications and the Chrome Web Store</a></
li> |
10 <li><p class="first"><a class="reference internal" href="#prerequisites" id="id8
">Prerequisites</a></p> | 10 <li><p class="first"><a class="reference internal" href="#prerequisites" id="id9
">Prerequisites</a></p> |
11 <ul class="small-gap"> | 11 <ul class="small-gap"> |
12 <li><a class="reference internal" href="#browser-and-pepper-versions" id="id9">B
rowser and Pepper versions</a></li> | 12 <li><a class="reference internal" href="#browser-and-pepper-versions" id="id10">
Browser and Pepper versions</a></li> |
13 <li><a class="reference internal" href="#chrome-cache" id="id10">Chrome Cache</a
></li> | 13 <li><a class="reference internal" href="#chrome-cache" id="id11">Chrome Cache</a
></li> |
14 </ul> | 14 </ul> |
15 </li> | 15 </li> |
16 <li><p class="first"><a class="reference internal" href="#requirements" id="id11
">Requirements</a></p> | 16 <li><p class="first"><a class="reference internal" href="#requirements" id="id12
">Requirements</a></p> |
17 <ul class="small-gap"> | 17 <ul class="small-gap"> |
18 <li><a class="reference internal" href="#native-client-flag" id="id12">Native Cl
ient flag</a></li> | 18 <li><a class="reference internal" href="#native-client-flag" id="id13">Native Cl
ient flag</a></li> |
19 <li><a class="reference internal" href="#web-server" id="id13">Web server</a></l
i> | 19 <li><a class="reference internal" href="#web-server" id="id14">Web server</a></l
i> |
20 </ul> | 20 </ul> |
21 </li> | 21 </li> |
22 <li><a class="reference internal" href="#technique-1-local-server" id="id14">Tec
hnique 1: Local server</a></li> | 22 <li><a class="reference internal" href="#technique-1-local-server" id="id15">Tec
hnique 1: Local server</a></li> |
23 <li><a class="reference internal" href="#technique-2-packaged-application-loaded
-as-an-unpacked-extension" id="id15">Technique 2: Packaged application loaded as
an unpacked extension</a></li> | 23 <li><a class="reference internal" href="#technique-2-packaged-application-loaded
-as-an-unpacked-extension" id="id16">Technique 2: Packaged application loaded as
an unpacked extension</a></li> |
24 <li><a class="reference internal" href="#technique-3-hosted-application-loaded-a
s-an-unpacked-extension" id="id16">Technique 3: Hosted application loaded as an
unpacked extension</a></li> | 24 <li><a class="reference internal" href="#technique-3-hosted-application-loaded-a
s-an-unpacked-extension" id="id17">Technique 3: Hosted application loaded as an
unpacked extension</a></li> |
25 <li><a class="reference internal" href="#technique-4-chrome-web-store-applicatio
n-with-trusted-testers" id="id17">Technique 4: Chrome Web Store application with
trusted testers</a></li> | 25 <li><a class="reference internal" href="#technique-4-chrome-web-store-applicatio
n-with-trusted-testers" id="id18">Technique 4: Chrome Web Store application with
trusted testers</a></li> |
26 </ul> | 26 </ul> |
27 | 27 |
28 </div><h2 id="introduction">Introduction</h2> | 28 </div><h2 id="introduction">Introduction</h2> |
29 <p>This document describes how to run Native Client applications during | 29 <p>This document describes how to run Native Client applications during |
30 development.</p> | 30 development.</p> |
31 <p>The workflow for PNaCl applications is straightfoward and will only be discus
sed | 31 <p>The workflow for PNaCl applications is straightfoward and will only be discus
sed |
32 briefly. For NaCl applications distributed through the web-store, there is a | 32 briefly. For NaCl applications distributed through the web-store, there is a |
33 number of options and these will be discussed more in-depth.</p> | 33 number of options and these will be discussed more in-depth.</p> |
34 <h2 id="portable-native-client-pnacl-applications">Portable Native Client (PNaCl
) applications</h2> | 34 <h2 id="portable-native-client-pnacl-applications">Portable Native Client (PNaCl
) applications</h2> |
35 <p>Running PNaCl applications from the open web is enabled in Chrome version 31
and | 35 <p>Running PNaCl applications from the open web is enabled in Chrome version 31
and |
36 above; therefore, no special provisions are required to run and test such | 36 above; therefore, no special provisions are required to run and test such |
37 applications locally. An application that uses a PNaCl module can be tested | 37 applications locally. An application that uses a PNaCl module can be tested |
38 similarly to any other web application that only consists of HTML, CSS and | 38 similarly to any other web application that only consists of HTML, CSS and |
39 JavaScript.</p> | 39 JavaScript.</p> |
40 <p>To better simulate a production environment, it’s recommended to start
a local | 40 <p>To better simulate a production environment, it’s recommended to start
a local |
41 web server to serve the application’s files. The NaCl SDK comes with a sim
ple | 41 web server to serve the application’s files. The NaCl SDK comes with a sim
ple |
42 local server built in, and the process of using it to run PNaCl applications is | 42 local server built in, and the process of using it to run PNaCl applications is |
43 described in <a class="reference internal" href="/native-client/devguide/tutoria
l/tutorial-part1.html#tutorial-step-2"><em>the tutorial</em></a>.</p> | 43 described in <a class="reference internal" href="/native-client/devguide/tutoria
l/tutorial-part1.html#tutorial-step-2"><em>the tutorial</em></a>.</p> |
44 <h2 id="native-client-applications-and-the-chrome-web-store">Native Client appli
cations and the Chrome Web Store</h2> | 44 <h2 id="native-client-applications-and-the-chrome-web-store">Native Client appli
cations and the Chrome Web Store</h2> |
45 <p>Before reading about how to run Native Client applications, it’s import
ant to | 45 <p>Before reading about how to run Native Client applications, it’s import
ant to |
46 understand a little bit about how Native Client applications are distributed. | 46 understand a little bit about how Native Client applications are distributed. |
47 As explained in <a class="reference internal" href="/native-client/devguide/dist
ributing.html"><em>Distributing Your Application</em></a>, Native | 47 As explained in <a class="reference internal" href="/native-client/devguide/dist
ributing.html"><em>Distributing Your Application</em></a>, Native |
48 Client applications must currently be distributed through the <strong>Chrome Web | 48 Client applications must currently be distributed through the <strong>Chrome Web |
49 Store (CWS)</strong>. Applications in the CWS are one of three types:</p> | 49 Store (CWS)</strong>. Applications in the CWS are one of three types:</p> |
50 <ul class="small-gap"> | 50 <ul class="small-gap"> |
51 <li>A <strong>hosted application</strong> is an application that you host on a s
erver of your | 51 <li>A <strong>hosted application</strong> is an application that you host on a s
erver of your |
52 choice. To distribute an application as a hosted application, you upload | 52 choice. To distribute an application as a hosted application, you upload |
53 application metadata to the CWS.</li> | 53 application metadata to the CWS. Learn more on the <a class="reference external"
href="/apps">Chrome App</a> |
| 54 documentation page.</li> |
54 <li>A <strong>packaged application</strong> is an application that is hosted in
the CWS and | 55 <li>A <strong>packaged application</strong> is an application that is hosted in
the CWS and |
55 downloaded to the user’s machine. To distribute an application as a packag
ed | 56 downloaded to the user’s machine. To distribute an application as a packag
ed |
56 application, you upload the entire application, including all application | 57 application, you upload the entire application, including all application |
57 assets and metadata, to the CWS.</li> | 58 assets and metadata, to the CWS. Learn more on the <a class="reference external"
href="/apps">Chrome App</a> |
| 59 documentation page.</li> |
58 <li>An <strong>extension</strong> is a packaged application that has a tiny UI c
omponent | 60 <li>An <strong>extension</strong> is a packaged application that has a tiny UI c
omponent |
59 (extensions are typically used to extend the functionality of the Chrome | 61 (extensions are typically used to extend the functionality of the Chrome |
60 browser). To distribute an application as an extension, you upload the entire | 62 browser). To distribute an application as an extension, you upload the entire |
61 application, including all application assets and metadata, to the CWS.</li> | 63 application, including all application assets and metadata, to the CWS. Learn |
| 64 more on the <a class="reference external" href="/extensions">Chrome extensions</
a> documentation page.</li> |
62 </ul> | 65 </ul> |
| 66 <p>The web store documentation contains a handy guide to <a class="reference ext
ernal" href="https://developer.chrome.com/webstore/choosing">help you choose whi
ch to |
| 67 use</a>.</p> |
63 <p>It’s clearly not convenient to package and upload files to the Chrome W
eb Store | 68 <p>It’s clearly not convenient to package and upload files to the Chrome W
eb Store |
64 every time you want to run a new build of your application, but there are four | 69 every time you want to run a new build of your application, but there are four |
65 alternative techniques you can use to run the application during development. | 70 alternative techniques you can use to run the application during development. |
66 These techniques are listed in the following table and described in detail | 71 These techniques are listed in the following table and described in detail |
67 below. Each technique has certain requirements (NaCl flag, web server, and/or | 72 below. Each technique has certain requirements (NaCl flag, web server, and/or |
68 CWS metadata); these are explained in the <a class="reference internal" href="#r
equirements"><em>Requirements</em></a> | 73 CWS metadata); these are explained in the <a class="reference internal" href="#r
equirements"><em>Requirements</em></a> |
69 section below.</p> | 74 section below.</p> |
70 <table border="1" class="docutils"> | 75 <table border="1" class="docutils"> |
71 <colgroup> | 76 <colgroup> |
72 </colgroup> | 77 </colgroup> |
(...skipping 86 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
159 that is equal to or higher than the version of the Pepper API that your | 164 that is equal to or higher than the version of the Pepper API that your |
160 application uses. For example, if you compiled your application using the | 165 application uses. For example, if you compiled your application using the |
161 <code>pepper_37</code> bundle, your application uses the Pepper 37 API, and you
must run | 166 <code>pepper_37</code> bundle, your application uses the Pepper 37 API, and you
must run |
162 the application in Chrome 37 or higher. To check which version of Chrome youR
17;re | 167 the application in Chrome 37 or higher. To check which version of Chrome youR
17;re |
163 using, type <code>about:version</code> in the Chrome address bar.</p> | 168 using, type <code>about:version</code> in the Chrome address bar.</p> |
164 <h3 id="chrome-cache"><span id="cache"></span>Chrome Cache</h3> | 169 <h3 id="chrome-cache"><span id="cache"></span>Chrome Cache</h3> |
165 <p>Chrome caches resources aggressively. You should disable Chrome’s cache
whenever | 170 <p>Chrome caches resources aggressively. You should disable Chrome’s cache
whenever |
166 you are developing a Native Client application in order to make sure Chrome | 171 you are developing a Native Client application in order to make sure Chrome |
167 loads new versions of your application. Follow the instructions <a class="refere
nce internal" href="/native-client/devguide/tutorial/tutorial-part1.html#tutoria
l-step-3"><em>in the | 172 loads new versions of your application. Follow the instructions <a class="refere
nce internal" href="/native-client/devguide/tutorial/tutorial-part1.html#tutoria
l-step-3"><em>in the |
168 tutorial</em></a>.</p> | 173 tutorial</em></a>.</p> |
169 <h2 id="requirements"><span id="id1"></span>Requirements</h2> | 174 <h2 id="requirements"><span id="id2"></span>Requirements</h2> |
170 <h3 id="native-client-flag"><span id="flag"></span>Native Client flag</h3> | 175 <h3 id="native-client-flag"><span id="flag"></span>Native Client flag</h3> |
171 <p>Native Client is automatically enabled for applications that are installed fr
om | 176 <p>Native Client is automatically enabled for applications that are installed fr
om |
172 the Chrome Web Store. To enable Native Client for applications that are not | 177 the Chrome Web Store. To enable Native Client for applications that are not |
173 installed from the Chrome Web Store, you must explicitly turn on the Native | 178 installed from the Chrome Web Store, you must explicitly turn on the Native |
174 Client flag in Chrome as follows:</p> | 179 Client flag in Chrome as follows:</p> |
175 <ol class="arabic simple"> | 180 <ol class="arabic simple"> |
176 <li>Type <code>about:flags</code> in the Chrome address bar.</li> | 181 <li>Type <code>about:flags</code> in the Chrome address bar.</li> |
177 <li>Scroll down to “Native Client”.</li> | 182 <li>Scroll down to “Native Client”.</li> |
178 <li>If the link below “Native Client” says “Disable”, th
en Native Client is | 183 <li>If the link below “Native Client” says “Disable”, th
en Native Client is |
179 already enabled and you don’t need to do anything else.</li> | 184 already enabled and you don’t need to do anything else.</li> |
180 <li>If the link below “Native Client” says “Enable”:<ul
class="small-gap"> | 185 <li>If the link below “Native Client” says “Enable”:<ul
class="small-gap"> |
181 <li>Click the “Enable” link.</li> | 186 <li>Click the “Enable” link.</li> |
182 <li>Click the “Relaunch Now” button in the bottom of the screen. <st
rong>Native | 187 <li>Click the “Relaunch Now” button in the bottom of the screen. <st
rong>Native |
183 Client will not be enabled until you relaunch your browser</strong>. All browser | 188 Client will not be enabled until you relaunch your browser</strong>. All browser |
184 windows will restart when you relaunch Chrome.</li> | 189 windows will restart when you relaunch Chrome.</li> |
185 </ul> | 190 </ul> |
186 </li> | 191 </li> |
187 </ol> | 192 </ol> |
188 <p>If you enable the Native Client flag and still can’t run applications f
rom | 193 <p>If you enable the Native Client flag and still can’t run applications f
rom |
189 outside the Chrome Web Store, you may need to enable the Native Client plugin:</
p> | 194 outside the Chrome Web Store, you may need to enable the Native Client plugin:</
p> |
190 <ol class="arabic simple"> | 195 <ol class="arabic simple"> |
191 <li>Type <code>about:plugins</code> in the Chrome address bar.</li> | 196 <li>Type <code>about:plugins</code> in the Chrome address bar.</li> |
192 <li>Scroll down to “Native Client”.</li> | 197 <li>Scroll down to “Native Client”.</li> |
193 <li>If the link below “Native Client” says “Enable”, cli
ck the link to enable | 198 <li>If the link below “Native Client” says “Enable”, cli
ck the link to enable |
194 the Native Client plugin. You do not need to relaunch Chrome after enabling | 199 the Native Client plugin. You do not need to relaunch Chrome after enabling |
195 the Native Client plugin.</li> | 200 the Native Client plugin.</li> |
196 </ol> | 201 </ol> |
197 <h3 id="web-server"><span id="id2"></span>Web server</h3> | 202 <h3 id="web-server"><span id="id3"></span>Web server</h3> |
198 <p>For security reasons, Native Client applications must come from a server (you | 203 <p>For security reasons, Native Client applications must come from a server (you |
199 can’t simply drag HTML files into your browser). The Native Client SDK com
es | 204 can’t simply drag HTML files into your browser). The Native Client SDK com
es |
200 with a lightweight Python web server that you can run to serve your application | 205 with a lightweight Python web server that you can run to serve your application |
201 locally. The server can be invoked from a Makefile. Here is how to run the | 206 locally. The server can be invoked from a Makefile. Here is how to run the |
202 server:</p> | 207 server:</p> |
203 <pre> | 208 <pre> |
204 $ cd examples | 209 $ cd examples |
205 $ make serve | 210 $ make serve |
206 </pre> | 211 </pre> |
207 <p>By default, the server listens for requests on port 5103. You can use the ser
ver | 212 <p>By default, the server listens for requests on port 5103. You can use the ser
ver |
(...skipping 98 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
306 </li> | 311 </li> |
307 <li>Open a new tab in Chrome and click the <strong>Apps</strong> link at the bot
tom of the | 312 <li>Open a new tab in Chrome and click the <strong>Apps</strong> link at the bot
tom of the |
308 page to show your installed apps: | 313 page to show your installed apps: |
309 <img alt="new-tab-apps" src="/native-client/images/new-tab-apps.png" /></li> | 314 <img alt="new-tab-apps" src="/native-client/images/new-tab-apps.png" /></li> |
310 <li>The icon for your newly installed app should appear on the New Tab page. | 315 <li>The icon for your newly installed app should appear on the New Tab page. |
311 Click the icon to launch the app.</li> | 316 Click the icon to launch the app.</li> |
312 </ol> | 317 </ol> |
313 <p>For additional information about how to create CWS metadata and load your | 318 <p>For additional information about how to create CWS metadata and load your |
314 application into Chrome (including troubleshooting information), see the | 319 application into Chrome (including troubleshooting information), see the |
315 <a class="reference external" href="/webstore/get_started_simple">Chrome Web Sto
re Tutorial: Getting Started</a>.</p> | 320 <a class="reference external" href="/webstore/get_started_simple">Chrome Web Sto
re Tutorial: Getting Started</a>.</p> |
316 <p>See also <a class="reference internal" href="/native-client/sdk/examples.html
#run-sdk-examples-as-packaged"><em>Run the SDK examples as packaged apps</em></a
>.</p> | 321 <p>See also <a class="reference internal" href="/native-client/sdk/examples.html
#run-sdk-examples-as-packaged"><em>Run the SDK examples as Chrome apps</em></a>.
</p> |
317 <h2 id="technique-3-hosted-application-loaded-as-an-unpacked-extension">Techniqu
e 3: Hosted application loaded as an unpacked extension</h2> | 322 <h2 id="technique-3-hosted-application-loaded-as-an-unpacked-extension">Techniqu
e 3: Hosted application loaded as an unpacked extension</h2> |
318 <p>For development purposes, Chrome lets you load a hosted application as an | 323 <p>For development purposes, Chrome lets you load a hosted application as an |
319 unpacked extension. To load and run your hosted application as an unpacked | 324 unpacked extension. To load and run your hosted application as an unpacked |
320 extension:</p> | 325 extension:</p> |
321 <ol class="arabic simple"> | 326 <ol class="arabic simple"> |
322 <li>Start a web server to serve your application.<ul class="small-gap"> | 327 <li>Start a web server to serve your application.<ul class="small-gap"> |
323 <li>You can use the <a class="reference internal" href="#web-server"><em>local w
eb server</em></a> included with the | 328 <li>You can use the <a class="reference internal" href="#web-server"><em>local w
eb server</em></a> included with the |
324 Native Client SDK if you want.</li> | 329 Native Client SDK if you want.</li> |
325 </ul> | 330 </ul> |
326 </li> | 331 </li> |
(...skipping 109 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
436 </ul> | 441 </ul> |
437 </li> | 442 </li> |
438 </ol> | 443 </ol> |
439 <p>To publish an application to the world after publishing it to test accounts, | 444 <p>To publish an application to the world after publishing it to test accounts, |
440 you must first unpublish the application. For additional information see | 445 you must first unpublish the application. For additional information see |
441 <a class="reference external" href="/webstore/docs/publish">Publishing Your App<
/a>, and in particular <a class="reference external" href="/webstore/publish#tes
taccounts">Publishing | 446 <a class="reference external" href="/webstore/docs/publish">Publishing Your App<
/a>, and in particular <a class="reference external" href="/webstore/publish#tes
taccounts">Publishing |
442 to test accounts</a>.</p> | 447 to test accounts</a>.</p> |
443 </section> | 448 </section> |
444 | 449 |
445 {{/partials.standard_nacl_article}} | 450 {{/partials.standard_nacl_article}} |
OLD | NEW |