AngularJS route stops working on a local port - angularjs

I am using AngularJS to build a web app. I use ngRoute for routing and templating. I use gulp-serve to start my website locally. Once for few days it suddenly stops working. After I change local port it works ok.
For example: First it worked on port localhost:3000, but stopped and doesn`t work anymore
then the same with ports 3001,3002,3003,3004
Stopped working means it doesnt load template any more. If I try to access template file directly it is ok, but angular isnt loading it. In debug console there are no messages.
Can somebody explain how is it possible.

I guess I am not in a position to give you a 100% perfect explanation of this issue, but I am assuming that somewhere in your gulp-serve config the default to serve your app is set to port:3000. By attempting to reach the other ports you listed your app is not loading...

The problem was somewhere in cookies. After I clear cookie it goes ok. I use Auth0 service for logging. Maybe the problem is somewhere in their angularjs sdk.

Related

Call a locally hosted server from Expo

I have followed this great blog post: How to call a locally hosted server from Expo?
However I get stuck at the next step:
The above command will return a URL accessible across Internet of the form https://application-mock-server.localtunnel.me. This URL can be plugged inside the React Native code base and will be accessible from the application running inside Expo on the mobile.
I have tried to figure out how to "plug the localtunnel URL inside the React Native code base". I thought that it would be "homepage" in "package.json", but so far no luck. Can you please help?
Never mind. I haven't noticed this "tunnel" option until now, which does the trick.
You need to specify that URL where you are sending API request. If you have not created a separate file, you can create apiConfig.js file or any similar named file and export that URL from the file and reference where ever you need to call the backend API.

ui-router doesn't load states

i have little problem with my code:
https://github.com/burnpiro/angular-blog
live version is available on http://erdem.pl/#/
Problem is that after deploying it on my server routing doesn't work. ui-router not even trying to load template or controller into ui-view. Application starts and configs are fired (tried with console.log). Even resolve option in home state is fired (PostService). But somehow it cannot load template. If i access template manually:
erdem.pl/components/home/home.html
it is there. The same with controller. If anyone have any ideas please let me know. It happened after deploy. Before that on my local machine it seems to work fine but now after getting project again and deploying it on my local it has the same error.
There is no JS errors or any network errors.
Thanks for help,
I'm not completely sure, but I think the issue is with the host you've set in your config.js file? This should be pointed to the public link for wherever your api lives. Should it be "http://erdem.pl"?
I've also noticed that Restangular doesn't seem to be sending your requests. I see that the execution gets into the RequestInterceptor, but I don't see them in the Network tab of my developer tools. This means that your promises from your resolve properties on your states will never be resolved. Your states are configured to wait for these resolve requests to resolve before initializing the controller and loading the template.
EDIT: I think I found the issue!
Looks like Restangular is only compatible with Lodash 3.10, anything after that causes compatibility issues. Downgrade to 3.10 and hopefully it works for you!

AngularJS e2e tests hang when changing between two separate angular apps

I have a frustrating problem: I want to write end to end tests for a complex angular app. The problem is that the login screen is a separate app. The initial idea was that it would branch out to separate other angular apps in our ecosystem based on the login credentials. It works like a charm. For the tests it is a nightmare though.
The tests work as expected but as soon as correct credentials are entered and the main angular app is loaded the tests just time out. No error message or debug output whatsoever, its just waiting. I can see the page is loading correctly.
Now I thought I would skip this part and test right on the target app but thats not working either since I need to initialize the server with the right credentials first (= go through the login screen).
I tried this with the karma scenario runner and protractor, both show the exact same behavior. Can I tell them to reinitialize after the target page is loaded?
So when protractor times out, the error message shows a link to the faq. Right on top there's the explanation for this problem. Apparently the app sends continuous requests (maybe because I am using socket.io), so Angular is never finished.
This problem has nothing to do with the separate apps.
The issue link was very helpful. Since I am not willing to touch any of the pages code I settled with
browser.ignoreSynchronization = true;
and
browser.sleep( ... );
The tests now work as expected.

running an AngularJS app in general

I am taking baby steps with AngularJS. I am a bit confused about requiring a webserver to run an AngularJS sample or demo. The reason is for study purpose I have downloaded running examples and demos, but not having any luck with it. A very simple demo of displaying a name is not working for me. Do I have to do anything specific to get a simple app running. I feel very weird asking my doubt requing a webserver as AngularJS is a client side Framework. Nevertheless, hoping someone can throw some light on this.
Thanks in adavnce.
If you use Firefox, then you don't need any server to have your basic app running. If you use Chrome, then for security reasons it doesn't like file-access to librairies. Librairies must be serve in another way. So you can have the hello-world AngularJS working by opening the classic index.html with Firefox, so that you don't have to start any web server.
Here is a sample application with explanations in the README :
https://github.com/davidb583/white-angularjs-app
Actually, you don't need a webserver to run AngularJS application since it is client-side framework.

FB.getLoginStatus never fires the callback function in Facebook's JavaScript SDK

The simple thing of calling FB.init (right before </body>) and then FB.getLoginStatus(callback) doesn't fire the callback function.
After some debugging, I think the SDK is stuck in the "loading" (i.e. FB.Auth._loadState == 'loading') phase and never gets to "loaded", so all callbacks are queued until the SDK has loaded.
If I force-fire the "loaded" event during debugging - with FB.Event.fire('FB.loginStatus', 'loaded') in case you're intersted - then the callbacks are invoked correctly.
Extra details that might be relevant:
My app is a facebook iframe app (loaded via apps.facebook.com/myapp)
I'm using IE9. The same behavior happens in Chrome
The app is hosted in http://localhost
What's going on? Why is the SDK never gets to loaded?
Thanks
UPDATE: Just tried it on Chrome and it worked (not sure why it didn't work before). Still doesn't work in IE
I had this same problem in Firefox 3.5 on Windows, but only on the very first log in to the page (probably because it was a slower machine and there was some weird timing issues going on).
I fixed it by forcing FB to refresh the login status cookie every time it checks:
FB.getLoginStatus(callback, true); //second argument forces a refresh from Facebook's server.
Without "force=true", sometimes it wouldn't fire the callback.
I had the exact same problem, and I solved it disabling "Secure Browsing" in the Facebook Security settings. Keeping Secure Browsing on forces the pages as "https", but I had no "Secure Canvas URL" set up, and this gave me a lot of errors in the console as well.
Hope this may help someone :)
In my experience, getLoginStatus() never calls the callback in Firefox when third-party cookies are disabled.
The original poster mentioned his application is hosted on http://localhost. I've never had luck with that, and believe it will cause problems.
Just today, I've had problems where getLoginStatus is not calling the callback on any browser, unless the user is actually connected to the app! I'm hoping this is a bug on facebook's end that they will solve.
Yet another possibility for FB.getLoginStatus not firing its callback is when using a "test" user account that has not been authorized to view that application. Its pretty bad that facebook doesn't give you any error messages.
I have also seen failed callbacks on bad appIds and redirectUrls.
I also ran into this issue specifically in Chrome. I tried calling it on page load and after a user-initiated action with no success.
It turned out that it was not a cross-domain issue. The getLoginStatus() call was being blocked by the Un-Passwordise extension in Chrome. As soon as I disabled the extension, it worked perfectly, even on page load.
More info about this issue here: Chrome-only cross-domain scripting errs in Facebook iFrame App upon FB.Login(..)
I understand that this question is a little old now, but I ran across it searching for solutions.
Double-check what you have set in your Facebook app configuration under the section "Website with Facebook Login". The Site URL domain must match the domain your page with the FB.getLoginStatus (and other related auth Javascript) is served from.
After hours of struggling, I realized that I could not reuse an existing app configuration I had on a new server and had to create a new app to handle the website login for this new server.
The other answers are probably equally valid in your specific case, but since there may be others like me who have struggled for a while on this, hopefully this gives you one other place to check. Making a new app with the correct Site URL was the answer in my particular case.

Resources