I'm working with chrome extension to use giphy API. Basically user from any website point of view can make a request to giphy to get some gifs if he makes double clicks on some words on those websites. For example, the user clicks on 'car' word in some article and then makes a request to giphy, he gets gifs proposals.
Plugin is working as expected for many websites, but not for all. In one (for now) website the request is ok, the response contains gifs, extension background receiving that gifs, but after trying to add these gifs to the DOM (content script popup) network shows (canceled) and src of that files have value = unknown.
I suppose it's related to some security reasons, am I right? I yes, what can I do, to insert gifs to my extension popup safely? Are there any security risks for the user when he gets gifs from giphy?
Related
this website is not using ajax to update sections of the site with content, its a static site and therefore moves from one html page to the other in the classic way.
each page has a video element embedded which plays the same video.
clearly this means each time a user clicks to navigate to a different page, the video will restart.
what approaches can be taken to enable the video to maintain its position no matter which page the user visits ?
I understand each time a user clicks a hyperlink to navigate to a different page, a new http request is performed and there is the request and retrieval of this html page.
I'm curious whether I can achieve what I'm looking for without using AJAX. be interested to hear from you all on this.
We have a web admin panel in which the agents can see conversations with customers.
Those conversations are the result of importing normal emails thru an IMAP connection. We grab the "untouched" mailbox files and we store them in a database. Then we post-process the files to index by "from", "to", "date" and so on and so forth.
Up to here, okey. We can seek all the emails involved with a client and render them at will.
Then when the agent looks for a customer in the web admin panel and opens it, the full email conversation appears. And we display the HTML version of the email within an iframe (or the text version if the html version is not there). 90% of the customers send HTML.
What happens? Upon the agent opening the email in our web, the iframe loads the "full html" and renders it. This makes "remote loading" (images, sounds, styles if so, and whatever) to be downloaded. This allows customers to "track" if we opened the email by appending tracking id's to the assets (typical http://track.example.com/image.jpg?id=123456789)
I've tried the "sandbox" attribute of the iframe html tag with no luck (it still downloads the images).
Question
How can I programmatically tell the iframe to not load ANY remote content, and just render the initial HTML without any remote call?
Mozilla's iframe documentation listing all available attributes for the is here: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe
If you look at "sandbox" there is no restriction specific to image or other includes, just restrictions on things like running JavaScript. There are no other attributes that would restrict images and includes.
To solve the problem of images and includes in your HTML you will need to filter the HTML either at the server before sending it or in the client after it arrives.
Server:
Before storing it into the database.
In the code that retrieves the HTML and returns it to the iframe.
Client:
Use AJAX to fill the iframe with the HTML, with code that filters a
response. With this approach you could also use a div instead of an
iframe if that works better for your layout.
If all of your users will use Chrome or Firefox, you could look at writing a browser extension
I'm working on a Chrome extension to (among other things) support a page with multiple iframes, each of which loads a page from some other domain. I need to send a msg to the page loaded a specific one of those iframes. The top-level page and the pages in the iframe each have their own content scripts, so the full messaging API is available.
From the top page, when I do chrome.runtime.sendMessage(), all the iframes get it (as does the top window, but it's easy for its content script to know that that particular msg isn't intended for it). Is there any way to target a specific one of those iframes, or for the desired iframe page to know that the msg is for it?
Note that...
The top page can't access anything in iframe pages directly, because they're from other domains.
The top page knows the URL that was originally loaded in each frame, but the user may have navigated from there, so including the target URL as a msg parameter for the receiving script to check won't work.
Is there something obvious I'm missing here?
UPDATE: #wOxxOm's answer was very helpful, but I'm still stuck on how to get the frameIds I need.
More specifically, I need to do two things with those iframes, both of which need that frameId:
Inject a script into each iframe
Send msgs to a specific iframe in response to user actions on the top-level page
All of this is complicated by the fact that the iframes are created and removed dynamically as the user works.
One idea I had is to initially load each new iFrame with the URL "about:blank?id=nnn", where nnn is the DOM id of the corresponding iframe element. That way, when I call getAllFrames(), I can recognize the new iframes by that URL, and build a lookup of frameIds for each DOM id. Once that's done, I can load the real URL, inject the script once it's loaded.
That seems so roundabout, I'm hoping I've missed some supporting API or other straightforward approach.
I did find a solution, but it's pretty indirect. I hope this is clear; all these moving parts are the nature of the beast as I understand it.
Here's what I ended up doing:
Added a name attribute to each iframe, the same as its DOM id.
When the page in each iframe loads, a global content script calls chrome.runtime.sendMessage(), passing that name, which it can access as window.name.
The background script gets that msg, with the frameId of that iframe as sender.frameId, and calls chrome.tabs.sendMessage(), passing the frameId and window name.
The top-level page's content script builds a lookup object from those window-name (AKA iframe DOM id) / frameId pairs.
When the top-level page's content script wants to send a message to any of the iframe pages, it looks up the target's frameId in that lookup object, then calls chrome.runtime.sendMessage(), with a message type that indicates it's for a specific iframe, and including that frameId.
In response, the background script sends it on to the requested iframe's content script with chrome.tabs.sendMessage(), passing {frameId: request.frameId} as the 3rd parameter, as wOxxOm suggested.
This is working here, but by all means let me know if there's a simpler way to do this.
Can Chromecast be used to display a web site or web app? All the sample sender/receivers I've seen so far show how to play videos. The docs posted so far are minimal as best, just an API reference with little explanation what any of it does. I just want to send a URL of my choosing and have that page displayed on the TV. There's no user interaction required past that point. Assuming that's possible, does anyone have sample Chrome sender and receiver code for that?
I was able to modify the Github sample Project > googlecast/CastHelloText-chrome
to show a web page.
In the receiver.html file, I replaced the DIV with an IFRAME and styled it for 100% width and height.
Then in the displayText() function I changed innerHTML to src.
The only modification made to the sender chromehellotext.html was to replace YOUR_APPLICATION_ID with the app id created by registering the receiver.
Note that some sites like Google and Yahoo will not display inside an iframe. If you really needed to do that you could skip the iframe and just set window.location.href to the URL. That, of course, will overwrite your receiver code so the only way to change URLs would be to manually disconnect first and reload. I tried using window.open instead but that did not work.
One could imagine writing a Custom Receiver that has an iframe that wraps any website. Your sender would could then send webpages to your receiver, and the onLoad would set the the URL of the iframe. Don't have any code, but it's fairly simple to write.
There is a simple way to do that with the hellotext sample. You can send the html by typing that into the text field.
<iframe src="http://mywebpage.com" style="width:1280px;height:720px"></iframe>
To provide extra info from the current answer, as this post comes up near top on most searches.
Thing to search for is Digital Signage, this is the sort of industry word.
following GreenScreen Chromecast works okay. Greenscreen
host solution is Sign Simple - which looks to be same approach as Greenscreen without you needing to host the receiver web page.
Similar hosted solutions using Raspberry Pi can be found.
Of note: with GreenScreen and the CastHelloText, I could not get 1080p only 720p, some comments mention Video only in 1080p, but Images in 720p, which I take to mean html pages aswell.
Chromecast can indeed be used to display an arbitrary URL.
This can be done from plain old Chrome, using 'url-cast-receiver'. (Usable 'demo' page, GitHub project page.)
I have a great working chrome extension now.
It basically loops over a list of HTML of a web auction site, if a user has not paid for to have the image shown in the main list. A default image is shown.
My plugin use a jQuery Ajax request to load the auction page and find the main image to display as a thumbnail for any missing images. WORKS GREAT.
The plugin finds the correct image url and update the HTML Dom to the new image and sets a new width.
The issue is, that the auction site tracks all pages views and saves it to a "recently viewed" section of the site "users can see any auctions they have clicked on"
ISSUE
- My plugin uses ajax and the cookies are sent via the jQuery ajax request. I am pretty sure I cannot modify the cookies in this request so the auction site tracks the request and for any listing that has a missing image this listing is now shown in my "recently viewed" even though I have not actually navigated to it.
Can I remove cookies for ajax request (I dont think I can)
Can chrome remove the cookie (only for the ajax requests)
Could I get chrome to make the request (eg curl, with no cookie?)
Just for the curious.
Here is a page with missing images on this auction site
http://www.trademe.co.nz/Browse/SearchResults.aspx?searchType=all&searchString=toaster&type=Search&generalSearch_keypresses=9&generalSearch_suggested=0
Thanks for any input, John.
You can use the webRequest API to intercept and modify requests (including blanking headers). It cannot be used to modify requests which are created within the context of a Chrome extension though. If you want to use this API for cookie-blanking purposes, you have to load the page in a non-extension context. Either by creating a new tab, or use an off-screen tab (using the experimental offscreenTabs API.
Another option is to use the chrome.cookie API, and bind a onChanged event. Then, you can intercept cookie modifications, and revert the changes using chrome.cookies.set.
The last option is to create a new window+tab in Incognito mode. This method is not reliable, and should not be used:
The user can disallow access to the Incognito mode
The user could have navigated to the page in incognito mode, causing cookie fields to be populated.
It's disruptive: A new window is created.
Presumably this AJAX interaction is being run from a content script? Could you run it from the background page instead and pass the data to the content script? I belive the background page operates in a different context and shouldn't send the normal cookies.