I'm creating a mobile version of a website using jQuery mobile, but have found the vast majority of the built in functionality is broken.
The problem arises from my URLs, they look like this:
http://www.mysite.com/testurl/(S(3wlciqrhccimwx133y2sivxb))/Home/Logon.aspx
^^^
The bit in brackets is different for each session.
Any use of the back button, or ajax page loading causes this error:
Uncaught Syntax error, unrecognized expression: data-url='/testurl/(S(0f2xpaxk5131rsm1rkmantws])/Home/Index.aspx')
I really, really need help with this, I've bodged my way around most of the problems, but if I could just get the core functionality to work, my life would be a lot easier.
Cheers!
Following on from Alex K's advice, here's edited the edited jquerymobile.js file that allows brackets in the urls - hope it helps someone else:
http://jsfiddle.net/bazzlad/bWUsa/
Related
I'm currently editing an existing web application where I need to improve the codes to protect it from XSS attacks, I researched about it, but most of the articles I saw was for raw HTML and also they don't give a lot of example. I was thinking that I may just need to use some anti-xss libraries, but I'm not sure I'm fairly new to Angular JS so I would like to get some insights first before changing anything
Here are some of the code lines that are said to be unsafe.
Here are sample code snippets of the first 3.
Line 1663:
Line 1686:
Line 1836:
I haven't found an article specific to my case, but the link bellow gives an idea on how to remediate this on a basic level.
https://vitalflux.com/angular-top-10-security-best-practices-vis-vis-security-risks/
So far, I have been using prerender.io to make my angularjs websites seo friendly. I have worked okay when it comes to urls with hashbangs (website.com/#!).
Currently, I am making my websites go to html5mode, which doesn't contain hashbangs on url and looks a way prettier. However, even since I went to html5 url, prerender.io doesn't work properly.
Also, I came up with a Google article that claims their new technology allow the engine render Javascript framework websites automatically (https://webmasters.googleblog.com/2015/10/deprecating-our-ajax-crawling-scheme.html). However, as I use 'Fetch as Google' tool in Google Search Console. It renders very poorly and my title and meta description spit angularjs syntax ({{seo.tile}} or {{seo.desc}}), which are not rendered.
I am quite lost where I should start and fix the problems I came across with. I tried to get away from prerender.io cause I don't think we necessarily need it anymore.
Sorry for my poorly organized post and questions. Let me try to clear and tie the questions below.
1) Do we still need to teach the Google bot about the angularjs?
2) What is the most stable and best practice for AngularJS+ExpressJS SEO? I don't wanna try unstable and easily crashable method for this.
Thank you very much for your time.
EDIT
At the time of writing this article, I didn't know about using javascript compiler such as babel. I will say here make sure use webpack or gulp to compile your ES6 codes into stable ones so that your codes can be written as you expect it to be and works well with any 3rd party tools or pacakges.
It's the era of ES6!!!
Finally, I solved my problem and for future reference and others who struggling with the sample problem I had gone through, let me leave what I found.
First of all, the very reason why I was tremendously confused was that even if I take html snapshot with phantomjs, I saw still bare angular syntax like {{seo.title}} and . Very awkwardly the reason was that I was using ES6 syntax across my angularjs module. Since phantomjs wasn't fully adopted with ES6 syntax, it failed to interpret angularjs module and just spat html with unconpiled angularjs... From this, I came up with a unexpected conclusion that it's not a good time to implement ES6 for production.
Secondly, I would not count on what Google confidently announced that their bots can handle the websites with dynamic javascript frameworks like angularjs. Even if phantomjs works, 'Fetch as Google' tool doesn't give me a good result. Some times (actually very often) it resulted in just empty html file. Since still Ajax crawling is supported as a 'fall back', but more stable method, I would count it rather than counting on their very unstable smart bots.
In conclusion, DON'T BE EARLY ADOPTOR especially if you are making business out of it!! For angularJS SEO, (1) follow the Ajax calling guideline even if considered to be deprecated, (2) Don't use ES6 syntax for serious programming stuff.
I'm using textAngular as a WYSIWYG text editor in an angular app. It is a fantastic library that is essentially plug and play. It works perfectly in Chrome and Firefox.
The problem is when I attempt to paste some text into the textAngular window in IE it simply doesn't work. It doesn't raise any console events, throw any exceptions or anything. On the network, it calls 4 URLs, which are then all aborted. They are:
http://netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css
http://netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.min.css
http://fonts.googleapis.com/css?family=Roboto:400,300
http://www.textangular.com/css/style.css
This network activity does not happen in Chrome and Firefox. So, I think that is where the problem is. But for the life of me I can't figure out what is going on. It doesn't look like this problem has been reported to the textAngular team or has been asked on stack overflow.
Does anyone have an I idea of how I can remedy the situation?
Edit:
Here is a plunk replicating the situation. It is the demo from the github repo, almost verbatim (the link to the textAngular links were dead, and I got ride of the initial text). I'm pretty sure that it is just a problem within the 1.2.2 library and I'm going to report a bug. The version on the main page is 1.2.0. Thanks for you help!
I tested your solution on IE 8,9,10 & 11 without any issues. I did however notice it the page was not formatting correctly no IE. It could be an issue with escape characters.
If you could provide some more details about your system, for example: IE version, the code you tried to paste etc. I think I may be able to sort this one out.
well i've made a responsive website which handles well in mobile devices. Now there are some Phonenumbers on the website which my cliënt would like to be clickable on any Phone so the visitor can call directly. I found that making a link of the phonenumbers works like so:
make a call
This triggers mobilephones to call the number. But it also triggers the webbrowser on any other device to follow the link, which results in "page can't be found"
I'm looking for a good anwser to tackle this problem. I've been searching for a while now but i'm getting a bit tired and frustrated.
I think i've come with a solution but i don't excactly know how to put this in the html.
There are several ways to conditional comment browsers in html. If i could do this with the link part and rule it out:
<!--[if any **none mobile** webrowsers: don't read:]>003164646464
And all mobile browsers read the link.
It seems to me, that this is the most easy way to do this, but i could be wrong...
I hope that someone can give me any pointers, I really appreciate your idea's and help!
THANKS!
There is no easy way to achieve this. You can use different approaches depending how accurate you want to be:
WURFL - most accurate, allows to check user-agent and get browser / device capabilities
You can try parsing user-agent by your own detecting OS - check this answer Detecting a mobile browser
Use css media queries to target devices with small screen
Unfortunately there is no silver bullet for this (at least I don't know one).
Im working with a relatively large backbone codebase, and it seems like whenever I get a javascript error, no matter what it is. The stacktrace that appears in the console looks identical (example below). All of my models/views are created via the backbone .extend method. Does anyone else have this problem, or know how to fix it?? I ususally have to put console.log statements everywhere to find the source of the error and its very time consuming. Thanks.
jquery-1.5.min.js:16 Uncaught InvalidConstructorArgs
d.extend._Deferred.f.resolveWith jquery-1.5.min.js:16
v jquery-1.5.min.js:16
d.support.ajax.d.ajaxTransport.send.c jquery-1.5.min.js:16
You should use an un-minified version of jQuery, Underscore and Backbone when debugging. Life will be a lot easier if you do it that way.
As far as I can tell, you are having a problem with your $.ajax call within they Backbone.sync function, but it is way too difficult to tell when you are working with minified JS.
Upgrading to Jquery 1.6.4 solved this problem