I'm building a Chrome extension that will let you add a bunch of new reactions to Facebook posts. You can see the first version of it here: http://reactions.us/
The way I'm handling it now is a bit inelegant. When a user adds a "reaction", I'm adding a custom emoticon as a comment and then parsing it, removing the original comment from the dom, and adding the corresponding "reaction" to the post.
Here's what I would like to do
I would like to reach out to an external api, say at http://api.reactions.us, in order to set and get the reactions for a certain story. In order to do this I (think) I need to add an ajax call to the page. But when I add the ajax call to a "web_accessible_resources" script that's loaded onto the page via an init script in "content_scripts" I get this error:
Refused to connect to 'http://reactions.us/getReactions?id=111' because it violates the following Content Security Policy directive: "connect-src https://*.facebook.com http://*.facebook.com https://*.fbcdn.net http://*.fbcdn.net *.facebook.net *.spotilocal.com:* https://*.akamaihd.net ws://*.facebook.com:* http://*.akamaihd.net https://fb.scanandcleanlocal.com:* *.atlassolutions.com http://attachment.fbsbx.com https://attachment.fbsbx.com".
Here's the relevant code in the plugin: https://github.com/ollerac/New-Facebook-Reactions/blob/master/reactions.js#L161
Any help would be greatly appreciated. Perhaps there's a way to pass messages between the content scripts and the web accessible resources?
I found the answer. I had followed the advice of this post when I first started: Insert code into the page context using a content script
It suggests injecting your scripts directly into the page if you don't need access to any of the chrome API functions and that's exactly what I did because I didn't need them before.
But you can do pretty much the same thing (access and modify the dom -- and now even make ajax requests) merely with content scripts.
This post is helpful when talking about Cross-domain XMLHttpRequest using content scripts: Cross-domain XMLHttpRequest using background pages
Related
I have a stripe elements integration on my project.
I use sapper on front end and ruby on the backend.
I followed the tutorial to setup the server to generate payment intent using stripe private key and front end to show stripe embeddable UI using stripe publish key, everything works fine the only problem is as follows.
Once a payment is done using test card details I get the following error
Refused to load the image 'https://hooks.stripe.com/img/favicon.png' because it violates the following Content Security Policy directive: "img-src data: https://q.stripe.com".
The issue that you describe is related to the CSP and how it is configured for your project. Stripe has documentation related to the CSP describing all the required directives https://stripe.com/docs/security/guide#content-security-policy. It requires img-src directive to allow loading of the content from https://*.stripe.com while your current directive permits only data: and https://q.stripe.com.
Extending your current directive with the requirements from Stripe should solve the issue.
As I am developing huawei quick app,When Web Components send a message to an HTML5 page, the following JS error is reported:
02–14 09:22:56.329 E/jsLog (18834): [H5]Uncaught TypeError: system.onmessage is not a function
how can I solve it?
Ensure that the system.onmessage function in the HTML5 page only contains the necessary logic, that is, receiving data transmitted from a quick app page. You can leave other logic, for example, handling onload events, to lifecyle functions of the HTML5 page for processing.
Note that data from the quick app is not received once the onload event is triggered. In this case, the HTML5 page needs to listen to data receiving in polling mode. To achieve this, refer to the following sample code.
The following code is not recommended.
You should understand the mechanism for sending messages between a quick app and an HTML5 page. Then use the polling mode to solve the asynchronous data transmission problem.
I have reviewed this question/answer as well:
Communicating between Chrome DevTools and content script in extension
It looks like they are doing something slightly different than I am trying to do, so I don't know how much it applies. Maybe I absolutely need a background.js file?
I have also reviewed this question:
extension using background, content and devtools together
Here it looks like they are not using long-lived connections as documented here (which is what I need):
https://developer.chrome.com/extensions/messaging#connect
Anyway, previous question aside here is my problem:
I have tried this a few ways over the span of a few hours so I am pretty convinced I am just missing something here to make this work.
The crux of my issue is that:
chrome.runtime.onConnect.addListener(function(){...})
the listener here will never fire.
Here's my setup:
My extension uses a Content Script and a DevTools page. From both locations, the Content Script and DevTools page, I have tried to enabling messaging though chrome.runtime. My boilerplate initialization looks like this for starting the connection:
console.log('initializing connection');
var port = chrome.runtime.connect({name: 'My Extension'});
console.log('port', port.name);
and this for waiting for onConnect:
chrome.runtime.onConnect.addListener(function(port){
console.log('got connection!!!!!!');
});
My onConnect handler will never be invoked. I have tried placing the connection code (chrome.runtime.connect({...})) in the Content Script and in the DevTools page JS while placing the handler initialization the opposite location to no avail.
In other words, if I place the connection code in the Content Script, I will place the handler initialization into the DevTools page JS. If I place the connection code into the DevTools page JS I will place the handler initialization into the Content Script.
In both cases, I receive no runtime errors, however, I also never see the console.log('got connection!!!!!!'); get called. Yes, I am looking at the DevTools page console when I have the handler initialization located in the DevTools page JS.
I simply must just be misunderstanding something or missing something in the docs. Can anyone point me in the right direction re: having DevTools Page JS communicate with a Content Script?
As per Xan comment, communication between devtools extension and content scripts should be done through the use of a background script. The process is basically:
(devtools script) - create the connection ( and sends or listens to messages through the connection port opened)
(background script) - listen for the connection to be created, receiving the port and using it to listen or broadcast messages
This is useful if you want to keep a long lived connection, so basically you will need a couple of messages to be passed back and forward for a single process. If you want simple messages to be passed from time to time, but don't need multiple messages being passed back and forth then you might implement a more simple communication:
(devtools script) - sends a message using the chrome.runtime.sendMessage
(background script) - listens for messages send by any extension associated with it using the chrome.runtime.onMessage.addListener()
Good Evening!
I've been looking into the possibility of using GAS(Google Apps Script) to host a small bit of javascript that lets me use the new Google finance apps api. The intention being that I'll be using the stock information for a project which involves the use of stock data. I know that there are a few ways to get stock information from Google, but the data that the finanace app returns is more in-line with other sources we are using. (One constraint on this project is that we have multiple sources).
I've written the javascript and I can call a httpc:request to the URL for the script given to me from Google. In the browser the JS returns the json object as I want it, however when the call is made from Erlang I'm getting it in a list of ascii. From checking the values it appears to be a document starting like:
Below is the javascript and the url to see the json:
https://script.google.com/macros/s/AKfycbzEvuuQl4jkrbPCz7hf9Zv4nvIOzqAkBxL1ixslLBxmSEhksQM/exec
function doGet() {
var stock = FinanceApp.getStockInfo('LON:TSCO');
return ContentService.createTextOutput(JSON.stringify(stock))
.setMimeType(ContentService.MimeType.JSON);
}
For the erlang, it's a simple request but I've not been doing erlang long, so perhaps I've messed something up here (The URL being the one mentioned above). I've got crypto / ssl / inets when I'm testing this on the command line.
{ok, {Version, Headers, Body}} = httpc:request(get, URL, []}, [], []).
I think it's also worth mentioning that when i curl it from Cygwin, I get a massive load of HTML also, I've included it below, but if you see it you'll thank me for not posting it in here! http://pastebin.com/UtJHXjRm
I've been updating the script as I go with the new versions but I'm at a bit of a loss as to why it's not returning correctly.
If anyone can give me any pointers I'd be very grateful! I get the feeling that it's not intended to be used this way, perhaps only within other Google products and such.
Cheers!
It would be necessary to review how are you deploying the Web App, specifically the Who has access to the app, to access without authentication should be configured as shown in the image:
See Deploying Your Script as a Web App from the documentation.
In my test, by running:
curl -L https://script.google.com/macros/s/************/exec
Get the following result:
{
"priceopen":358,
"change":2.199981689453125,
"high52":388.04998779296875,
"tradetime":"2013-10-11T15:35:18.000Z",
"currency":"GBX",
"timezone":"Europe/London",
"low52":307,
"quote":357.8999938964844,
"name":"Tesco PLC",
"exchange":"LON",
"marketcap":28929273763,
"symbol":"TSCO",
"volumedelay":0,
"shares":8083060703,
"pe":23.4719295501709,
"eps":0.15248000621795654,
"price":357.8999938964844,
"has_stock_data":true,
"volumeavg":14196534,
"volume":8885809,
"changepct":0.6184935569763184,
"high":359.5,
"datadelay":0,
"low":355.8999938964844,
"closeyest":355.70001220703125
}
Possibly your GET is not following the REDIRECT that happens when you use contentService. Look at the html returned there is a redirect in there.
I am unable to load an iWidget externally on the communities page
This is my widget def:
<widgetDef defId="qmiWidget" primaryWidget="false" modes="view fullpage edit search"
url="http://questionmine.com/app1/widgets/index/publishProject_iWidget"/>
But it replaces the http and tries to load it internally
"NetworkError: 403 Forbidden - https://connectionsww.demos.ibm.com/communities/ajaxProxy/http/questionmine.com/app1/widgets/index/publishProject_iWidget"
Any idea how can I do this ?
Since your widget resides on another domain, you have to configure the "Ajax Proxy" to allow this.
Take a look at this here:
http://www-10.lotus.com/ldd/lcwiki.nsf/xpDocViewer.xsp?lookupName=IBM+Connections+4.5+Documentation#action=openDocument&res_title=Configuring_the_AJAX_proxy_ic45&content=pdcontent
For testing purposes (ONLY testing) it would be safe to allow "*" but for a production environment it is strongly advised to be more specific, in your case something like "questionmine.com/app1/*"
You can even configure specific proxy rules per application (Communities, Profiles, Homepage,...)
http://www-10.lotus.com/ldd/lcwiki.nsf/xpDocViewer.xsp?lookupName=IBM+Connections+4.5+Documentation#action=openDocument&res_title=Configuring_the_AJAX_proxy_for_a_specific_application_ic45&content=pdcontent
BTW: If you ever tried to enable feeds in a community, the same applies. Without further configuration, only same-domain feeds would be allowed.