0

I have an Angular(8) solution that talks to a public Prismic repo through a reverse proxy on the same IIS that Angular is hosted on.

Now I want to talk to a private Prismic repo instead.

How do I set up the proxy to add headers and whatnot?
Is it even possible or does the authorisation require yet a step?

(I don't get it to work in VSCode-rest-client-plugin either. There is documentation on how to get it to work in Postman - and that is what hints me it is not possible to "simply proxy" a call into a private Prismic repo.)

Addendum:

The private Prismic repo has a secret key that must not make its way on to the client.
I hope to add the secret in the proxy as I am in full control of the proxy.

LosManos
  • 7,195
  • 6
  • 56
  • 107
  • is [nginx](https://stackoverflow.com/questions/19751313/forward-request-headers-from-nginx-proxy-server) an option for you? – timur Feb 17 '20 at 20:39
  • @timur If IIS does not work for this nginx would work. But to tick as Answer it should contain information why IIS does not work. – LosManos Feb 17 '20 at 20:57
  • I think I got sidetracked: i don't believe it's to do with reverse-proxying as Prismic API is always an external endpoint. The transition from public to private means you have to provide an API key with your requests. [this SO answer](https://stackoverflow.com/questions/52288838/prismic-how-to-make-api-calls-without-exposing-access-token) might provide some insight. let me know if that's what you're after – timur Feb 17 '20 at 23:23

2 Answers2

1

As I hinted in the comments, I think I've got a bit sidetracked by a reverse proxy thing. Correct me if I'm still way off.

Looking at the documentation, as far as I understand it, the only difference between public and private Prismic repo is an extra layer of security (read: API key) that you have to pass along with every request.

Prismic content is distributed through an API that can be configured as private. In private mode, the API requires the client application to authenticate itself to query, retrieve and display any content stored in a Prismic repository.

enter image description here

To prove my point of no proxy needed, I started off a new private repo in Prismic and put together a quick code pen that makes a simple request using angular-prismico as example. Of note here is the PrismicProvider setup:

    PrismicProvider.setApiEndpoint('https://my-instance.cdn.prismic.io/api/v2');
    PrismicProvider.setAccessToken('my master key');
    PrismicProvider.setClientId('some client id');
    PrismicProvider.setClientSecret('some_secret');

(the pen has working credentials but it's a throwaway instance that I opened up for this answer so those will likely expire soon)

This brings us to my first suggestion:

use the Angular client library (either Angular2+ or AngularJs as you didn't specify your version). Only do this if you don't care about the api key leaking to public (it might be an option for internal website for example).

Suppose you want to keep the key secret

and this is probably your case. In this situation, a flow similar to my other SO answer will make sense. In short - you somehow authorise clients of your Angular SPA to your IIS-hosted app, and you use Prismic's .net client library to fulfill the requests from clients.

To answer your specific question: yes, implementing a proxy that calls from SPA to Prismic can be done. You could start with this somewhat official sample and build on.

timur
  • 14,239
  • 2
  • 11
  • 32
0

It is totally possible to use IIS' reverse proxy to connect to a Prismic private repo.
What is needed is to set up IIS' reverse proxy and to give it the secret used for authorisation at Prismic.

By the time of writing I have found no way to install just IIS' reverse proxy but one has to install the whole farm extension called ARR.

It is the site, not the server, that has the reverse proxy so update web.config with data corresponding to: (grok the xml comments)

<system.webServer>
    <rewrite>
        <rules>
            <!-- `stopProcessing` is, I guess, the normal case. -->
            <rule name="CMS rewrite" stopProcessing="true">

                <!-- `"^cms(.*)"` matches `cms`, `cms/` and `cmsanything` which might not be what was intended. -->
                <match url="^cms(.*)" />

                <!-- Is is important to below Not use the `cdn` as in `yoursite.cdn.prismic.io` that is used for the queries. -->
                <!-- `logRewrittenUrl` can be handy for tracing the target. -->
                <action type="Rewrite" url="https://yoursite.prismic.io/api/v2" logRewrittenUrl="true" />

                <serverVariables>
                    <!-- Replace `the-token` with the token found when setting the Prismic repo to private. -->
                    <set name="HTTP_AUTHORIZATION" value="Bearer the-token" />
                </serverVariables>
            </rule>
...

There is a click-and-write GUI too but, at least to me, it is harder to understand. And explain.

There is something on how Prismic later handles the authorisation secret that annoys me, but that is another issue.

HTTP_AUTHORIZATION has to be set up as a server variable. IISManager->URLRewrite->ViewServerVariables->Add.
I have not bothered to find out where this is stored.

Handy tip for debugging URL rewrite issues.

LosManos
  • 7,195
  • 6
  • 56
  • 107