Lightrun
question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

ERROR { Error: Uncaught (in promise): ReferenceError: FormData is not defined

See original GitHub issue

Hello 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:closed
  • Created 5 years ago
  • Comments:7 (2 by maintainers)

github_iconTop GitHub Comments

5reactions
rcpmcommented, Oct 19, 2018

Install form-data via npm npm install form-data

then import form-data to your component or service import * as FormData from 'form-data';

0reactions
safetywagoncommented, Sep 2, 2020

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

Read more comments on GitHub >

github_iconTop 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 >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found
Previous page

Problem with using typescript in server code

Next page

No provider for ORIGIN_URL