| OLD | NEW |
| 1 <h1>Message Passing</h1> | 1 <h1>Message Passing</h1> |
| 2 | 2 |
| 3 | 3 |
| 4 <p> | 4 <p> |
| 5 Since content scripts run in the context of a web page and not the extension, | 5 Since content scripts run in the context of a web page and not the extension, |
| 6 they often need some way of communicating with the rest of the extension. For | 6 they often need some way of communicating with the rest of the extension. For |
| 7 example, an RSS reader extension might use content scripts to detect the | 7 example, an RSS reader extension might use content scripts to detect the |
| 8 presence of an RSS feed on a page, then notify the background page in order to | 8 presence of an RSS feed on a page, then notify the background page in order to |
| 9 display a page action icon for that page. | 9 display a page action icon for that page. |
| 10 | 10 |
| (...skipping 57 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 68 chrome.runtime.onMessage.addListener( | 68 chrome.runtime.onMessage.addListener( |
| 69 function(request, sender, sendResponse) { | 69 function(request, sender, sendResponse) { |
| 70 console.log(sender.tab ? | 70 console.log(sender.tab ? |
| 71 "from a content script:" + sender.tab.url : | 71 "from a content script:" + sender.tab.url : |
| 72 "from the extension"); | 72 "from the extension"); |
| 73 if (request.greeting == "hello") | 73 if (request.greeting == "hello") |
| 74 sendResponse({farewell: "goodbye"}); | 74 sendResponse({farewell: "goodbye"}); |
| 75 }); | 75 }); |
| 76 </pre> | 76 </pre> |
| 77 | 77 |
| 78 In the above example, <code>sendResponse</code> was called synchronously. |
| 79 If you want to asynchronously use <code>sendResponse</code>, add |
| 80 <code>return true;</code> to the <code>onMessage</code> event handler. |
| 81 |
| 78 <p class="note"> | 82 <p class="note"> |
| 79 <b>Note:</b> If multiple pages are listening for onMessage events, only the | 83 <b>Note:</b> If multiple pages are listening for onMessage events, only the |
| 80 first to call sendResponse() for a particular event will succeed in sending the | 84 first to call sendResponse() for a particular event will succeed in sending the |
| 81 response. All other responses to that event will be ignored. | 85 response. All other responses to that event will be ignored. |
| 82 </p> | 86 |
| 87 <p class="note"> |
| 88 <b>Note:</b> The <code>sendResponse</code> callback is only valid if used |
| 89 synchronously, or if the event handler returns <code>true</code> to indicate |
| 90 that it will respond asynchronously. The <code>sendMessage</code> function's |
| 91 callback will be invoked automatically if no handlers return true or if the |
| 92 <code>sendResponse</code> callback is garbage-collected. |
| 83 | 93 |
| 84 | 94 |
| 85 <h2 id="connect">Long-lived connections</h2> | 95 <h2 id="connect">Long-lived connections</h2> |
| 86 <p> | 96 <p> |
| 87 Sometimes it's useful to have a conversation that lasts longer than a single | 97 Sometimes it's useful to have a conversation that lasts longer than a single |
| 88 request and response. In this case, you can open a long-lived channel from | 98 request and response. In this case, you can open a long-lived channel from |
| 89 your content script to an extension page | 99 your content script to an extension page |
| 90 {{^is_apps}} | 100 {{^is_apps}} |
| 91 , or vice versa, | 101 , or vice versa, |
| 92 {{/is_apps}} | 102 {{/is_apps}} |
| (...skipping 54 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 147 if (msg.joke == "Knock knock") | 157 if (msg.joke == "Knock knock") |
| 148 port.postMessage({question: "Who's there?"}); | 158 port.postMessage({question: "Who's there?"}); |
| 149 else if (msg.answer == "Madame") | 159 else if (msg.answer == "Madame") |
| 150 port.postMessage({question: "Madame who?"}); | 160 port.postMessage({question: "Madame who?"}); |
| 151 else if (msg.answer == "Madame... Bovary") | 161 else if (msg.answer == "Madame... Bovary") |
| 152 port.postMessage({question: "I don't get it."}); | 162 port.postMessage({question: "I don't get it."}); |
| 153 }); | 163 }); |
| 154 }); | 164 }); |
| 155 </pre> | 165 </pre> |
| 156 | 166 |
| 167 <h3 id="port-lifetime">Port lifetime</h3> |
| 168 <p> |
| 169 Ports are designed as a two-way communication method between different parts of |
| 170 the extension, where a (top-level) frame is viewed as the smallest part. |
| 171 <br> |
| 172 Upon calling $(ref:tabs.connect), $(ref:runtime.connect) or |
| 173 $(ref:runtime.connectNative), a $(ref:runtime.Port Port) is created. |
| 174 This port can immediately be used for sending messages to the other end via |
| 175 $(ref:runtime.Port.postMessage postMessage). |
| 176 |
| 177 <p> |
| 178 If there are multiple frames in a tab, calling $(ref:tabs.connect) results in |
| 179 multiple invocations of the $(ref:runtime.onConnect) event |
| 180 (once for each frame in the tab). |
| 181 Similarly, if $(ref:runtime.connect) is used, then the onConnect event |
| 182 may be fired multiple times (once for every frame in the extension process). |
| 183 |
| 157 <p> | 184 <p> |
| 158 You may want to find out when a connection is closed, for example if you are | 185 You may want to find out when a connection is closed, for example if you are |
| 159 maintaining separate state for each open port. For this you can listen to the | 186 maintaining separate state for each open port. For this you can listen to the |
| 160 $(ref:runtime.Port.onDisconnect) | 187 $(ref:runtime.Port.onDisconnect) |
| 161 event. This event is fired either when the other side of the channel manually | 188 event. This event is fired when there are no valid ports at the other side of |
| 162 calls | 189 the channel. This happens in the following situations: |
| 163 $(ref:runtime.Port.disconnect), or when the page | 190 <ul> |
| 164 containing the port is unloaded (for example if the tab is navigated). | 191 <li> |
| 165 onDisconnect is guaranteed to be fired only once for any given port. | 192 There are no listeners for $(ref:runtime.onConnect) at the other end. |
| 193 <li> |
| 194 The tab containing the port is unloaded (e.g. if the tab is navigated). |
| 195 <li> |
| 196 The frame from where <code>connect</code> was called has unloaded. |
| 197 <li> |
| 198 All frames that received the port (via $(ref:runtime.onConnect)) have |
| 199 unloaded. |
| 200 <li> |
| 201 $(ref:runtime.Port.disconnect) is called by <em>the other end</em>. |
| 202 Note that if a <code>connect</code> call results in multiple ports at the |
| 203 receiver's end, and <code>disconnect()</code> is called on any of these |
| 204 ports, then the <code>onDisconnect</code> event is only fired at the port |
| 205 of the sender, and not at the other ports. |
| 206 </ul> |
| 166 | 207 |
| 167 | 208 |
| 168 <h2 id="external">Cross-extension messaging</h2> | 209 <h2 id="external">Cross-extension messaging</h2> |
| 169 <p> | 210 <p> |
| 170 In addition to sending messages between different components in your | 211 In addition to sending messages between different components in your |
| 171 extension, you can use the messaging API to communicate with other extensions. | 212 extension, you can use the messaging API to communicate with other extensions. |
| 172 This lets you expose a public API that other extensions can take advantage of. | 213 This lets you expose a public API that other extensions can take advantage of. |
| 173 | 214 |
| 174 <p> | 215 <p> |
| 175 Listening for incoming requests and connections is similar to the internal | 216 Listening for incoming requests and connections is similar to the internal |
| (...skipping 156 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 332 | 373 |
| 333 <p> | 374 <p> |
| 334 You can find simple examples of communication via messages in the | 375 You can find simple examples of communication via messages in the |
| 335 <a href="http://src.chromium.org/viewvc/chrome/trunk/src/chrome/common/extension
s/docs/examples/api/messaging/">examples/api/messaging</a> | 376 <a href="http://src.chromium.org/viewvc/chrome/trunk/src/chrome/common/extension
s/docs/examples/api/messaging/">examples/api/messaging</a> |
| 336 directory. | 377 directory. |
| 337 The <a href="nativeMessaging#examples">native messaging sample</a> demonstrates | 378 The <a href="nativeMessaging#examples">native messaging sample</a> demonstrates |
| 338 how a Chrome app can communicate with a native app. | 379 how a Chrome app can communicate with a native app. |
| 339 For more examples and for help in viewing the source code, see | 380 For more examples and for help in viewing the source code, see |
| 340 <a href="samples">Samples</a>. | 381 <a href="samples">Samples</a>. |
| 341 </p> | 382 </p> |
| OLD | NEW |