I'm trying to do a http to https redirect using next, so if the user enters the site at redirect to I'm using GraphQL Yoga on the server side, so not sure how I could acplish this in my index file on the server side. I've tried using the meta tag and changing the protocol in the window object but no luck with doing so in server-side rendering. Is there any way I can acplish this redirect on the client side using next js or on the server side?

const cookieParser = require('cookie-parser')
const jwt = require('jsonwebtoken')
require('dotenv').config({path: '.env'})
const createServer = require('./createServer')
const db = require('./db')
const sslRedirect = require('heroku-ssl-redirect');
const server = createServer()
//Express middleware to handle cookies
server.express.use(cookieParser())
//decode JWT 
server.express.use((req, res, next) => {
    const { token } = req.cookies;
    if (token) {
      const { userId } = jwt.verify(token, process.env.APP_SECRET);
      req.userId = userId;
    }
    next()
})
//Populates user on request
server.express.use(async (req, res, next) => {
  if(!req.userId) return next()
  const user = await db.query.user({
    where: {id: req.userId}
  }, `{id, permissions, email, name}`)
  req.user = user
  next()
})
//start
server.start({
     cors: {
        credentials: true,
       origin: process.env.FRONTEND_URL
    },
}, starting => {
    console.log(`server is running on port ${starting.port}`)
})

I'm trying to do a http to https redirect using next, so if the user enters the site at http://www.example. redirect to https://www.example. I'm using GraphQL Yoga on the server side, so not sure how I could acplish this in my index file on the server side. I've tried using the meta tag and changing the protocol in the window object but no luck with doing so in server-side rendering. Is there any way I can acplish this redirect on the client side using next js or on the server side?

const cookieParser = require('cookie-parser')
const jwt = require('jsonwebtoken')
require('dotenv').config({path: '.env'})
const createServer = require('./createServer')
const db = require('./db')
const sslRedirect = require('heroku-ssl-redirect');
const server = createServer()
//Express middleware to handle cookies
server.express.use(cookieParser())
//decode JWT 
server.express.use((req, res, next) => {
    const { token } = req.cookies;
    if (token) {
      const { userId } = jwt.verify(token, process.env.APP_SECRET);
      req.userId = userId;
    }
    next()
})
//Populates user on request
server.express.use(async (req, res, next) => {
  if(!req.userId) return next()
  const user = await db.query.user({
    where: {id: req.userId}
  }, `{id, permissions, email, name}`)
  req.user = user
  next()
})
//start
server.start({
     cors: {
        credentials: true,
       origin: process.env.FRONTEND_URL
    },
}, starting => {
    console.log(`server is running on port ${starting.port}`)
})

• javascript
• reactjs
• http-redirect
• https
• next.js

Share Improve this question Follow asked May 7, 2019 at 23:02 basicbasic 24911 gold badge66 silver badges1313 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 6

What I have done in the past is started both a HTTP and a HTTPS server with express. The HTTPS is the server with all the routes\API's configured. The HTTP server simply to redirects all GET requests to HTTPS. See the following code which could be used setup the HTTP server to do the redirect.

let httpRedirectServer = express();

// set up a route to redirect http to https
httpRedirectServer.get('*', (request, response) => {
    response.redirect('https://' + request.headers.host + request.url);
});

httpRedirectServer.listen(80);
httpRedirectServer.on('listening', () => {
    console.log("Listening to redirect http to https");
});

Alternatively on the client side a quick fix is to redirect in javascript by running something like.

// Check the URL starts with 'http://xxxxx' protocol, if it does then redirect to 'https://xxxxx' url of same resource
var httpTokens = /^http:\/\/(.*)$/.exec(window.location.href);
if(httpTokens) { 
    window.location.replace('https://' + httpTokens[1]);
}