Fix proxy configuration for nginx deployment
- Disable WebSocket HMR to prevent SSL WebSocket errors - Add MIME type headers middleware for /_nuxt/ assets - Create nginx proxy configuration template - Add client-side proxy headers plugin - Update Nuxt configuration for proxy compatibility - Add comprehensive proxy setup documentation Resolves WebSocket SSL errors and MIME type issues when running behind nginx proxy.
This commit is contained in:
32
plugins/proxy-headers.client.ts
Normal file
32
plugins/proxy-headers.client.ts
Normal file
@@ -0,0 +1,32 @@
|
||||
export default defineNuxtPlugin(() => {
|
||||
// Handle proxy headers and ensure proper request handling
|
||||
if (process.client) {
|
||||
// Disable HMR reconnection attempts since we disabled WebSocket HMR
|
||||
if (window && (window as any).__vite_ping) {
|
||||
(window as any).__vite_ping = () => Promise.resolve()
|
||||
}
|
||||
|
||||
// Override fetch to handle proxy correctly
|
||||
const originalFetch = window.fetch
|
||||
window.fetch = function(input: RequestInfo | URL, init?: RequestInit) {
|
||||
// Ensure all API calls use relative URLs to work with proxy
|
||||
if (typeof input === 'string' && input.startsWith('/api/')) {
|
||||
// Add proper headers for proxy compatibility
|
||||
return originalFetch(input, {
|
||||
...init,
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
'Accept': 'application/json',
|
||||
...init?.headers
|
||||
}
|
||||
})
|
||||
}
|
||||
return originalFetch(input, init)
|
||||
}
|
||||
|
||||
// Handle Nuxt/Vite specific issues with proxy
|
||||
if ('__NUXT__' in window) {
|
||||
console.log('[PROXY] Nuxt app loaded through proxy successfully')
|
||||
}
|
||||
}
|
||||
})
|
||||
Reference in New Issue
Block a user