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 |