كيفية عمل proxy باستخدام next.js

next js تختلف قليلاً عن إستخدامك للReact بدونها, في react كان بإمكانك فقط ان تضع الرابط للapi في ملف الpackage.json

{

///dependency
proxy:"www.example.com/"
}

,ولكن في next js الأمر مختلف قليلاً فيجب عليك أن تقوم بعمل redirect للطلبات بدلا من أن تنتقل إلى الخادم الخاص بnext js تقوم بالإنتقال إلى الخادم الخارجى, يمكنك القيام بذلك  بالتعديل على ملف الnext.js.config

module.exports={
	rewrites:async()=>{
    return [
    	source:"/api/*",
        destination:"your api url"
    ]
    }
}

حيث تقوم بوضع الرابط الخاص بالapi لديكك في الdestination  وتضع العنوان البديل في الsource , الأن متى قمت بإرسال طلبات إلى /api/ سيتم تحويلها إلى الapi في الdestination

حاول استخدام هذه الحزمة من npm لإنشاء وكيل Node.js لـExpress: http-proxy-middleware،  ثم يمكنك ضبط الخيار target لل  proxy requests مثال:

const proxy = require('http-proxy-middleware')
app.use('/api', proxy({ target: 'http://localhost:5000', changeOrigin: true }));