Hosting RESTFul api on sub-subdomain in heroku? - heroku

I was developing this app on Ruby On Rails where I created RESTFul json api hosted on subdomain "api". When testing locally with prax on a linux machine, I was able to test my endpoints by routing to various endpoints like
"api.app_name.dev/resources"
"api.app_name.dev/resources/1".
Now, I have been instructed to host the Rails application on free heroku account for the time being so that other developers can test the api.
However,I can't get it to work. The main application is already a subdomain to heroku app itself.The url for the main application is "app_name.herokuapp.com". I can't connect to "api.app_name.herokuapp.com" as it is the sub-subdomain of the application.
Is there any way I can test my api from heroku? Or possibly any workaround ??

It sounds like you need to set correct subdomain constraint in routes, something like
namespace :api, defaults: { format: :json },
constraints: { subdomain: 'api.app_name' }, path: '/' do
... thing
end
Also, if it helps, check this if of any help

Related

How to have one domain serving frontend and backend?

Let's say I purchase the domain: "www.myapp.com".
I'm planning to run a headless CMS on heroku and a Vue js frontend on netlify.
How can I use the same domain for both apps?
I would like something like this:
Backend: "backoffice.myapp.com"
Frontend: "www.myapp.com"
Is it possible with 1 domain? How do I approach this?
In your domain provider panel you create backoffice.myapp.com subdomain and point CNAME record to heroku. And you set a CNAME record for www.myapp.com to netifly.
Instructions:
Netifly
Heroku

Proxy issue when navigating from micro apps to other micro app in Single-spa Angular application

I am working in micro front end approach using single-spa-angular framework.I have a root container application which runs in 4200 port and 2 micro apps say app1 #5201 and app2 # 4201 port. I am not facing any issues with app2 and its working perfectly as per micro front end approach.
In app1, I have a login component and dashboard component. so when i hit the app1 it hits the login component first (desired flow: it has to check the user profile and authenticate and based on the result it will navigate to dashboard component). For checking this user profile in app1, I am running backend services using application server (which runs #8443 port) and proxy is configured in proxy config.json like this:
{
"/app1/*": {
"target": "http://localhost:8443/",
"secure": false
}
}
and during npm start in app1 it picks up this statement ( --proxy-config proxy.conf.json) from package .json and this is how we configure proxy for backend services in app1.
Now,coming to micro front end, when I hit app1 from root container, I am getting an access denied image instead of dashboard. Internally ,It hits the login component of app1, when I see the network tab, it hits the user-profile method with the 200k status, but the response is the whole html (whatever i have given in index.html of root container) and an access denied image is called and rendered.It is not hitting the backend server itself.
But when I hit http://localhost:5201/app1/app1/app1-user-profile, I am able to see the desired response in the browser.so what is preventing me to get dashboard of app1 when i route from other apps/4200 port?
Can anyone please guide me in this regard? should i need to configure Proxy settings in root container and other micro apps as well ? Can single-spa help me in this proxy configuration?
I had the same problem , my solution was to configure the proxy in the root application, in my case it was a webpack dev configuration.
It is because all the routes which are not defined explicitely in the route component of your "subapp" are redirected by the root application.
Here is my webpack config with the proxy for example
https://github.com/milobella/application-web/blob/master/portal/webpack.dev.js
If you are facing issues in handling proxy inside single-spa angular and your are coming from angular background, trying your app migrate to the micro frontend or working with single-spa , here is the solution which will work like a charm.
Remind that, we cannot serve proxy.config.json just like we used to do in our angular app.
Here, we need to take of proxy config inside the webpackconfig.js of our host or shell or root-config app.
Here is an example,
For better idea, refer my blog : How to handle proxy inside single-spa angular
official docs : Webpack proxy configuration

Using Laravel and Ionic together with Nginx routes

I have an Ionic 3 web app where I'm using Laravel for both the API and the back-end manager with Nova. Ideally, I'd like my setup to be:
Server 1: example.com serving only my static Ionic App
Server 2: api.example.com serving my Laravel API
Server 2: example.com/admin serving my Laravel backend with Nova
This is easy with Laravel forge, except that I want api.example.com and example.com/admin to be powered by the same application. Right now it looks like I would need my code to live as two separate applications, one for api. and one for /admin.
It makes sense that there would be a way to configure Nginx to point both to the same place, but how, and which one, and where?
I solved this with a redirect from /admin to the appropriate destination. You can either do this in nginx or in Ionic.

What is the purpose of STORMPATH_URL exposed to my heroku app?

I'm trying to use stormpath within my heroku application but I'm confused about the purpose of the STORMPATH_URL environment variable exposed to my application.
This variable holds the URL to my Stormpath Application, not to stormpath server URL. So if I used the value of this environment variable to set the base URL to the stormpath server, my calls won't work and fire a 404 exception
HTTP 404, Stormpath 404 (mailto:support#stormpath.com), RequestId xxxxx-xxxx-xxxx-xxx The requested resource does not exist.
But if I leave the client's base URL empty to use the default Stormpath server URL, everything working fine. So what is the purpose of having this environment varibale exposed to my application?
I can see that this URL points to my Stormpath Application, so why do I need it since I can already get my Stormpath Application using it's name?
The purpose of the STORMPATH_URL environment variable (or STORMPATH_APPLICATION_HREF, same thing) is to tell your Heroku application which Stormpath Application resource it should be "associated" with. A Stormpath Application represents your real-world app that has users, roles, and so on. When your Heroku dyno spins up, it needs to know which Application resource it should use to authenticate users, etc.
You're right that you could just look up your Stormpath Application by name, instead of href, but looking up via href is faster. :)
You normally don't have to touch this variable. If you have your Heroku application pointed at the correct Application resource URL in your Stormpath backend, it should just work!

Youtube data API refusing my server side requests

I'm developing an application that uses the Youtube Data API from the server (with node.js) so I have my server side credential key already set up but when I try to get data is always refusing my requests with this message.
Access Not Configured. The API is not enabled for your project, or there is a per-IP or per-Referer restriction configured on your API key and the request does not match these restrictions. Please use the Google Developers Console to update your configuration.
I've my app hosted in Heroku with the add-on Quote Guard Static that gives me two static IP's that I have whitelisted in the Credentials section of the google developers console. I also have the app hosted in modulus.io and whitelisted the IP range 54.0.0.0/8 that is what they gave me for their AWS region... Any of both deployments are working only in my local machine with my home external IP whitelisted.
The funny thing is that yesterday 15 minutes approximately after I whitelisted the 54.0.0.0/8 range, the app API started working in my Heroku host, but today it stopped again (this might be because it has changed to another IP inside their AWS region or something...).
Is there any way to check what IP is doing the requests to the Youtube data api? I can see in the developers console the request reaching the API and been rejected as "errors" at least I know that their are getting the requests...
Any ideas??
Thanks
EDIT:
Partially solved. See my answer below.
There's a simple service I found that returns your public IP:
http://api.ipify.org?format=json
You could add a route to your application that you can hit from your browser. The route handler then makes a request to this service and returns the result. You could then periodically check what your app's actual public IP is and adjust whitelist accordingly.
// Example express + request
app.get('/ip', function(req, res) {
request({ uri: 'http://api.ipify.org?format=json' }, function(err, response, body) {
res.send(body);
});
});
The problem with the app hosted in Modulus.io is solved now. The app was running by default in Joyent servers but I changed it to the Amazon AWS region and with the IP range 54.0.0.0/8 whitelisted google is accepting all my requests to the API.
Nevertheless, the app in heroku still not working but as is working in one service I'm going to stop investigating in the other one.

Resources