74980

Sending Data From background.js to extension.js in crossrider

Question:

I am developing a browser extension using crossrider. I have added a context menu (background.js)

var ContextData; appAPI.contextMenu.add("key1", "Send Data To Server", function (data) { var ContextData = 'pageUrl: ' + data.pageUrl + '\r\n' + 'linkUrl: ' + data.linkUrl + '\r\n' + 'selectedText:' + data.selectedText + '\r\n' + 'srcUrl:' + data.srcUrl; }, ["all"]);

On user click I want to send ContextData to extension.js. At extension.js some function will receive the data and send it to my server (A Rest API which will accept the data).

To send data to the server I have tested this and it works fine (code sample in extension.js)

appAPI.ready(function($) { var dataToSend =="test data"; appAPI.request.post({ url: 'REST API URL', postData: dataToSend, onSuccess: function(response, additionalInfo) { var details = {}; details.response = response; }, onFailure: function(httpCode) { // alert('POST:: Request failed. HTTP Code: ' + httpCode); } }); });

How can I write a function to accept ContextData from background.js and assign it to dataToSend in extension.js?

Answer1:

@Neel If I understand your requirements correctly, @Rob is essentially correct though a little clarification may help

By design/architecture, the <em>extension.js</em> code runs on each HTML page i.e. a separate <em>extension.js</em> instance is run for each URL that loads. In contrast, the context menu runs at the browser level (not HTML page) and is hence correctly coded in <em>background.js</em> file. However, the <em>background.js</em> code does not have direct access to the <em>extension.js</em> instance code running on the HTML page in the active tab and must therefore <a href="http://docs.crossrider.com/#!/api/appAPI.message" rel="nofollow">communicate the data via messaging</a>. (For more information about scopes, see <a href="http://docs.crossrider.com/#!/guide/scopes" rel="nofollow">Scopes Overview</a>)

Obviously, a user clicks the context menu item on the active tab (i.e. the page showing the HTML page being viewed); hence, once the <strong>ContextData</strong> string is created, you can use <a href="http://docs.crossrider.com/#!/api/appAPI.message-method-toActiveTab" rel="nofollow">appAPI.message.toActiveTab</a> to send the string to the <em>extension.js</em> instance running on the page/tab where the the context menu item was clicked.

This being the case, using your code example you can achieve this goal as follows:

<strong>background.js</strong>:

appAPI.ready(function($) { var ContextData; appAPI.contextMenu.add("key1", "Send Data To Server", function (data) { var ContextData = 'pageUrl: ' + data.pageUrl + '\r\n' + 'linkUrl: ' + data.linkUrl + '\r\n' + 'selectedText:' + data.selectedText + '\r\n' + 'srcUrl:' + data.srcUrl; appAPI.message.toActiveTab({type:'dataToSend', data: ContextData}); }, ["all"]); });

<strong>extension.js</strong>:

appAPI.ready(function($) { var dataToSend =="test data"; appAPI.message.addListener(function(msg) { if (msg.type === 'dataToSend') { appAPI.request.post({ url: 'REST API URL', postData: dataToSend, onSuccess: function(response, additionalInfo) { var details = {}; details.response = response; }, onFailure: function(httpCode) { // alert('POST:: Request failed. HTTP Code: ' + httpCode); } }); } }); });

[<strong>Disclaimer</strong>: I am a Crossrider employee]

Recommend

  • How to pass PHP array values to another file using jQuery Ajax?
  • Sending Multicast UDP by GCDAsyncUdpSocket fails, no activity in Wireshark
  • Uncaught TypeError: $(…).select2 is not a function
  • Reading a file into a multidimensional array
  • Security issues with PHP's Readfile method
  • Web.config system.webserver errors
  • Android application: how to use the camera and grab the image bytes?
  • Button click event not firing in jQuery
  • chrome.tabs.executeScript only fires when the Developer Console is open
  • Converting a WriteableBitmap image ToArray in UWP
  • PHP buffered output depending on server setting?
  • Custom validator control occupying space even though display set to dynamic
  • JSON response opens as a file, but I can't access it with JavaScript
  • Bad request using file_get_contents for PUT request in PHP
  • How to clear text inside text field when radio button is select
  • ImageMagick, replace semi-transparent white with opaque white
  • Scrapy recursive link crawler
  • Why is an OPTIONS request sent to the server?
  • Display issues when we change from one jquery mobile page to another in firefox
  • Is there any way to access browser form field suggestions from JavaScript?
  • Deselecting radio buttons while keeping the View Model in synch
  • Resize panoramic image to fixed size
  • Volusion's generic SQL folder, functionality
  • How to redirect a user to a different server and include HTTP basic authentication credentials?
  • JSON with duplicate key names losing information when parsed
  • Symfony2: How to get request parameter
  • How can I estimate amount of memory left with calling System.gc()?
  • Jquery - Jquery Wysiwyg return html as a string
  • RestKit - RKRequestDelegate does not exist
  • Matrix multiplication with MKL
  • Revoking OAuth Access Token Results in 404 Not Found
  • log4net write single file for each call to log.info
  • Acquiring multiple attributes from .xml file in c#
  • Getting error when using KSoap library to consume .NET web services
  • Hits per day in Google Big Query
  • How do you join a server to an Active Directory (domain)?
  • coudnt use logback because of log4j
  • How to CLICK on IE download dialog box i.e.(Open, Save, Save As…)
  • How can I remove ASP.NET Designer.cs files?
  • java string with new operator and a literal