calling member service api from a sub domain

Go to solution

Press Ctrl / CMD + C to copy this to your clipboard.

Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at

Carole Logan 17 posts 118 karma points MVP 8x c-trib

Jan 25, 2017 @ 16:59

0

Calling Member service API from a sub domain

Hello,

I have set up an account area on a site using Umbraco membership service and an API call that returns JSON on user 's name, etc when the user is logged in.

I need to call this URL from a subdomain application (no CMS) built in Angular JS so we can show if the user is logged in or not. How can I get it to know from a client side JS API call that the user is logged in on the other domain?

Does anyone have any advice on how they have implemented this kind of thing before?

Thanks,

Carole

Copy Link
Dan Patching 31 posts 158 karma points c-trib

Jan 26, 2017 @ 10:46
0
Hi Carole,

I would create an UmbracoApiController with an endpoint you can call from your subdomain application.

You'll probably need to add a header to your WebApi response to avoid the cross origin request (CORS) issue.
```
Access-Control-Allow-Origin: *
```
Maybe also some kind of authentication to keep it secure too.
Copy Link
Cristhian Amaya 52 posts 423 karma points

Jan 26, 2017 @ 10:59
1
That's a good solution, Dan.

The only thing I'd add is that you shouldn't enable CORS for all domains, i.e., *. Make sure to enable it only for the domain where your angular app is hosted.

You can also configure CORS in the web.config like this:
```
<system.webServer>
  <httpProtocol>
    <customHeaders>
      <add name="Access-Control-Allow-Origin" value="http://myangularapp.com" />
      <add name="Access-Control-Allow-Methods" value="GET" />
      <add name="Access-Control-Allow-Headers" value="Authorization, Accept" />
    </customHeaders>
  </httpProtocol>
<system.webServer>
```
Cheers!
Copy Link
Carole Logan 17 posts 118 karma points MVP 8x c-trib

Jan 26, 2017 @ 10:56

0

Hi Dan,

I already have some APIs available from the CMS app to Angular app and they work fine so I don't think it's a cross domain thing.

The Umbraco site with webapi endpoints is on www.domain.com and the angular app calling these is on subdomain.domain.com.

Now I have added a membership area to www domain and calling an API that checks if the user is logged it it always returns false when calling "MemberIsLoggedOn()". So the call is getting in to the endpoint but the user isn't being seen as logged in.

When I am logged in and hit the API endpoint in my browser MemberIsLoggedOn() returns true and the JSON response I need. When I call the endpoint client side in same browser from my Angular app it returns false.

I hope this makes sense.

Thanks,

Carole

Copy Link
Cristhian Amaya 52 posts 423 karma points

Jan 26, 2017 @ 11:34
1
I believe what you need to know is change your auth cookie configuration.

If you inspect the cookie, the domain option should be something like: www.domain.com

What you need to do, is configure the domain to be .domain.com so the cookie can be read cross domain.

To configure this in the membership provider, you can do something like this in your web.config:
```
<authentication mode="Forms">
  <forms name=".ASPXAUTH" loginUrl="/login" timeout="30" protection="All" path="/" domain=".domain.com" />
</authentication>
```
Cheers!
Copy Link
Dan Patching 31 posts 158 karma points c-trib

Jan 26, 2017 @ 11:08

1

Sorry, I really should read the question properly :D

I think the issue is likely to be cookie related. Umbraco sets an auth cookie to store authentication, but it probably wouldn't be visible from another domain (or sub domain).

It might be worth trying to change the cookie path in web.config forms element.

Other than that, the only thing I can think of would be to implement some kind of custom member state on the Umbraco side, and then check that instead of IsMemberLoggedOn().

Copy Link
Carole Logan 17 posts 118 karma points MVP 8x c-trib

Jan 26, 2017 @ 11:24

0

Ok, I'll have a look at those options and post back here if I find a solution.

Thanks for your advice, I appreciate it :)

Thanks,

Carole

Copy Link
Michael Latouche 504 posts 819 karma points MVP 4x c-trib

Jan 26, 2017 @ 11:24
1
Hi Carole,

Dan pointed the issue. I was looking at the code for this method, this is what is behind the scenes:
```
return _httpContext.User != null &&
_httpContext.User.Identity.IsAuthenticated;
```
The "User" and "User.Identity" properties of the httpContext are indeed based on an authentication cookie.

If the cookie path change does not work and you end up building a custom member state, be careful to protect the access to that information one way or another, in order to not enable third parties to query the system and see who is online or not ;-)

Cheers,

Michaël.
Copy Link
Carole Logan 17 posts 118 karma points MVP 8x c-trib

Jan 26, 2017 @ 13:21

100

Hi Everyone,

Thanks for your help on this. On the www domain I had to set the cookie domain to .domain.com. Then in the angular app I had to set:

$httpProvider.defaults.withCredentials = true;

It then sent the cookies over in the request so it was able to see I was logged in. I had to use JSONP so it was able to wrap the response in callback getting around the cross-domain issues.

Thanks,

Carole

Copy Link
Michael Latouche 504 posts 819 karma points MVP 4x c-trib

Jan 26, 2017 @ 13:39

0

Glad you got it working !!

Copy Link
is working on a reply...

Please Sign in or register to post replies

Flag this post as spam?