Make local development work with Facebook/Google APIs - ruby-on-rails

I'm working on implementing omniauth into a Rails project. My problem is that the authentication providers - Twitter, Google, Facebook etc all require me to create an application with a url that limits authentication requests from anywhere other than the url. I need to be able to to test locally but also run code in production, but Facebook for example doesn't allow 2 domains and doesn't allow localhost anyhow.
So what are my options?

At work, we have multiple applications setup for the different environments. On local, add an entry in /etc/hosts (assuming you are on linux) eg: 127.0.0.1 mydomain.local.
On the facebook app setup for the local environment, add this as the url. Most things, except where facebook needs to scrape your site (Like buttons) work.

Here's a blog post with my solution: http://make.bettermistak.es/2012/05/03/how-to-create-a-local-sandbox-facebook-app/
Here's the relevant bit: "Facebook verifies that all requests for your app are coming from the right domain–they don’t allow requests from localhost or 127.0.0.1–and this info can be updated in your apps settings under Hosting URL. Add “local.herokuapp.com” to your Hosting URLs and save this setting. Then edit your /etc/hosts file so that local content is under the domain local.herokuapp.com. This file is hidden, so from the command line enter sudo vi /etc/hosts. (Substitute your favorite editor for vi.) We need to use sudo, because this file is locked. Add the line “127.0.0.1 local.herokuapp.com” below “127.0.0.1 localhost” and save and quit your text editor."

As far as I know, you must sing up two apps for you app.(one for remote side, one for local side)
Fortunately, there is a way to reduce the complication(Assuming you are working on linux):
You can configure you .bash_profile (local machine and remote machine separately):
export YOURAPP_APP_ID="XXXXX"
export YOURAPP_APP_SECRET="XXXXX"
And use ENV['YOURAPP_APP_ID'] and ENV['YOURAPP_APP_SECRET'] in your code.
For example, you can code like this in rails:
config.omniauth :facebook, ENV['YOURAPP_APP_ID'], ENV['YOURAPP_APP_SECRET']
By this way, you can use the same code in both local and remote side. It will be much easier for maintaining.
If you are using Heroku to host your application, you can refer to this page to config the environment variables.

I have created two apps on Facebook one of which i run in sandbox mode for development purposes. Would that be an option for you?

Related

403 error in Chrome when attempting to authenticate Cloud Run developer

Background:
I've got a project in Cloud Run with two services, both mapped to custom domains. The production site is mysite.com and the development site is dev.mysite.com. I deployed the development site with the --no-allow-unauthenticated flag to prevent public viewing. I want developers to be able to view the site in a browser though. Based on what I've read the "solution" Google currently has isn't great. You have to run the command gcloud auth print-identity-token to identify your Bearer token then use the ModHeader browser extension to modify the request header. The token is constantly changing and having ModHeader enabled to change the request header breaks authentication on other pages, so it is big PITA, but it works, mostly.
Question:
What doesn't work is having the development site load images from the Google Cloud Storage Bucket. Every resource which should be pulled from the bucket results in a 403 error for that resource, but the page loads fine otherwise. I'm the project owner (i.e. my email address is the "owner") and have admin rights on everything including the bucket in question. The bucket's Access Control is set to "Fine-grained: Object-level ACLs". When I deploy the project using the --allow-unauthenticated the images are accessible. Why isn't the bucket honoring my token?
Update:
I'm not 100% sure, but I think the issue might be related to the fact that ModHeader applies its rules to ALL open tabs. I tried another header modification extension named Requestly which allows rules to be targeted to specific URLs and now my development site is loading images as expected.

Is it possible to share my localhost with someone on a different network?

I am working with a designer and I'd like them to have access to the interactions I've implemented on the site we're working on. However this time, I have 2 issues. My localhost is configured to a subdomain:
http://store.teststore:3000/ and we're on different networks. Is there anyway to work around this?
ngrok should work for you. Download and install it following these instructions here: https://ngrok.com/download. Documentation on how it is used can be found here https://ngrok.com/docs. Once installed running the below command should work for you (depending on the hosting environment):
ngrok http -host-header=rewrite store.teststore:3000
You will need to give the URL generated by ngrok and displayed in the cmd prompt to the designer.
Update: Handling absolute redirects
Based on your comment it sounds like, after login, your site does an absolute redirect (the full URL is specified). If it is possible I would change your code to do a relative redirect where the domain is omitted. You could also make your root domain configurable in the absolute redirect and configure it to be the ngrok domain provided for now. Lastly, you could attempt to configure your DNS with a CNAME record following ngroks Tunnels to custom domains documentation. This last option, however, requires a paid for ngrok subscription.
Install ngrok if you haven't yet and CD into your project directory and invoke ngrok. Note Your application must be running locally on the same port number ngrok will be running.

On local development with Wordpress on iOS, resources fail to load

Have been developing a Wordpress theme using MAMP (localhost:81), and I am now testing some responsive parts on iOS (using my IP (192.168.1.15:81).
Some images are hard-coded (i.e. not changeable from the admin), using the following code:
<img src="<?php echo get_template_directory_uri(); ?>/images/brand-id.svg" onerror="this.src=<?php echo get_template_directory_uri(); ?>/images/brand-id.png" alt="Brand Name" />
It displays correctly both on localhost and IP, from desktop, but using the IP on iOS (8.1), it cannot find the resource, because it loads it in this form:
http://localhost:81/alexe.ro/wp/wp-content/themes/brand/images/brand-id.svg
I am using the Relative URL Wordpress plugin, but that seems to only work for loading the css/js/fonts.
Other details: the dynamic images (the ones uploaded from the cms) load perfectly.
How can I get the 'hard-coded' resources to switch between localhost and the IP, if necessary?
Thank you in advance.
The problem isn't related to IOS, it will fail to read the correct path from any machine in the LAN, apart from your dev one.
One of the solution is:
To make WP to always run under http://IP:port rather than http://localhost:port
In your case, it looks like your WP is in a sub directory /wp, then login to admin panel, and go and update as below:
Settings > General > WordPress Address >> http://192.168.1.15:81
Settings > General > Site Address >> http://192.168.1.15:81/wp
It's also recommended to set the dev machine with a static/preserved IP address on the router, so it will always receive the same one.
I also like the solution posted by #asherstoppard Well, you can play around and find which fits you the best.
One more tip: Backup your database first, in case anything bad happened.
Try adding the following to your wp-config.php file.
define('WP_HOME','192.168.1.15:81');
define('WP_SITEURL','192.168.1.15:81');
Your site_url() will be set to localhost:81 and as such will be attempting to access localhost on your device through get_template_directory_uri().

setting up subdomain in url locally

I am creating a rails application where we have functionality for registering a new User is there and there we are providing separate sub domain for each user by their user name.
so i want to map
user_name.localhost:3000.com where user_name is dynamic
Run your local development server with pow. If you symlink the app to the foo, than your pages are available under http://foo.dev, but also under every other subdomain like http://bar.foo.dev. There is no need to register a list of subdomains somewhere.
prax might be an alternative when you are on linux.
Access like this. No configuration required
user_name.lvh.me:3000
I have figured it out.
Actually the application is using subdomain_fu gem for creation of the subdomain and when the user is created the subdomain is name is saved in the db and the can accessed by making configuration into the file C:\Windows\System32\drivers\etc\hosts and map the ip which is being hit like ;
192.xxx.xx.xxx user_name.your_subdomain _name
and hit the url like this ;
user_name.your_subdomain _name:3000
It is working fine with me doing these steps.
Thanks to all for their valuable feed back.

Setting Up a Test Environment For an ASP.NET MVC3 Website

I've been working for a client's website over the past year. I usually test things locally and then deploy straight to the production website. This has caused us some issues lately so I thought I should create a test/staging environment in which we could thoroughly test new features before pushing them into production.
Anyway, we have a VPS hosting account. I usually use remote desktop to manage the website in IIS. So in order to create a test environment, I copy pasted the folder of the production website inside the same directory (so they are both at the same level) and changed the name of the folder. Then I created a new website in IIS and mapped the physical path to the httpdocs folder inside the copied folder. After that, I setup a new application pool which basically has the same settings of the production website's application pool. I also changed the connection string of the test website.
But then when I tried to view the test website, it did not work the way I expected it to do. I keep getting &ReturnUrl=%2f appended to the query string, and the website is stripped out of its styles (the CSS). I remember this used to happen before when we were still using a shared hosting account, but I have no idea how to fix that.
I really do not know what's wrong. I basically have the same exact setup except I'm using a different port and a different database. I even tried running the test website with the application pool of the production website, but that did not work either...
Any suggestions?
looks like permission problem to me, check if your user has correct privileges in the new folder/app pool :)

Resources