I followed a tutorial on angularJS with subviews using ng-views
I'm using html5Mode in my locationProvider and a nodejs backend
If I wanted to link to or hit refresh while on a specific ng-view, I could use a hashtag. So like, to explain: if my angular app lived on localhost:3000/app and I had a view at localhost:3000/app/subview, if I hit refresh my node server didn't know how to go to a specific view on the front end.
But if, on the server side, a request came through for /app/subview and I redirected to or rendered /app#/subview (with the hashtag in there), then I went to the correct ng-view on the front end. That's what I wanted. Of course, there's more than one way to skin a cat I guess, but it was working.
Now, I'm trying to do that again. But this time it's not working.
If I try to go to localhost:3000/app#/subview via a link or refresh, instead of going to the ng-view that lives at /app/subview like it did before, it's going to /app#%2Fsubview instead. And I'm ..heh .. heh.. not sure what's different. I thought I was doing everything exactly the same.
Has anyone had this problem? Does anyone know what is happening?
Edit:
I think I kind of found a workaround. If I set base href = "/app" in the head of the html document, and then respond to a request to app/subview with a redirect to app#/subview, then I can serve up app with the correct subview (only the url goes to /subview). I think this might be acceptable for me even if it's not quite ideal but OH WELL
Related
I am working on an angular application and i have used "$locationProvider.html5Mode(true)" in my route config to avoid /#/ in URL. I have also added base href="/" in index.html and everything is working fine on refresh of pages.
But when i am trying to refresh the page having URL
"http://localhost:3000/home/:JavaScipt%20SC2.0"
Then i am getting Cannot GET /home/:JavaScipt%20SC2.0 error.
I think error is due to name "JavaScript SC2.0" containing .(dot) symbol. Any clue to fix this issue?
But when i am trying to refresh the page having URL
"http://localhost:3000/home/:JavaScipt%20SC2.0"
Your route has at least two problems:
First, document name misspelled, shouldn´t it be JavaScript? (with R)
Second, you can´t use home/ : Jav... (/:Javascipt??)
try again with http://localhost:3000/home/JavaScript SC2.0 into a variable and pass it.
More info in this link
PS: If (whoever) knows so much that can mark my answer as not valid, please ALSO post a valid answer, not just a negative ;)
you can try on send it on another state:
or you can use the $window dependency into your controller, and use as javascript.
First of all, sorry for the lame question (probably). I tried to search for an answer but I'm not finding everything I need for my issue.
So... I have a bootstrap website and I am trying to change the page URLS to appear like this :
For example : www.site.com/AboutUs.html - to appear as www.site.com/about-us
I am using the pushState method for this as it follows:
var stateObj = { AboutUs: "about-us" };
history.pushState(stateObj, "About Us", "about-us");
So I get the needed URL address there (www.site.com/about-us).. so far so good. But on page refresh it throws an error stating "The requested URL /about-us was not found on this server."
If I hit the back browser button it goes to www.site.com/AboutUs.html again.(and it is supposed to go on the home page)
My question is :
What am I missing, am I supposed to make a controller and how ?
I am not using C#, I can probably use some help with PHP because I am not good at it. JavaScript / jQuery are welcomed.
Thanks in advance and sorry for the dumb question.
Happy days!
The point of pushState is to be able to say: I have modified the page with JavaScript, the new state is what you would get if you just asked the server for this URL.
You shouldn't use JavaScript for this problem at all. You just want to have a page appear at a particular URL.
You need to configure the server to serve up the content you want on the URL you want.
What am I missing, am I supposed to make a controller and how ?
You need something on the server to handle the URL /about-us.
"A controller" is something you would probably use if you were using the MVC architecture on the server … and it doesn't sound like you are.
More likely you will be wanting to use an Alias, a tool like mod_write, or simply moving the static file to a directory called about-us and renaming it index.html.
So, some quick context: I'm building an electron app, so all paths/urls are from file system. Web window starts with a small form, with user/password, and then it redirects to the main app that uses angular. The form is using GET, by the way.
After the redirect, the plan was to get the query parameters with $location, but angular is adding a hashtag and slash at the end of it, and when I try to $location.search() it gives me an empty object.
$location.absUrl() is returning: file:///C:/blablabla/main.html?user=abc&password=123#/
So my guess is that hashtag at the end is ruining all my plans. And it's weird, because I'm not using any $route/$location/$state configuration. By the way, the window.location object has the correct path without the hashtag, so I'm guessing this is angular's fault.
I did some search and found some recommendations to use html5Mode, but after trying it seems to not work the way I need, since it needs a baseurl tag with a path.
Any help is going to be appreciated, thanks
I'm building a simple marketing website with Jekyll, and using Backbone's routing and history behind the scenes to handle navigation. Each page of my site is its own HTML file, and my strategy is to preventDefault() on links between pages, fire off a jQuery.get() to grab the new HTML, and replace my div.content with the information from the new page.
I know this setup is a little out of the ordinary, but I have my reasons: a single-page structure is preferable because I want precise control over page transitions, and I want to avoid requesting my webfonts each time the user navigates to a new page. Keeping the HTML files static and separate is also a win for search engines.
Here's the issue: everything works fine when I start from my root URL, but when I begin at a different page, e.g. mydomain.com/page1, the history breaks. During initialization, my Router attempts to route me to the page I'm already on, resulting in a 404: Could not GET mydomain.com/page1/page1. I can prevent this with a hacky isFirstLoad boolean, but that obviously sucks, and it doesn't breaks when I start clicking around and use the back button to return to /page1.
I recognize that one solution is to write some server-side logic that serves my index.html regardless of what URL is hit. I'm not sure how to do this, however, particularly for a local environment. Is it about PHP or .htaccess? Is this even what I have to do? Am I going about this totally the wrong way?
Thanks!
Yes, one solution would be to serve every request with index.html. But that has a big downside: your site is no longer accessible by search engines. To keep the SEO benefit of having a static site, I'd suggest you shy away from that option.
I think the optimal solution is already provided by Backbone. From their documentation:
If the server has already rendered the entire page, and you don't want the initial route to trigger when starting History, pass silent: true.
So, first make sure that your Router is configured properly and all the routes match up with your static pages, and instantiate the router.
Then, start the History like this:
Backbone.history.start({ pushState: true, silent: true, root: '/' });
Push State will help keep the URLs friendly. The Silent flag tells Backbone that your static server served the page already, and it's just loading in after the fact (what you want). And the Root configuration ensures that Backbone knows what the true root of your site is (so you don't get the page1/page1 nonsense.
In my experience, getting routing set up properly can be a little fickle...so best of luck!
I have the following problem:
HTML blank page on server 1.
WordPress site on server 2.
What I need is to call the content from www.wordpress.site/sample-page/ to HTML page on server 1, but not the entire page, only the part that I can edit from wp-admin; so without header and footer.
Also, I don't know if there is any other method, but I need it to be done via JavaScript/jQuery or Ajax.
I've used Google, but is hard to get a tutorial for this, I've tried a lot of tutorials, but none is what I need, and I don't know that much JavaScript to make it work.
SO, can someone help me please?
BIG Thanks!
Andrei
L.E.:
I've found this working: http://jsfiddle.net/mdawaffe/hLWdH/
It is working as it is written, if I try to change the domain with mine, will not work.
What script do I have to implement on the server from which the content is called (taken)?
For more information, as you asked:
I have a HTML + CSS + JS template that I will use with phonegap (if you don't know about it, try it, it's very useful) to create a mobile app for Android, iOS, and BlackBerry.
Now, I have this site: m.trafficvoice.ro (I hope I can post links here).
In the 'live stream' page (it's called services.html), I have a HTML5 audio tag/player.
What I need, is to get from www.trafficvoice.ro/whatever-the-name-page, the content, but only the part that I can edit in WordPress (so without header and footer).
Why? Because in the future there will be more stream to add, and maybe some of them will be down due to unknown reason, so I need to update that page, without making an update for the entire app, upload it to the store, wait for approval, the client to download it, etc.
Big thanks!
Andrei
Could you just use an iframe instead? You could modify a template in your theme to not display header/footer and then use that in the iframe.