Make the SSR example infer the origin (#2932)

This commit is contained in:
Matthew Phillips 2022-03-29 09:17:49 -04:00 committed by GitHub
parent 9fa013b4fa
commit 7fd49f1887
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
5 changed files with 19 additions and 18 deletions

View file

@ -17,11 +17,12 @@ interface Cart {
}>;
}
const { MODE } = import.meta.env;
const origin = MODE === 'development' ? `http://127.0.0.1:3000` : `http://127.0.0.1:8085`;
function getOrigin(request: Request): string {
return new URL(request.url).origin.replace('localhost', '127.0.0.1');
}
async function get<T>(endpoint: string, cb: (response: Response) => Promise<T>): Promise<T> {
const response = await fetch(`${origin}${endpoint}`, {
async function get<T>(incomingReq: Request, endpoint: string, cb: (response: Response) => Promise<T>): Promise<T> {
const response = await fetch(`${getOrigin(incomingReq)}${endpoint}`, {
credentials: 'same-origin',
});
if (!response.ok) {
@ -31,36 +32,36 @@ async function get<T>(endpoint: string, cb: (response: Response) => Promise<T>):
return cb(response);
}
export async function getProducts(): Promise<Product[]> {
return get<Product[]>('/api/products', async (response) => {
export async function getProducts(incomingReq: Request): Promise<Product[]> {
return get<Product[]>(incomingReq, '/api/products', async (response) => {
const products: Product[] = await response.json();
return products;
});
}
export async function getProduct(id: number): Promise<Product> {
return get<Product>(`/api/products/${id}`, async (response) => {
export async function getProduct(incomingReq: Request, id: number): Promise<Product> {
return get<Product>(incomingReq, `/api/products/${id}`, async (response) => {
const product: Product = await response.json();
return product;
});
}
export async function getUser(): Promise<User> {
return get<User>(`/api/user`, async (response) => {
export async function getUser(incomingReq: Request): Promise<User> {
return get<User>(incomingReq, `/api/user`, async (response) => {
const user: User = await response.json();
return user;
});
}
export async function getCart(): Promise<Cart> {
return get<Cart>(`/api/cart`, async (response) => {
export async function getCart(incomingReq: Request): Promise<Cart> {
return get<Cart>(incomingReq, `/api/cart`, async (response) => {
const cart: Cart = await response.json();
return cart;
});
}
export async function addToUserCart( id: number | string, name: string): Promise<void> {
await fetch(`${origin}/api/cart`, {
await fetch(`${location.origin}/api/cart`, {
credentials: 'same-origin',
method: 'POST',
mode: 'no-cors',

View file

@ -3,7 +3,7 @@ import TextDecorationSkip from './TextDecorationSkip.astro';
import Cart from './Cart.svelte';
import { getCart } from '../api';
const cart = await getCart();
const cart = await getCart(Astro.request);
const cartCount = cart.items.reduce((sum, item) => sum + item.count, 0);
---
<style>

View file

@ -11,7 +11,7 @@ if(!isLoggedIn(Astro.request)) {
// They must be logged in.
const user = { name: 'test'}; // getUser?
const cart = await getCart();
const cart = await getCart(Astro.request);
---
<html>
<head>

View file

@ -5,7 +5,7 @@ import ProductListing from '../components/ProductListing.astro';
import { getProducts } from '../api';
import '../styles/common.css';
const products = await getProducts();
const products = await getProducts(Astro.request);
---
<html>
<head>

View file

@ -6,7 +6,7 @@ import { getProduct } from '../../api';
import '../../styles/common.css';
const id = Number(Astro.params.id);
const product = await getProduct(id);
const product = await getProduct(Astro.request, id);
---
<html lang="en">