Web-development – How to use own REST API in web front end

I don't quite understand what it is you actually want to share.

I'd assume you won't find a framework cause what you want to do is not that hard to solve.

1) A third party application is -only- going to touch your general purpose API. It uses API authentication only (through forms authentication, api key usage, take your picking).

2) Your own application through user actions will redirect to login page and such and have it's own picking of authentication (form authentication probably). This is about stuff the user can potentially enter through the address bar of the webbrowser. If your application happens to use your general purposed API under the hood you are not going to redirect the user to your login page on ajax calls. Your application should handle/prevent this for the user. A user is not going to make API calls through his/her browser's address bar.

So for your application to be able to use your general purpose API, the general purpose API would only need to support the same authentication scheme (form authentication). Or your application would have to fetch the user's api key or something to use after the user logged in.

You can easily create an Authorize attribute in MVC that will checks multiple options, first for an api-key, then for a forms authentication based cookie token. If it finds nothing your general purpose API should or needs to throw 401s only.

Your application would pick them up from ajax call failures and could decide to move the user over to the login page.

Short answer:

I don't have enough information about your environment and goals to give a simple and helpful short answer. See my long answer below.

Long answer:

This is a really hard question to answer. There are a lot of specific things to your team and your project that lead to deciding on a best architecture for your system. To answer it well, there needs to be more detail around the goals and requirements for this web app. For example:

1. Is the API going to be public or only used by the web app? I.e., should it be thought of as an internal service that is behind a firewall and only accessible to the web app, or something else?
2. How much traffic is expected for this app? (1k users/month? 10k? 100k? 1m?)
3. How fast do pages need to load? (i.e., how responsive does the application need to fel vs. actually be?)
4. How much time do you have to build the app?
5. Do you really need OAuth?
6. How many people do you have on your team?
7. Where on the spectrum of "learning experience" to "to support a business" does this project lie?
8. Where on the spectrum of "practical, get it done" to "it must be perfectly technically correct" does this project lie?
9. Is this app going to be indexed by search engines or is it going to be mostly private (behind an authentication mechanism)?

My opinion on the "practical" vs. "perfect" question is, make it more practical. If it doesn't ship, the project doesn't matter outside what you learn.

The answers for questions 1, 2 and 3 lead to how big and complex the system needs to be. (If a lot of traffic is expected and page load time is not that important, more layers and more systems could be introduced. If there are areas of data that can be cached, then that can offset other places where it is slower to get data.)

On authentication and account creation. This is a surprisingly complex topic that takes time to really understand. Whether using OAuth (assuming OAuth 2.0) against your own API, regular password authentication, or OAuth authentication against a third-party (facebook, google, etc.), you'll still need a way to create user accounts within your system.

On OAuth: the most common use for OAuth is for allowing a third-party system/service to access data in your system that is owned by one of your users. It does have the flexibility, however, to allow password-based login. This means that, once a user has created an account on your system, you can use the "Resource Owner Password Credentials" grant type in OAuth 2.0 to authenticate that user. Check out the full rfc if you have not yet done so.

Here are a couple common ways to architect web applications (this is not comprehensive and there are tons of variations):

1. Use a front end framework, in javascript (think ember, angular or similar), to manage all the views and request the appropriate data from the API on a server. This API could then be either a public API or an API only used by that app.
2. Create a multi-tier server architecture where there is an external-facing web app layer with internal services (APIs) for each of the services you need. The web app layer has the views and gets all model data from the internal services. All internal services are behind a firewall. For example, see how TripAdvisor does it.
3. Provide a public API and create a standard, server-based web app where it serves individual html pages generated from views on the server. (i.e., the web app would not use the public API but would access all internal databases and services directly.)
4. Provide a public API for 3rd-party use and create a semi-private API that only the web app uses. This is a specific variation on #1.

I would follow #1, #3 or #4:

• if I were building a system that I know will have < 100k users
• if I had to support > 100k users and the number of features in the system is small (i.e., not a hugely complex product)

I would follow a combination of (#2 and (#1, #3 or #4)) (parenthesis for clarity of operational order):

• if I had a lot of backend processing going on with a lot of other systems
• if I had to support > 100k users and there is a very large feature set / a lot of different types of data to handle

If I had a product that was publicly available and would be indexed by search engines, I would not do #1 nor #4.

My team matters a lot to me. Their preferences, experience and desire to learn would affect what I choose architecturally between #1/#4 and #3.