taking the user from localhost:3000 to localhost:3000/auth/google using proxy target is not working

0
votes

when a user clicks on Sign in using Google, the user is to be taken to the Google OAuth flow for the sign-in procedure. But on clicking the browser just changes its url to localhost:3000/auth/google and nothing happens. It works fine if I explicitly provide the complete href i.e

http://localhost:5000/auth/google

App component:

import './App.css';
import React, { Component } from 'react';
class App extends Component {
  render() {
    return (
      <div className="App">
        <a href="/auth/google">Sign in using google</a>
      </div>
    );
  }
}
export default App;

package.json

{
  "name": "client",
  "version": "0.1.0",
  "private": true,
  "proxy": {
    "/auth/google": {
      "target": "http://localhost:5000/"
    }
  },
1
javascriptreactjsfrontendbackendpackage.json

1 Answers

1
votes

delete your proxy on package.json and try this create setupProxy.js on your src directory then npm install http-proxy-middleware

const { createProxyMiddleware } = require("http-proxy-middleware");

const proxy = require("http-proxy-middleware");
module.exports = function (app) {
  app.use(
    createProxyMiddleware(
      "/auth/google",
     // replace with your endpoint
      { target: "http://localhost:5000" } // replace with your target
    )
  );
};