Search code examples
angularapacheurlinstagram-apiangular7

Instagram API redirect URL in Angular 7 application using useHash: true on Apache Server


How to setup Angular Application on Apache Server?

Right now I'm facing an issue on Instagram authentication.

In an Angular app, if we want to give direct access to any angular page on Apache server, let say http://example.com/some-route, then we have to enable 'useHash: true' in app.routing. Then, it will redirect me to that route as http://example.com/#/some-route.

But during Instagram Authentication, IG doesn't take # in redirect URL. Now when I'm passing IG redirect URL as http://example.com/#/, it by default returns the authentication params as http://example.com/?code=<some-code>, and before the application is able to catch the params in URL, Angular converts it to: http://example.com/#/

Any help is appreciated.


Solution

  • This helped me: Deploying prod build to Apache 2

    I created .htaccess file with this rules:

    <IfModule mod_rewrite.c>
      Options Indexes FollowSymLinks
      RewriteEngine On
      RewriteBase / 
      RewriteRule ^index\.html$ - [L]
      RewriteCond %{REQUEST_FILENAME} !-f
      RewriteCond %{REQUEST_FILENAME} !-d
      RewriteRule . /index.html [L]
    </IfModule>
    

    And, now I can redirect to any component without #. I set useHash: false in app router. Now, I'm able to catch the URL parameter after Instagram auth.