diff --git a/README.md b/README.md index 6c9da435bc..740fe598e9 100644 --- a/README.md +++ b/README.md @@ -34,49 +34,33 @@ npm install npm run build:watch ``` -You can now access the web vault in your browser at `https://localhost:8080`. You can adjust your API endpoint settings in `src/app/services/services.module.ts` by altering the `apiService.setUrls` call. For example: +You can now access the web vault in your browser at `https://localhost:8080`. -```typescript -await apiService.setUrls({ - base: isDev ? null : window.location.origin, - api: isDev ? 'http://mylocalapi' : null, - identity: isDev ? 'http://mylocalidentity' : null, - events: isDev ? 'http://mylocalevents' : null, -}); -``` - -If you want to point the development web vault to the production APIs, you can set: - -```typescript -await apiService.setUrls({ - base: null, - api: 'https://api.bitwarden.com', - identity: 'https://identity.bitwarden.com', - events: 'https://events.bitwarden.com', -}); -``` - -And note to run the app with: +If you want to point the development web vault to the production APIs, you can run using: ``` npm install npm run build:prod:watch ``` -## Common Issues: +You can also manually adjusting your API endpoint settings in `webpack.config.js` by altering the `targets` within `proxy`. For example: -### CORS - -If you run the frontend and receive a notification after attempting to login that says: +```typescript +proxy: { + '/api': { + target: 'http://localhost:4000', + pathRewrite: {'^/api' : ''} + }, + '/identity': { + target: 'http://localhost:33656', + pathRewrite: {'^/identity' : ''} + }, + '/events': { + target: 'http://localhost:46273', + pathRewrite: {'^/events' : ''} + } +}, ``` -An error has occurred. -NetworkError when attempting to fetch resource. -``` -And in the console: -``` -Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://api.bitwarden.com/accounts/prelogin. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing). -``` -This means that you are having a CORS header issue. This can be mitigated by using a CORS header changing extension in your browser such as [this one.](https://mybrowseraddon.com/access-control-allow-origin.html) ## Contribute diff --git a/src/app/services/services.module.ts b/src/app/services/services.module.ts index cf4403e554..b890948824 100644 --- a/src/app/services/services.module.ts +++ b/src/app/services/services.module.ts @@ -157,18 +157,10 @@ export function initFactory(): Function { 'https://portal.bitwarden.com'; // window.location.origin + '/portal'; } apiService.setUrls({ - base: isDev ? null : window.location.origin, - api: isDev ? 'http://localhost:4000' : null, - identity: isDev ? 'http://localhost:33656' : null, - events: isDev ? 'http://localhost:46273' : null, - - // Uncomment these (and comment out the above) if you want to target production - // servers for local development. - - // base: null, - // api: 'https://api.bitwarden.com', - // identity: 'https://identity.bitwarden.com', - // events: 'https://events.bitwarden.com', + base: window.location.origin, + api: null, + identity: null, + events: null, }); setTimeout(() => notificationsService.init(environmentService), 3000); diff --git a/webpack.config.js b/webpack.config.js index e37ee076b4..cd2ef7cdd9 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -157,9 +157,46 @@ const devServer = { cert: fs.readFileSync('dev-server' + certSuffix + '.pem'), }, // host: '192.168.1.9', + proxy: { + '/api': { + target: 'http://localhost:4000', + pathRewrite: {'^/api' : ''} + }, + '/identity': { + target: 'http://localhost:33656', + pathRewrite: {'^/identity' : ''} + }, + '/events': { + target: 'http://localhost:46273', + pathRewrite: {'^/events' : ''} + } + }, hot: false, }; +if (ENV === "production") { + devServer.proxy = { + '/api': { + target: 'https://api.bitwarden.com', + pathRewrite: {'^/api' : ''}, + secure: false, + changeOrigin: true + }, + '/identity': { + target: 'https://identity.bitwarden.com', + pathRewrite: {'^/identity' : ''}, + secure: false, + changeOrigin: true + }, + '/events': { + target: 'https://events.bitwarden.com', + pathRewrite: {'^/events' : ''}, + secure: false, + changeOrigin: true + } + }; +} + const config = { mode: ENV, devtool: 'source-map',