I have one angular js application which is running on nodejs. I want to load an external site, the external site is also my application which is running on different IP, with-in a div while loading the template url. So in template url I mentioned one HTML file. Inside that HTML file I had written like this.
<iframe src="myexternalurl"></iframe>
But in error console it is coming like:
Refused to display 'myexternalurl' in a frame because it set 'X-Frame-Options' to 'SAMEORIGIN'.
Change the x-frame-options header to ALLOW-FROM {your app domain}
Apparently on your other application's host/server/app the header x-frame-options set to SAMEORIGIN you need to disable that header or correct it according to the x-frame-options possible values: https://developer.mozilla.org/en-US/docs/Web/HTTP/X-Frame-Options
You can simply add following line to .htaccess in your external site (If its your application)
Header always unset X-Frame-Options
If you want to allow some specific site. refer the below link
https://developer.mozilla.org/en-US/docs/Web/HTTP/X-Frame-Options
Related
I recently added CSP header to my project.
At the same time, I am also using PDFTron webviewer in my project.
As you know, PDFTron webviewer is rendered in an iframe and after adding CSP headers, I'm getting below error - related frame-ancestors.
Question1 is how can I add a frame-ancestors header to the PDFtron webviewer to bypass this error?
Question2 is the second error related with cross domain is not fixable by adding my domains to configorigin.txt, is it related with the csp header setting?
To Question1: Just change frame-ancestors 'none' to the frame-ancestors 'self' (or to frame-ancestors localhost:* if in your particular browser the 'self' token does not cover a localhost:port_number) to allow embedding PDF webviewer.
To Question2: I think the second error is CSP-related (side effect of CSP blocking) because localhost should not be a cross-origin resource since main page is loaded with the same host name and port number http://localhost:3000.
I have tried to add an iframe of google doc inside my application (react). The iframe works - I can see the doc, and edit it. but I keep getting these errors:
I have added the X-Frame-Option header to my Nginx with "SAMEORIGIN" always attribute without success. (didn't work)
Also added some sandbox configuration to the iframe itself so it can't redirect.
The HTML file head:
HTML head
Please let me know if you have more ideas.
I am creating a static site using angular 1. I done routing with ui-router.
Now I want to remove # tag from the url.
I googled it and got solution to enable html5 mode.
I done it as below:
app.config(function($locationProvider){
$locationProvider.html5mode= true;
})
and in index.html is added <base href="/"> but its not working.
and when i hitt localhost/myapp/ its showing Internal server error.
Please help me how to fix it.
Once you enable html5mode, you will need to rewrite your server.
Without html5mode, your browser would be making a request to http://localhost/ when the URL bar read http://localhost/#/myapp/ (because the browser doesn't send anything after the # symbol).
With html5mode, now that the # symbol is gone, the browser is making a request to http://localhost/myapp/, which your server may not be configured to handle.
Here's a resource that might help you out: https://github.com/angular-ui/ui-router/wiki/Frequently-Asked-Questions#how-to-configure-your-server-to-work-with-html5mode
Im using Bootstrap and AngularFire for my Web project. Everything ok but when I host it on Firebase.com. The layout has changed
Errors:
Mixed Content: The page at 'https://......firebaseapp.com/' was loaded over HTTPS, but requested an insecure stylesheet 'http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css'. This request has been blocked; the content must be served over HTTPS.
Mixed Content: The page at 'https://......firebaseapp.com/' was loaded over HTTPS, but requested an insecure script 'http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js'. This request has been blocked; the content must be served over HTTPS.
What happens with Bootstrap? Thanks in advance!
Firebase uses HTTPS to serve content. As you can see from the error, you are referring the content to be loaded over HTTP. Though this should not be happening, but it could be one of recent features of Chrome where they block, non-secure requests over a secure channel.
In order to solve it, you should change the URLs in your code to point at HTTPS versions of Bootstrap CDN.
https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css
https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js
Further Read: https://support.google.com/chrome/answer/1342714?hl=en
I was having the same issue:
you just need to make the http to https
in the bootstrap link inside the code.
That will resolve the issue.
I am trying to setup a localhost version of our site and have a problem getting this setup correctly.
Both our live and localhost site have this directory structure:
/na_cms/expressionengine/templates/default_site/c.group
/na_cms/expressionengine/templates/default_site/j.group
/na_cms/expressionengine/templates/default_site/default.group
/na_cms/expressionengine/templates/default_site/inc.group
On our live site, CSS files in our templates are accessed like this:
href=“css/c/modal.css”
src=“j/jquery-ui-1.8.4.custom.min.js”
How do I get rid of the 404 not found errors for the CSS and javascript files on the localhost site?
My config file has
$config[‘rewrite_short_tags’] = TRUE;
I'm obviously using assumptions here until further information gleamed...
You're using templates to hold your JS and CSS, rather than external files (Nothing wrong with that), so they're not technically relative URLs - it's pulled from the database so you won't have any more of a path than template group and template. The browser will not be targeting these template files directly, it will be EE providing them.
In your j.group folder I'm assuming you have a file called "jquery-ui-1.8.4.custom.min.js.js", which relates to a template group called "j" and a template called "jquery-ui-1.8.4.custom.min.js"?
What I'm a bit confused at is "css/c/modal.css", as this is indicating a template group called css, but you've stated your template group is called "c" and the template is "modal.css". Possibly this was a mistake, or you've got a "css" template group and falling into the index template...?
Firstly, check your template folder settings in EE, Design -> Templates -> Template Manager, then "Global Template Preferences". Look for "Basepath to Template File Directory". I'm assuming that you copied the online database to your local, rather than a new fresh install?
If you're using htaccess rewriting, check that is working on your local.
Failing that, try changing the paths to the CSS and JS to use the path variable:
src=“{path='j/jquery-ui-1.8.4.custom.min.js'}”
http://expressionengine.com/user_guide/templates/globals/path.html