I am using the following simple javascript for redirection. However, it works in some machine but not others. Does anybody know why? Is there a better way to make sure every machine works? I also tried <meta> redirect it has the same issue.
<script type="text/javascript">
<!--
window.location = "http://mypage.html#instruction"
//-->
</script>
I would normally use the href property of location:
<script type="text/javascript">
<!--
window.location.href = "http://www.example.com/mypage.html#instruction"
//-->
</script>
Are you getting any javascript errors?
you can also try to use location.replace() method to load new url.
Maybe because your URL is wrong and some browsers are being generous? http://mypage.html#instruction is probably not the URL you want. Perhaps just mypage.html#instruction without the http:// or maybe /path/mypage.html if it's on the same server, or http://server.name.com/mypage.html#instruction.
As a fallback, you should probably include HTML like
Please click here
for browsers that just don't run the script for whatever reason.
The most compatible way to do this is with a Meta refresh.
You just put this into your HTML HEAD tag:
<meta http-equiv="refresh" content="5;url=http://example.com/" />
I don't know why they say it is deprecated/discouraged, since it has been supported for many years and does not require any Javascript. It is discouraged because of usability, but that's another concern.
Related
I am wrapping a razor view in an iframe. The razor view is a web service on a different domain.
Here is what I am doing:
<!DOCTYPE html>
<html>
<body>
<p align="center">
<img src="http://somewhere.com/images/double2.jpg" />
</p>
<p align="center">
<iframe src="https://secure.somewhereelse.com/MyPortal?CorpID=12334D-4C12-450D-ACB1-7372B9D17C22" width="550" height="600" style="float:middle">
<p>Your browser does not support iframes.</p>
</iframe>
</p>
</body>
</html>
This is the header of the src site:
<!DOCTYPE html>
<html>
<head>
<title>#ViewBag.Title</title>
<link href="#Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />
<link href="#Url.Content("~/Content/themes/cupertino/jquery-ui-1.8.21.custom.css")" rel="stylesheet" type="text/css" />
<script src="#Url.Content("~/Scripts/jquery-1.5.1.min.js")" type="text/javascript"></script>
<script src="#Url.Content("~/Scripts/jquery-ui-1.8.11.min.js")" type="text/javascript"></script>
</head>
I want the iframe src to use the CSS of the calling site.
Is there a way to pass in the CSS URL or have it inherit the CSS of the calling site?
I'd even settle for the css file location being a parameter being passed in from the originating site.
Anyone have any suggestions?
You cannot enforce your css on your site using an iframe. The css must be included in the source of the page included in an iframe. It used to be possible but in certain cases using javascript, and for the page to be on the same domain.
The only other way you may be able to use your own css is if the web service allows you to pass in the url of the css. But you would have to consult the documentation of the web service to find that out.
I would pass the CSS url as an argument to the iframe's src attribute:
<iframe src="http://somedomain.com/?styleUrl=#(ResolveStyleUrl())"></iframe>
Where ResolveStyleUrl might be defined as:
#functions {
public IHtmlString ResolveStyleUrl()
{
string url = Url.Content("~/Content/site.css");
string host = "http" + (Request.IsSecureConnection ? "s" : "") + "//" + Request.Url.Host + url;
return Raw(url);
}
}
This is of course assuming that the domain would accept a style url query string and render the appropriate <link /> on the remote page?
Eroc, I am sorry you cannot enforce your css on others' site using an iframe because most browsers will give an error like the one chrome gives:
Unsafe JavaScript attempt to access frame with URL http://terenceford.com/catalog/index.php? from frame with URL http://www.example.com/example.php. Domains, protocols and ports must match.
But this does not mean that you cannot extract the html from that page (which may be modified as per your ease)
http://php.net/manual/en/book.curl.php can be used for site scrapping with http://simplehtmldom.sourceforge.net/
First play with these functions:
curl_init();
curl_setopt();
curl_exec();
curl_close();
and then parse the html.
After trying yourself, you can look at this example below that I made for parsing beemp3 content, when I wanted to create a rich tool for directly downloading songs, unfortunately I couldn't because of the captcha but it is useful for you
directory structure
C:\wamp\www\try
-- simple_html_dom.php
-- try.php
try.php:
<?php
/*integrate results for dif websites seperately*/
require_once('simple_html_dom.php');
$q='eminem';
$mp3sites=array('http://www.beemp3.com/');
$ch=curl_init("{$mp3sites[0]}index.php?q={$q}&st=all");
curl_setopt($ch,CURLOPT_HEADER,0);
curl_setopt($ch,CURLOPT_RETURNTRANSFER,true);
curl_setopt($ch, CURLOPT_FOLLOWLOCATION, true);
//curl_setopt($ch, CURLOPT_CONNECTTIMEOUT, 10);
$result=curl_exec($ch);
curl_close($ch);
$html=str_get_html("{$result}");
$ret = $html->find("a");
echo "<head><style type='text/css'>a:link,a{font-size:16px;font-weight:bold;font-family:helvetica;text-decoration:none;color:#458;}a:hover{color:#67b;text-decoration:underline;}a:visited{color:silver;}</style></head>";
$unik=array(null);
foreach($ret as $link)
{
$find="/(.{1,})(\.php)[?](file=.{1,})&song=(.{1,})/i";
$replace="$4";
if(preg_match("{$find}",$link->href))
{
$unik[]=$link->href;
if(current($unik)===prev($unik)){unset($unik);}
else{
echo "<a href='".$mp3sites[0].$link->href."'>".urldecode(preg_replace($find,$replace,$mp3sites[0].$link->href))."</a><br/>";
}}
}
?>
I know that you do not code in php, but I think you are capable of translating the code. Look at this:
php to C# converter
I spent time on this question because only I can understand what it means to offer bounty.
May be the answer seems unrelated (because I have not used javascript or html based solution), but because of cross-domain issues this is an important lesson for you. I hope that you find similar libraries in c#. Best of luck
The only way I know to achieve that is to make the HTTP request on your server side, fetch the result and hand it back to the user.
A minima, you'll need either to strip completely the header from the targeted site to inject the content in your page using AJAX, or to inject your own css in the page headers to put it into an IFRAME.
Either way you have to implement the proxy method, which will take the targetted URL as an argument.
This technique has many downsides :
You have to do the queries on you server, which can cost a lot of bandwidth and CPU
You have to implement the proxy
You cannot transmit the domain specific cookies from the user, though you can manage new cookies have by rewriting them
If you do a lot of requests you server(s) is/are likely to become blacklisted on the targeted website(s)
The benefits sound low compared to the hassles.
I have Dreamweaver CS3 and i was wondering if it is possible to make a html page go from idreesinc.com/research.html to research.idreesinc.com. Is it possible and if so how do i do it? I have to actually MAKE a page and not just a redirect.
Thanks!
This isn't a "rewrite", it's a redirect - but it'll be the easiest for you as a beginner.
Easy with JS. Not the "best" way mind you, but the easiest.
Add this inside the tags or right after the opening tag.
<script type="text/javascript">
window.location = 'http://research.idreesinc.com';
</script>
If you're looking for how to make a subdomain (subdomain.domain.com), you need to search:
"How to make a subdomain"
Create or edit a file in the root of your idreesinc.com site called '.htaccess'
Insert the line:
Redirect 301 /research.html http://research.idreesinc.com
This is likely a very simple question with hopefully a simple answer. I'm using a CMS (TeamSite) and trying to add Google Analytics to a site. The problem is, as the CMS generates the HTML I can't add the Google Analytics code just before the closing </head> tag as Google tells you to. The other method of adding GA to your site is to add some JavaScript before the closing </body> tag. Now I have done this but TeamSite seems to put HTML comments around the JavaScript. Now without sounding like a complete fool, does this mean that the browser will ignore the JavaScript and not execute it? Code is below:
<script type="text/javascript"><!--
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
try{
// --></script>
<script type="text/javascript"><!--
var pageTracker = _gat._getTracker("UA-20657322-12");
pageTracker._trackPageview();
} catch(err) {}
// --></script>
Is there another way for me to add GA to the site without having to take the file from the production server and manually add the script before the closing </head> tag? Any help would be much appreciated.
Thanks
If the HTML comment tags are inserted before and after your and tags, the Javascript will not run. If it is inside the script tag, everything should work fine.
See for yourself:
<html>
<head><title>test</title></head>
<body>
<script>
alert('not commented');
</script>
<!--
<script>
alert('outside commented');
</script>
-->
<script>
//<!--
alert('inside commented');
//-->
</script>
</body></html>
The first and third alert will fire, but the second one will not. Like the poster below me mentions, this has to do with backwards compatibility so older browsers that do not support Javascript don't get confused.
In a script block HTML comments are treated slightly differently. In a script block single line comment.
The reason for this is so that in really old browsers that don't know about script tags you could use this sort of markup and if it didn't understand script tags it would not render the javascript to page (because it thinks its in a comment) and if it does understand script tags it will just treat teh opening one as a single line comment and then the closing tag is normally marked as a commetn using the //.
So in summary these comment tags shouldn't be causing you a problem that I can see.
Is the script not being run on your page are are you just uncertain where your issue lies? Sticking an "alert('test');" into that block should allow you to confirm that it is being run.
Based on Please explain JSONP, I understand that JSONP can be used to get around the same-origin policy.
But in order to do that, the page must use a <script> tag.
I know that pages can dynamically emit new script tags, such as with:
<script type="text/javascript" language='javascript'>
document.write('<script type="text/javascript" ' +
'id="contentloadtag" defer="defer" ' +
'src="javascript:void(0)"><\/script>');
var contentloadtag=document.getElementById("contentloadtag");
contentloadtag.onreadystatechange=function(){
if (this.readyState=="complete") { init(); }
}
</script>
(the above works in IE, don't think it works in FF).
... but does this mean, effectively, that every JSONP call requires me to emit another <script> tag into the document? Can I remove the <script> tags that are done?
Yes, every request yields a new <script> tag, and yes, you can remove <script> tags when you're done using the data that it provides to you.
You should consider using a Javascript library for JSONP. OX.AJAST is a simple library I wrote some time ago for doing asynchronous request through script tags (i.e. JSONP) across browsers. YUI also supports JSONP if you're already using that.
Is there a decent way with static HTML/XHTML to create common header/footer files to be displayed on each page of a site? I know you can obviously do this with PHP or server side directives, but is there any way of doing this with absolutely no dependencies on the server stitching everything together for you?
Edit: All very good answers and was what I expected. HTML is static, period. No real way to change that without something running server side or client side. I've found that Server Side Includes seem to be my best option as they are very simple and don't require scripting.
There are three ways to do what you want
Server Script
This includes something like php, asp, jsp.... But you said no to that
Server Side Includes
Your server is serving up the pages so why not take advantage of the built in server side includes? Each server has its own way to do this, take advantage of it.
Client Side Include
This solutions has you calling back to the server after page has already been loaded on the client.
JQuery load() function can use for including common header and footer. Code should be like
<script>
$("#header").load("header.html");
$("#footer").load("footer.html");
</script>
You can find demo here
Since HTML does not have an "include" directive, I can think only of three workarounds
Frames
Javascript
CSS
A little comment on each of the methods.
Frames can be either standard frames or iFrames. Either way, you will have to specify a fixed height for them, so this might not be the solution you are looking for.
Javascript is a pretty broad subject and there probably exist many ways how one might use it to achieve the desired effect. Off the top of my head however I can think of two ways:
Full-blown AJAX request, which requests the header/footer and then places them in the right place of the page;
<script type="text/javascript" src="header.js"> which has something like this in it: document.write('My header goes here');
Doing it via CSS would be really an abuse. CSS has the content property which allows you to insert some HTML content, although it's not really intended to be used like this. Also I'm not sure about browser support for this construct.
The simplest way to do that is using plain HTML.
You can use one of these ways:
<embed type="text/html" src="header.html">
or:
<object name="foo" type="text/html" data="header.html"></object>
You can do it with javascript, and I don't think it needs to be that fancy.
If you have a header.js file and a footer.js.
Then the contents of header.js could be something like
document.write("<div class='header'>header content</div> etc...")
Remember to escape any nested quote characters in the string you are writing.
You could then call that from your static templates with
<script type="text/javascript" src="header.js"></script>
and similarly for the footer.js.
Note: I am not recommending this solution - it's a hack and has a number of drawbacks (poor for SEO and usability just for starters) - but it does meet the requirements of the questioner.
you can do this easily using jquery. no need of php for such a simple task.
just include this once in your webpage.
$(function(){
$("[data-load]").each(function(){
$(this).load($(this).data("load"), function(){
});
});
})
now use data-load on any element to call its contents from external html file
you just have to add line to your html code where you want the content to be placed.
example
<nav data-load="sidepanel.html"></nav>
<nav data-load="footer.html"></nav>
The best solution is using a static site generator which has templating/includes support. I use Hammer for Mac, it is great. There's also Guard, a ruby gem that monitors file changes, compile sass, concatenate any files and probably does includes.
The most practical way is to use Server Side Include. It's very easy to implement and saves tons of work when you have more than a couple pages.
HTML frames, but it is not an ideal solution. You would essentially be accessing 3 separate HTML pages at once.
Your other option is to use AJAX I think.
You could use a task runner such as gulp or grunt.
There is an NPM gulp package that does file including on the fly and compiles the result into an output HTML file. You can even pass values through to your partials.
https://www.npmjs.com/package/gulp-file-include
<!DOCTYPE html>
<html>
<body>
##include('./header.html')
##include('./main.html')
</body>
</html>
an example of a gulp task:
var fileinclude = require('gulp-file-include'),
gulp = require('gulp');
gulp.task('html', function() {
return gulp.src(['./src/html/views/*.html'])
.pipe(fileInclude({
prefix: '##',
basepath: 'src/html'
}))
.pipe(gulp.dest('./build'));
});
You can try loading them via the client-side, like this:
<!DOCTYPE html>
<html>
<head>
<!-- ... -->
</head>
<body>
<div id="headerID"> <!-- your header --> </div>
<div id="pageID"> <!-- your header --> </div>
<div id="footerID"> <!-- your header --> </div>
<script>
$("#headerID").load("header.html");
$("#pageID").load("page.html");
$("#footerID").load("footer.html");
</script>
</body>
</html>
NOTE: the content will load from top to bottom and replace the content of the container you load it into.
No. Static HTML files don't change. You could potentially do this with some fancy Javascript AJAXy solution but that would be bad.
Short of using a local templating system like many hundreds now exist in every scripting language or even using your homebrewed one with sed or m4 and sending the result over to your server, no, you'd need at least SSI.
The only way to include another file with just static HTML is an iframe. I wouldn't consider it a very good solution for headers and footers. If your server doesn't support PHP or SSI for some bizarre reason, you could use PHP and preprocess it locally before upload. I would consider that a better solution than iframes.