Get custom domain information in request object in NextJs application hosted using aws-amplify-console

### Before opening, please confirm:

- [X] I have [searched for duplicate or closed issues](https://github.com/aws-amplify/amplify-js/issues?q=is%3Aissue+) and [discussions](https://github.com/aws-amplify/amplify-js/discussions).
- [X] I have read the guide for [submitting bug reports](https://github.com/aws-amplify/amplify-js/blob/main/CONTRIBUTING.md#bug-reports).
- [X] I have done my best to include a minimal, self-contained set of instructions for consistently reproducing the issue.

### JavaScript Framework

React

### Amplify APIs

Not applicable

### Amplify Categories

Not applicable

### Environment information

```
# Put output below this line
```
System:
OS: macOS 11.6
CPU: (6) x64 Intel(R) Core(TM) i5-8500 CPU @ 3.00GHz
Memory: 117.01 MB / 8.00 GB
Shell: 5.8 - /bin/zsh
Binaries:
Node: 13.12.0 - /usr/local/bin/node
Yarn: 1.15.2 - /usr/local/bin/yarn
npm: 6.14.4 - ~/n/bin/npm
Watchman: 2021.10.18.00 - /usr/local/bin/watchman
Browsers:
Brave Browser: 91.1.26.74
Chrome: 95.0.4638.54
Firefox: 91.0.2
Safari: 15.0
npmPackages:
@aeropartsnow/web: ^1.1.38 => 1.1.38
@ampproject/toolbox-optimizer: undefined ()
@babel/core: undefined ()
@emotion/cache: ^11.4.0 => 11.4.0
@emotion/react: ^11.4.1 => 11.4.1
@emotion/server: ^11.4.0 => 11.4.0
@emotion/styled: ^11.3.0 => 11.3.0
@hookform/resolvers: ^2.8.1 => 2.8.2
@mui/icons-material: ^5.0.1 => 5.0.1
@mui/material: ^5.0.1 => 5.0.2
@mui/styles: ^5.0.1 => 5.0.1
@mui/x-data-grid: ^5.0.0-beta.2 => 5.0.0-beta.2
@types/lodash: ^4.14.172 => 4.14.172 (4.14.175)
@types/react: ^17.0.24 => 17.0.27 (17.0.16)
@types/react-dom: ^17.0.9 => 17.0.9
@types/react-router-dom: ^5.1.8 => 5.3.0
amphtml-validator: undefined ()
arg: undefined ()
async-retry: undefined ()
async-sema: undefined ()
aws-amplify: ^4.3.0 => 4.3.1
axios: ^0.21.1 => 0.21.1 (0.21.4)
bfj: undefined ()
cacache: undefined ()
ci-info: undefined ()
class-validator: 1.0.0
comment-json: undefined ()
compression: undefined ()
computed-types: 1.0.0
conf: undefined ()
connected-react-router: ^6.9.1 => 6.9.1
content-type: undefined ()
cookie: undefined ()
css-loader: undefined ()
debug: undefined ()
devalue: undefined ()
escape-string-regexp: undefined ()
eslint: 7.32.0 => 7.32.0
eslint-config-next: 11.0.1 => 11.0.1
file-loader: undefined ()
find-cache-dir: undefined ()
find-up: undefined ()
fresh: undefined ()
gzip-size: undefined ()
history: ^5.0.1 => 5.0.1 (4.10.1)
http-proxy: undefined ()
ignore-loader: undefined ()
io-ts: 1.0.0
is-animated: undefined ()
is-docker: undefined ()
is-wsl: undefined ()
joi: 1.0.0
json5: undefined ()
jsonwebtoken: undefined ()
loader-utils: undefined ()
lodash: ^4.17.21 => 4.17.21
lodash.curry: undefined ()
lru-cache: undefined ()
mini-css-extract-plugin: undefined ()
nanoid: undefined ()
neo-async: undefined ()
next: 11.0.1 => 11.0.1
next-redux-wrapper: ^7.0.4 => 7.0.5
nope: 1.0.0
ora: undefined ()
postcss-flexbugs-fixes: undefined ()
postcss-loader: undefined ()
postcss-preset-env: undefined ()
postcss-scss: undefined ()
react: 17.0.2 => 17.0.2
react-dom: 17.0.2 => 17.0.2
react-hook-form: ^7.16.1 => 7.17.1
react-redux: ^7.2.5 => 7.2.5
react-router-dom: ^5.2.0 => 5.2.0
react-toastify: ^8.0.3 => 8.0.3
recast: undefined ()
redux: ^4.1.1 => 4.1.1
redux-devtools-extension: ^2.13.9 => 2.13.9
redux-saga: ^1.1.3 => 1.1.3
redux-saga/effects: undefined ()
resolve-url-loader: undefined ()
sass-loader: undefined ()
schema-utils: undefined ()
semver: undefined ()
send: undefined ()
source-map: undefined ()
string-hash: undefined ()
strip-ansi: undefined ()
superstruct: 1.0.0
terser: undefined ()
text-table: undefined ()
typanion: 1.0.0
typescript: ^4.4.3 => 4.4.3
unistore: undefined ()
vest: 1.0.0
web-vitals: undefined ()
webpack: undefined ()
webpack-sources: undefined ()
yup: ^0.32.9 => 0.32.9 (1.0.0)
zod: 1.0.0
npmGlobalPackages:
@aeropartsnow/web: 1.1.25
@aws-amplify/cli: 4.18.0
@nestjs/cli: 7.5.6
@storybook/cli: 5.3.19
angular-cli: 1.0.0-beta.28.3
apn-template-editor: 0.1.0
appcenter-cli: 2.6.3
bin-up: 1.3.2
code-push-cli: 2.1.9
eslint: 8.1.0
ethereumjs-testrpc: 6.0.3
expo-cli: 4.12.0
ganache-cli: 6.4.3
gulp: 4.0.2
lerna: 4.0.0
ng: 0.0.0
nodemon: 2.0.2
npm: 6.14.4
pm2: 4.2.3
puppeteer: 3.0.1
sails: 1.2.3
serverless: 2.50.0

### Describe the bug

We have a client-side application when a user accesses our application by typing a URL in browser ex, https://example.com , we take this hostname and get all the configs, colors and other data using the hostname and display it to the user.
We wanted to do better SEO so we started doing some Server-side rendering for that we are using
1. NextJS
2. AWS Amplify
3. Route 53
4. Cloudfront
So we built a new application using NextJS and hosted it on AWS-amplify and using Domain management of AWS amplify and Route53 we are handling the domains and sub-domains.

When I try to access https://example.com , we are not able to get this information in the request object. We are getting some s3-bucket/cloudfront endpoint as a host.

### Expected behavior

If we look at configuration of Cloudfront that is created by AWS amplify, it creates a lambda edge and connect it with Origin Request. And according to docs of Lambda edge the request body does have host information.

[Origin Request lambda event](https://docs.aws.amazon.com/AmazonCloudFront/latest/DeveloperGuide/lambda-event-structure.html)

This information is getting lost somewhere

### Reproduction steps

1. Create a next js application
2. host it using aws amplify
3. check the request object

### Code Snippet

```javascript
// Put your code below this line.

```

### Log output

```
// Put your logs below this line

```

### aws-exports.js

_No response_

### Manual configuration

_No response_

### Additional configuration

_No response_

### Mobile Device

_No response_

### Mobile Operating System

_No response_

### Mobile Browser

_No response_

### Mobile Browser Version

_No response_

### Additional information and screenshots

_No response_