ERROR { Error: Uncaught (in promise): ReferenceError: FormData is not defined
See original GitHub issueHello I want to render my angular app with Universal to optimise my SEO. After following all the steps on serving it I got
GET: /: 43.040ms
ERROR { Error: Uncaught (in promise): ReferenceError: FormData is not defined
ReferenceError: FormData is not defined
at new l (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:139851:333702)
at createClass (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:18240:20)
at createDirectiveInstance (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:18083:37)
at createViewNodes (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:19541:53)
at callViewAction (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:19975:13)
at execComponentViewsAction (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:19884:13)
at createViewNodes (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:19569:5)
at createRootView (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:19430:5)
at Object.createProdRootView [as createRootView] (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:20123:12)
at ComponentFactory_.create (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:17035:46)
at resolvePromise (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:136781:31)
at resolvePromise (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:136738:17)
at C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:136840:17
at ZoneDelegate.invokeTask (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:136378:31)
at Object.onInvokeTask (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:10539:33)
at ZoneDelegate.invokeTask (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:136377:36)
at Zone.runTask (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:136145:47)
at drainMicroTaskQueue (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:136552:35)
at ZoneTask.invokeTask (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:136457:21)
at Server.ZoneTask.invoke (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:136442:48)
rejection: ReferenceError: FormData is not defined
at new l (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:139851:333702)
at createClass (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:18240:20)
at createDirectiveInstance (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:18083:37)
at createViewNodes (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:19541:53)
at callViewAction (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:19975:13)
at execComponentViewsAction (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:19884:13)
at createViewNodes (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:19569:5)
at createRootView (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:19430:5)
at Object.createProdRootView [as createRootView] (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:20123:12)
at ComponentFactory_.create (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:17035:46),
promise:
ZoneAwarePromise {
__zone_symbol__state: 0,
__zone_symbol__value: ReferenceError: FormData is not defined
at new l (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:139851:333702)
at createClass (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:18240:20)
at createDirectiveInstance (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:18083:37)
at createViewNodes (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:19541:53)
at callViewAction (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:19975:13)
at execComponentViewsAction (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:19884:13)
at createViewNodes (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:19569:5)
at createRootView (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:19430:5)
at Object.createProdRootView [as createRootView] (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:20123:12)
at ComponentFactory_.create (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:17035:46) },
zone:
Zone {
_properties: { isAngularZone: true },
_parent:
Zone {
_properties: {},
_parent: null,
_name: '<root>',
_zoneDelegate: [Object] },
_name: 'angular',
_zoneDelegate:
ZoneDelegate {
_taskCounts: [Object],
zone: [Circular],
_parentDelegate: [Object],
_forkZS: null,
_forkDlgt: null,
_forkCurrZone: [Object],
_interceptZS: null,
_interceptDlgt: null,
_interceptCurrZone: [Object],
_invokeZS: [Object],
_invokeDlgt: [Object],
_invokeCurrZone: [Circular],
_handleErrorZS: [Object],
_handleErrorDlgt: [Object],
_handleErrorCurrZone: [Circular],
_scheduleTaskZS: [Object],
_scheduleTaskDlgt: [Object],
_scheduleTaskCurrZone: [Circular],
_invokeTaskZS: [Object],
_invokeTaskDlgt: [Object],
_invokeTaskCurrZone: [Circular],
_cancelTaskZS: [Object],
_cancelTaskDlgt: [Object],
_cancelTaskCurrZone: [Circular],
_hasTaskZS: [Object],
_hasTaskDlgt: [Object],
_hasTaskDlgtOwner: [Circular],
_hasTaskCurrZone: [Circular] } },
task:
ZoneTask {
_zone:
Zone {
_properties: [Object],
_parent: [Object],
_name: 'angular',
_zoneDelegate: [Object] },
runCount: 0,
_zoneDelegates: null,
_state: 'notScheduled',
type: 'microTask',
source: 'Promise.then',
data:
ZoneAwarePromise {
__zone_symbol__state: 0,
__zone_symbol__value: ReferenceError: FormData is not defined
at new l (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:139851:333702)
at createClass (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:18240:20)
at createDirectiveInstance (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:18083:37)
at createViewNodes (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:19541:53)
at callViewAction (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:19975:13)
at execComponentViewsAction (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:19884:13)
at createViewNodes (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:19569:5)
at createRootView (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:19430:5)
at Object.createProdRootView [as createRootView] (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:20123:12)
at ComponentFactory_.create (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:17035:46) },
scheduleFn: undefined,
cancelFn: null,
callback: [Function],
invoke: [Function] } }
in my server .ts I inserted global ['FormData'] = null;
but it lead to this
GET: /: 31.361ms
ERROR { Error: Uncaught (in promise): TypeError: FormData is not a constructor
TypeError: FormData is not a constructor
at new l (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:140046:333698)
at createClass (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:18240:20)
at createDirectiveInstance (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:18083:37)
at createViewNodes (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:19541:53)
at callViewAction (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:19975:13)
at execComponentViewsAction (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:19884:13)
at createViewNodes (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:19569:5)
at createRootView (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:19430:5)
at Object.createProdRootView [as createRootView] (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:20123:12)
at ComponentFactory_.create (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:17035:46)
at resolvePromise (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:136976:31)
at resolvePromise (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:136933:17)
at C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:137035:17
at ZoneDelegate.invokeTask (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:136573:31)
at Object.onInvokeTask (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:10539:33)
at ZoneDelegate.invokeTask (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:136572:36)
at Zone.runTask (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:136340:47)
at drainMicroTaskQueue (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:136747:35)
at ZoneTask.invokeTask (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:136652:21)
at Server.ZoneTask.invoke (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:136637:48)
rejection: TypeError: FormData is not a constructor
at new l (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:140046:333698)
at createClass (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:18240:20)
at createDirectiveInstance (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:18083:37)
at createViewNodes (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:19541:53)
at callViewAction (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:19975:13)
at execComponentViewsAction (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:19884:13)
at createViewNodes (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:19569:5)
at createRootView (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:19430:5)
at Object.createProdRootView [as createRootView] (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:20123:12)
at ComponentFactory_.create (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:17035:46),
promise:
ZoneAwarePromise {
__zone_symbol__state: 0,
__zone_symbol__value: TypeError: FormData is not a constructor
at new l (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:140046:333698)
at createClass (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:18240:20)
at createDirectiveInstance (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:18083:37)
at createViewNodes (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:19541:53)
at callViewAction (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:19975:13)
at execComponentViewsAction (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:19884:13)
at createViewNodes (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:19569:5)
at createRootView (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:19430:5)
at Object.createProdRootView [as createRootView] (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:20123:12)
at ComponentFactory_.create (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:17035:46) },
zone:
Zone {
_properties: { isAngularZone: true },
_parent:
Zone {
_properties: {},
_parent: null,
_name: '<root>',
_zoneDelegate: [Object] },
_name: 'angular',
_zoneDelegate:
ZoneDelegate {
_taskCounts: [Object],
zone: [Circular],
_parentDelegate: [Object],
_forkZS: null,
_forkDlgt: null,
_forkCurrZone: [Object],
_interceptZS: null,
_interceptDlgt: null,
_interceptCurrZone: [Object],
_invokeZS: [Object],
_invokeDlgt: [Object],
_invokeCurrZone: [Circular],
_handleErrorZS: [Object],
_handleErrorDlgt: [Object],
_handleErrorCurrZone: [Circular],
_scheduleTaskZS: [Object],
_scheduleTaskDlgt: [Object],
_scheduleTaskCurrZone: [Circular],
_invokeTaskZS: [Object],
_invokeTaskDlgt: [Object],
_invokeTaskCurrZone: [Circular],
_cancelTaskZS: [Object],
_cancelTaskDlgt: [Object],
_cancelTaskCurrZone: [Circular],
_hasTaskZS: [Object],
_hasTaskDlgt: [Object],
_hasTaskDlgtOwner: [Circular],
_hasTaskCurrZone: [Circular] } },
task:
ZoneTask {
_zone:
Zone {
_properties: [Object],
_parent: [Object],
_name: 'angular',
_zoneDelegate: [Object] },
runCount: 0,
_zoneDelegates: null,
_state: 'notScheduled',
type: 'microTask',
source: 'Promise.then',
data:
ZoneAwarePromise {
__zone_symbol__state: 0,
__zone_symbol__value: TypeError: FormData is not a constructor
at new l (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:140046:333698)
at createClass (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:18240:20)
at createDirectiveInstance (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:18083:37)
at createViewNodes (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:19541:53)
at callViewAction (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:19975:13)
at execComponentViewsAction (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:19884:13)
at createViewNodes (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:19569:5)
at createRootView (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:19430:5)
at Object.createProdRootView [as createRootView] (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:20123:12)
at ComponentFactory_.create (C:\Users\Philippe\Documents\CODE\UniversalRu\epassWebSSR\server.js:17035:46) },
scheduleFn: undefined,
cancelFn: null,
callback: [Function],
invoke: [Function] } }
-
My environment
-
angular version : 5.2.9
-
OS: Windows
-
Platform:NodeJS
-
What is the expected behavior?
Should access my angular project instead throwing an error and fully use all my features
Issue Analytics
- State:
- Created 5 years ago
- Comments:7 (2 by maintainers)
Top Results From Across the Web
FormData is not defined Error in JavaScript | bobbyhadz
The "FormData is not defined Error" error occurs when we try to use the FormData() constructor on the server side, most commonly in...
Read more >How to use FormData in node.js without Browser?
But above code gives me error as FormData not defined . I am working with ES6. Anybody, who can let me know how...
Read more >FormData is not defined ' when attempting to call a POST ...
I have the same issue with the model.save() method which is giving ReferenceError: FormData is not defined. In the node modules (node_modules@ ...
Read more >ReferenceError: formData is not defined - Laracasts
I am writing a unit testing code for the Ajax and Laravel project. I am trying to test one function. But I get...
Read more >FormData.append() - Web APIs | MDN
The append() method of the FormData interface appends a new value onto an ... a FormData object, or adds the key if it...
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Install form-data via npm
npm install form-data
then import form-data to your component or service
import * as FormData from 'form-data';
import ‘zone.js/dist/zone-node’; import * as express from ‘express’; import {join} from ‘path’; import * as FormData from ‘form-data’; import ‘localstorage-polyfill’; // Express server const app = express();
const PORT = process.env.PORT || 4000; const DIST_FOLDER = join(process.cwd(), ‘dist/browser’);
const domino = require(‘domino’); const fs = require(‘fs’); const path = require(‘path’); const Zone = require(‘zone.js’); const template = fs.readFileSync(path.join(DIST_FOLDER, ‘index.html’)).toString(); const win = domino.createWindow(template); global[‘Event’] = null; global[“window”] = win; global[‘document’] = win.document; global[‘localStorage’] = localStorage;
// * NOTE :: leave this as require() since this file is built Dynamically from webpack const {AppServerModuleNgFactory, LAZY_MODULE_MAP, ngExpressEngine, provideModuleMap} = require(‘./dist/server/main’);
// Our Universal express-engine (found @ https://github.com/angular/universal/tree/master/modules/express-engine) app.engine(‘html’, ngExpressEngine({ bootstrap: AppServerModuleNgFactory, providers: [ provideModuleMap(LAZY_MODULE_MAP) ] }));
app.set(‘view engine’, ‘html’); app.set(‘views’, DIST_FOLDER);
// Example Express Rest API endpoints // app.get(‘/api/**’, (req, res) => { }); // Serve static files from /browser app.get(‘.’, express.static(DIST_FOLDER, { maxAge: ‘1y’ }));
// All regular routes use the Universal engine app.get(‘*’, (req, res) => { res.render(‘index’, { req }); });
// Start up the Node server app.listen(PORT, () => { console.log(
Node Express server listening on http://localhost:${PORT}
); });cant get the result after install form-data from npm