I'm using golang as the backend for a medium-sized web app which has a few pages and a lot of CSS and javascript in different folders, I'm trying to serve the website using golang but only the index file loads , the other pages, javascript, CSS doest load. since my HTML files, all are different from each other I'm not using templates
here is the file structure
-static
-assets
-css(folder with subfolders)
-js(folder with subfolders)
-pages (folder with differnt html pages)
-signup.html
-dashboard.html
-index.html
-register_bundle.js
-main.go
func handlerequests (){
myRouter := mux.NewRouter().StrictSlash(true)
myRouter.Handle("/", http.FileServer(http.Dir("./static")))
myRouter.HandleFunc("/transaction", transactionHandler)
log.Fatal(http.ListenAndServe(":8080",myRouter))
}
my HTML files have links like these, (showing index.html)
<!-- CSS Files -->
<link href="./assets/css/bootstrap.min.css" rel="stylesheet" />
<link href="./assets/css/paper-dashboard.css?v=2.1.1" rel="stylesheet" />
<!--JS files -->
<script src="./assets/demo/demo.js"></script>
<!--Main Script file for the page -->
<script src="./register_bundle.js"></script>
errors shown here
The problem is browser cannot find those JS and CSS files.
fs := http.FileServer(http.Dir("./static"))
MUXRouter.Handle("/", fs)
MUXRouter.PathPrefix("/assets/").Handler(fs)
MUXRouter.PathPrefix("/pages/").Handler(fs)
MUXRouter.Handle("/register_bundle.js", fs)
That way a GET request to http://[host]:[port]/css/style.css will return style.css from the relative ./static/css/ directory. The above code is working in my sample program.
try
gor:= mux.NewRouter().StrictSlash(true)
fs := http.FileServer(http.Dir("./static"))
gor.PathPrefix("/transaction").Handler(fs)
it probably should work if it doesnt just try reading documentation for http.FileServer
did you try serving a handler fot your resources folder?
sdir := "/resources/"
myRouter.PathPrefix(sdir).Handler(http.StripPrefix(sdir, http.FileServer(http.Dir("."+sdir))))
this allow you to access the foloder as a subdomain.
Related
In the app I'm working on, the script and link tags in the Razor view use the tilda slash in the path, which is common in ASP.NET MVC 4 apps:
<script type="text/javascript" src="~/Scripts/file.js"></script>
which as expected, produce the HTML with root-relative URLs:
<script type="text/javascript" src="/Scripts/file.js"></script>
Based on the solution from here, I need to implement an 'export to offline HTML' feature, which is meant to create offline HTML file out of a Razor view so that users can load the HTML from their disk.
The issue
The issue is with the root-relative path. When I load the exported HTML file from disk, the script tag above will try to load from "file:///C:/folder/Scripts/file.js" where "C:/folder/" is the location of the HTML file I created.
What's the simplest/best way in order to make work for both when running in ASP.NET and as a local file?
Ideas
I could just change the path in the Razor view to a relative URL like:
<script type="text/javascript" src="Scripts/file.js"></script>
but that's not what I want, as it can have different implications.
Is there a way to make the rendering the Razor view to HTML in a way so that it produces relative path from tilda slash?
How does ASP.NET convert the tilda slash "~" to the root-relative path "/" ? Can I override that?
I looked over some of the same questions on stack overflow and tried all the best answers. None of them worked.
I am learning html5 with CSS stylesheet. I looked over a website tutorial of building a web page with login form by flask.
So it has this base.html file which has some code links to a css file:
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>RELAX AND WORKOUT</title>
<link rel="stylesheet" href="bulma.css" />
</head>
Originally, followed by 'href' was a http link and it worked. But I downloaded the same css file and put it in the same folder as the base.html file so I can play with this css file.
They are both at ./project/templates/the_file
This is the link to download the css file: https://cdnjs.cloudflare.com/ajax/libs/bulma/0.7.4/css/bulma.css
It was also originally the tutorial author put after 'href='. But when I changed it to my local file name 'bulma.css', it does not load the stylesheet at all.
I also tried absolute path and relative path. Neither of them worked.
I'm running it on Windows 10. Using Python 3.7 and flask.
So in my case, how do I make the html load this local css file?
Edit:
Ok, I made it work eventually.
I made a new folder called "static" and put the css file inside it. Then I changed the path to this:
<link rel="stylesheet" href="../static/bulma.css" />.
Does it mean flask treats the "templates" folder as a special folder only for html templates, it does not recognize other file formats?
But I saw a question which the person put his css file in the same directory. The answer is to just add a dot and it worked. That was why I put it with all the other html templates in my templates folder. But it never worked in my case.
From flask docs:
Flask automatically adds a static view that takes a path relative to the flaskr/staticdirectory and serves it. The base.htmltemplate already has a link to the style.cssfile:
{{ url_for('static', filename='style.css') }}
You need to create a folder called static inside your flask app directory with your static files inside, ex.: CSS, images, etc.
In your html code use:
<head>
<link rel="stylesheet" href= {{ url_for('static', filename='bulma.css') }}>
</head>
Try changing your href="bulma.css" to href="./bulma.css" and see if it works.
Are you sure you don't have to go into the templates folder? "/templates/bulma.css"
Hit F12 to open up the development pane. Go to the network tab. Refresh the page. Is the file listed in that list? You may have to refresh your cache to have it take effect. To do that: CTRL+SHIFT+R. If the file is listed in there you can view the preview to make sure it's current, if not you will still need to do a force refresh on the cache.
As for URL's you can also use an absolute file path starting at the root with href="../project/templates/filename.css" (use 2 periods). The following is a website for more info on this:
https://www.w3schools.com/html/html_filepaths.asp
Good Day, I'm learning CodeIgniter with Smarty. My CSS file is stored in
/App01/application/views/css/main.css
To link my CSS I use:
<link rel="stylesheet" type="text/css" href="http://localhost:88/APP1/application/views/css/layout.css" media="screen" />
But CSS is not applied on my page. When I open CSS URL, I get a message:
Forbidden
You don't have permission to access /APP1/application/views/css/layout.css on this server.
Please, what am I doing wrong? I'd like to keep my CSS together with the view because in future I'd like to learn how to create multiple themes and I thing the CSS should be kept within the theme folder.
Can I replace URL path to CSS file with some Smarty variable so that when I move my application I do not need to change CSS URL path in templates manually?
Thank you in advance! Vojtech
Anything in the /application folder of CodeIgniter should be considered out-of-bounds. For the best security, you should actually consider keeping /application above your www or public_html folder in a structure such as this:
– application
– controllers
– models
– views
– ...
– system
– core
– libraries
– ...
– public_html
– index.php
This makes your application code safer.
I’d advise creating your client-side scripts and CSS in a public folder. For example public_html/css and public_html/js. Or, if you wanted to go down the theme route, possibly name each CSS file as the name of the theme, so you’d have css/theme1.css and css/theme2.css.
If your site will always work from the root of a domain, then you can just use:
<link rel="stylesheet" type="text/css" href="/css/layout.css" media="screen" />
But if you feel that you’re going to be moving all sorts of things around, then consider preparing the file location in your controller before sending it to Smarty.
$this->load->helper('url');
$this->smarty->assign('css_file', base_url("css/theme1.css"));
That will return:
http://localhost/app1/css/theme.css
Or whatever your CodeIgniter URL is.
This will help to link css to codeigniter.
The link_tag is used to link resources and you can use helper function.
For example html helper, url helper, email helper, etc.
In your controller you have to create a function something like
<?php
class Home extends CI_Controller{
public function helper(){
$this->load->helper('html');
$this->load->view('index');
}
}
?>
And your index.php in view folder use link_tag keyword.
<html>
<head>
<title></title>
<?php echo link_tag('App01/application/views/css/main.css');?>
</head>
<body>
<?php
.......
?>
</body>
</html>
Try adding a symlink to your servers document root folder. (www/public_html/htdocs)
cd (document root folder)
ln -s (/App01/application/views/css) .
This way you can access your css folder and keep the current structure.
I have an IIS web site. This web site contains other web sites so the structure is like this.
\
MainWebSite\
Scripts\
CSS\
App1\
Scripts\
CSS\
App2\
Scripts\
CSS\
All sites are ASP.NET MVC web applications.
In the MasterPage of App1, I reference the script files like this:
<script type="text/javascript" src="../../Scripts/jquery-ui-1.8.custom.min.js">
</script>
The problem is that it now tries to find the file at http:\server\MainWebSite\Scripts....
How can I work around that? Should I put all my scripts and CSS files into the root directory, is that a preferred solution?
In ASP.NET there is a great function that is part of the Page Object:
ResolveUrl(String)
This is used by passing in a relative string, but the best part is you can use the ~ to symbolize the root of your website:
<script type="text/javascript" src='<%=ResolveURL("~/PATH_FROM_ROOT/Scripts/jquery-ui-1.8.custom.min.js")%>'></script>
[Note the single quotes.]
Try this
<script type="text/javascript" src="~/../Scripts/jquery-ui-1.8.custom.min.js" runat="server"></script>
In the above markup, I'm assuming that your script files are in MainWebSite\Scripts\
"~" brings your reletive reference from your application root directory. The benefit is that if you shift your master page file from MainWebSite\App1\ to MainWebSite\App1\MasterPages\ you will not have to change all the relatively referenced urls in your master page.
The best solution is to use absolute URLs for CSS and JavaScript. Using an appending global variable you can also use it on your development system, too.
I got "dump" isp that always cached internet pages and its css for at least 1 day.
Although the css / js in the server changed, the presented css are not changed (i have been clear my cache everytime)
how to "tell" my isp not to cache some files like css and js ?
thank you !!
at the moment: i'm using proxy to check a under developed web so that it don't get cached ..
The way Stack Overflow itself solves this problem is to add a version parameter to the CSS and JS URLs, which refer to the version of the referenced files:
<link rel="stylesheet" href="http://sstatic.net/so/all.css?v=4542">
Every time the referenced files change, the href attribute of the link tag is updated in the HTML code, thus supporting caching and updated referenced files.
You could try to append some random string to every request of an external file like:
<link href="/css/style.css?cachekiller=1337" media="screen" rel="stylesheet" type="text/css" />
where the 1337 in the above code should be generated randomly for every request e.g.
<?php time() ?>
or something
You can include these documents directly in your HTML files, between <script> or <style> tags. It will obviously make all your HTML files bigger, but that's basically what you're asking.
It's the only way you can be 100% sure that your CSS and JS is not cached at all.