Inserting the iframe into react component

If you don’t want to use dangerouslySetInnerHTML then you can use the below mentioned solution var Iframe = React.createClass({ render: function() { return( <div> <iframe src={this.props.src} height={this.props.height} width={this.props.width}/> </div> ) } }); ReactDOM.render( <Iframe src=”” height=”500″ width=”500″/>, document.getElementById(‘example’) ); here live demo is available Demo

Angular, onLoad function on an iFrame

Commenting on a year old question. For cases where there are more than 1 iframes, I needed to bind “onload” events on to. I did this approach. Directive APP.directive(‘iframeOnload’, [function(){ return { scope: { callBack: ‘&iframeOnload’ }, link: function(scope, element, attrs){ element.on(‘load’, function(){ return scope.callBack(); }) } }}]) Controller APP.controller(‘MyController’, [‘$scope’, function($scope){ $scope.iframeLoadedCallBack = function(){ … Read more

Content script for iframe inside extension popup or background script

Use “all_frames”: true in your content script declaration to inject it into an iframe: “content_scripts”: [{ “matches”: [ “*” ], “js”: [ “content.js” ], “all_frames”: true }], To differentiate this iframe from normal tabs you can add a dummy parameter to the URL when you create the iframe e.g. so you can match it … Read more

Failed to load resource: net::ERR_INSECURE_RESPONSE

Your resource probably use a self-signed SSL certificate over HTTPS protocol. Chromium, so Google Chrome block by default this kind of resource considered unsecure. You can bypass this this way : Assuming your frame’s URL is, open a new tab in chrome and go to Chrome will ask you to accept the SSL … Read more