Using connect-flash with NestJs - express

I'm trying to use connect-flash with NestJS, and I'm geting a strange error that I can't seem to parse. I have the following in my main.ts:
import connectFlash from 'connect-flash';
async function bootstrap() {
...
// Allow us to redirect with flash messages
app.use(connectFlash());
await app.listen(process.env.PORT || 3000);
}
And I get the follwoing error on boot:
app.use(connectFlash());
^
TypeError: (0 , connect_flash_1.default) is not a function
at bootstrap (/Users/stuartharrison/Documents/regulated-professions-register/src/main.ts:59:23)
at processTicksAndRejections (node:internal/process/task_queues:96:5)
Can anyone help me please?

connect-flash does not use a default export. Use import * as flash from 'connect-flash' instead

Related

using redis in getServerSideProps results in error net.isIP is not a function

Correct me if I am wrong but getServerSideProps is used to pre-render data on each render? If I use the standard redis npm module in getServerSideProps I get the error net.isIP is not a function. From what I have researched this is due to the client trying to use the redis functions.
I am trying to create an application to where session data is saved in a redis key based on a cookie token. Based on the user Id a database is called and renders data to the component. I can get the cookie token in getServerSideProps but I I run client.get(token) I get the error net.isIP is not a function at runtime.
Am I not using getServerSideProps correctly or should I be using a different method / function? I am new to the whole Next.js world. I appreciate the help.
If I use the same functionality in an /api route everything works correctly.
import util from 'util';
import client from '../libs/redis' // using 'redis' module
// ... my component here
export async function getServerSideProps(context) {
const get = util.promisify(client.get).bind(client);
const name = await get('mytoken') // error `net.isIP is not a function`
return {
props: {
name
},
}
}
// redis.js
const redis = require("redis");
const client = redis.createClient();
client.on("error", function(error) {
console.error(error);
});
module.exports = client
I upgraded to next version 10.0.6 from 9.3 and I do not receive the error anymore.

VueJS 2 does not report any errors (Sentry.io)

I have a Laravel (5.4) application with VueJs2 (2.1.10). I am using Sentry.io as error reporting for our Backend which works fine. When an error occurred from VueJs I am unable to catch it nor send it to Sentry.
Here is the documentation which I used to install Sentry through NPM according to the Raven settings: https://docs.sentry.io/clients/javascript/integrations/vue/
My config in app.js is the following:
import Raven from 'raven-js';
import RavenVue from 'raven-js/plugins/vue';
Raven
.config('https://[filtered]#sentry.io/[filtered]')
.addPlugin(RavenVue, Vue)
.install();
Building the code works fine through webpack. The question I would like to get some help with is why Vuejs is not reporting any errors to Sentry?
I have tried to force a couple of errors including non existing template variables, http error responses, incorrect component declaration, syntax errors. All those errors do result in console errors but non are send to Sentry.
Any suggestions on where to start or what to do to get error reporting to work with Sentry and Vuejs2? Thanks in advance!
I just started with Sentry as well and have the same problem.
The only workaround I found so far is to include Raven in every single component and to call Raven explicitely when an error occurs (plus your code for app/main.js):
MyComponent.vue
<template>
Click me
</template>
<script>
import Raven from 'raven-js'
export default {
name: 'MyComponent',
data () {
return {
loggedIn: false
}
}
methods: {
createError () {
try {
if (!this.loggedIn) throw new Error('User not logged in')
console.log('User is logged in')
} catch (error) {
Raven.captureException(error)
}
}
}
}
</script>
<style scoped>
</style>
This may be caused by your javascript file is not the same origin with your html file. In this condition, all the javascript errors are caught as 'Script Error', 'Script Error' is sometimes also called a cross-origin error. And sentry discard javascript error /^Script error\.?$/ and /^Javascript error: Script error\.? on line 0$/.
Below is the sentry relative code
// "Script error." is hard coded into browsers for errors that it can't read.
// this is the result of a script being pulled in from an external domain and CORS.
globalOptions.ignoreErrors.push(/^Script error\.?$/);
globalOptions.ignoreErrors.push(/^Javascript error: Script error\.? on line 0$/);
Another Conditon:
you may use vue-cli-service, which default use webpack devtool:eval configuration, this cause chrome bugs: https://bugs.chromium.org/p/chromium/issues/detail?id=765909
Try this
main.js
Import VueRaven, { Raven } from 'vue-raven'
Vue.use(VueRaven, {
dsn:'yourdsn'
}

Property 'close' does not exist on type 'Application'

I am importing expressjs like this:
import { Request, Response, Application, Router } from 'express';
const app: Application = require('express')();
and in typings.json:
"express": "registry:npm/express#4.14.0+20160925001530",
when i type app.close() i get:
[ts] Property 'close' does not exist on type 'Application'.
How can i solve this?
Where can i report this? (if it is a bug)
Am i the only one struggling alot with typescript typings?
The definition of Application provided does not have the method close...Server does and (app:Application).listen returns a Server.
start(){
server = app.listen(options.port, function () {
debug('Server listening on port ' + options.port)
})
}
stop(){
server.close();
}
You can report typings that are Definitely typed here. This is the package coming from npm.
Typescript is hard.

angular2 testing, error in ViewUtils when using setBaseTestProviders()

When using the method 'setBaseTestProviders(..)', an error pops up in the console.
We're using angular-2.0.0-rc.1.
The test (test/areas-list.component.spec.ts) is as follows:
import {setBaseTestProviders} from "#angular/core/testing";
import {ADDITIONAL_TEST_BROWSER_PROVIDERS, TEST_BROWSER_STATIC_PLATFORM_PROVIDERS} from '#angular/platform-browser/testing/browser_static';
import {BROWSER_APP_DYNAMIC_PROVIDERS} from '#angular/platform-browser-dynamic';
setBaseTestProviders([
BROWSER_APP_DYNAMIC_PROVIDERS,
ADDITIONAL_TEST_BROWSER_PROVIDERS,
], TEST_BROWSER_STATIC_PLATFORM_PROVIDERS);
describe('test test', () => {
//Not really important
});
When I open the browser, the following error is shown in the console:
zone.js:323 Error: Error: Cannot resolve all parameters for 'ViewUtils'(RootRenderer, undefined #Inject(Token AppId), SanitizationService). Make sure that all the parameters are decorated with Inject or have valid type annotations and that 'ViewUtils' is decorated with Injectable.
at NoAnnotationError.BaseException [as constructor] (http://127.0.0.1:8080/node_modules/#angular/core/src/facade/exceptions.js:17:23)
at new NoAnnotationError (http://127.0.0.1:8080/node_modules/#angular/core/src/di/reflective_exceptions.js:217:16)
at _extractToken (http://127.0.0.1:8080/node_modules/#angular/core/src/di/reflective_provider.js:232:15)
at eval (http://127.0.0.1:8080/node_modules/#angular/core/src/di/reflective_provider.js:184:45)
at Array.map (native)
at _dependenciesFor (http://127.0.0.1:8080/node_modules/#angular/core/src/di/reflective_provider.js:184:19)
at resolveReflectiveFactory (http://127.0.0.1:8080/node_modules/#angular/core/src/di/reflective_provider.js:72:24)
at resolveReflectiveProvider (http://127.0.0.1:8080/node_modules/#angular/core/src/di/reflective_provider.js:96:97)
at Array.map (native)
at Object.resolveReflectiveProviders (http://127.0.0.1:8080/node_modules/#angular/core/src/di/reflective_provider.js:104:31)
Evaluating http://127.0.0.1:8080/test/areas-list.component.spec.js
Error loading http://127.0.0.1:8080/test/areas-list.component.spec.js
Does somebody know what the problem is? Thanks in advance!
Is there any specific case you're trying to achieve with browser static?
Here is the basic config:
import { setBaseTestProviders } from '#angular/core/testing';
import {
TEST_BROWSER_DYNAMIC_APPLICATION_PROVIDERS,
TEST_BROWSER_DYNAMIC_PLATFORM_PROVIDERS,
} from '#angular/platform-browser-dynamic/testing';
setBaseTestProviders(TEST_BROWSER_DYNAMIC_PLATFORM_PROVIDERS, TEST_BROWSER_DYNAMIC_APPLICATION_PROVIDERS);

how to catch uncaught exception (globally) in react native

Does anyone know what is the best way to catch all uncaught exception (globally) so that I can send a crash report back to the server? I don't seem to be able to find any information on the react native docs or on github.
You could possibly override the exception logging that React Native uses for development:
ErrorUtils.setGlobalHandler(function() {
// your handler here
});
https://github.com/facebook/react-native/blob/522fd33d6f3c8fb339b0dde35b05df34c1233306/Libraries/JavaScriptAppEngine/Initialization/InitializeJavaScriptAppEngine.js#L46
You may then need to write some Obj-C which you expose to JS, depending on your exact requirements.
This is how I'd do it:
Step 1: We intercept react-native error handler like so:
//intercept react-native error handling
if (ErrorUtils._globalHandler) {
this.defaultHandler = ErrorUtils.getGlobalHandler && ErrorUtils.getGlobalHandler() || ErrorUtils._globalHandler;
ErrorUtils.setGlobalHandler(this.wrapGlobalHandler); //feed errors directly to our wrapGlobalHandler function
}
Step 2: Now our wrapGlobalHandler gets called whenever theres an unhandled error. So do anything you want with the error within this function.
Then do something with the error:
async function wrapGlobalHandler(error, isFatal){
const stack = parseErrorStack(error);
//do anything with the error here
this.defaultHandler(error, isFatal); //after you're finished, call the defaultHandler so that react-native also gets the error
}
Full code here:
import stacktraceParser from 'stacktrace-parser';
const parseErrorStack = (error) => {
if (!error || !error.stack) {
return [];
}
return Array.isArray(error.stack) ? error.stack :
stacktraceParser.parse(error.stack);
};
// intercept react-native error handling
if (ErrorUtils._globalHandler) {
this.defaultHandler = (ErrorUtils.getGlobalHandler
&& ErrorUtils.getGlobalHandler())
|| ErrorUtils._globalHandler;
ErrorUtils.setGlobalHandler(this.wrapGlobalHandler); // feed errors directly to our wrapGlobalHandler function
}
async function wrapGlobalHandler(error, isFatal) {
const stack = parseErrorStack(error);
//do anything with the error here
this.defaultHandler(error, isFatal); //after you're finished, call the defaultHandler so that react-native also gets the error
}
Thats it!
You can try https://github.com/master-atul/react-native-exception-handler.
A react native module that lets you to register a global error handler that can capture fatal/non fatal uncaught exceptions. The module helps prevent abrupt crashing of RN Apps without a graceful message to the user.
There is a native way.
RCTBridge *bridge = [[RCTBridge alloc] initWithBundleURL:_scriptURL
moduleProvider:^{
id<RCTExceptionsManagerDelegate> customDelegate = ...
return #[[RCTExceptionsManager initWithDelegate:customDelegate];
}
launchOptions:nil];
Just put your report logic in the customDelegate.
There's now react-native-error-reporter, which pretty much does the trick in a very simple way:
npm i react-native-error-reporter --save
rnpm link
Then add this lines to your code:
import ErrorReporter from 'react-native-error-reporter';
ErrorReporter.init("vanson#vanportdev.com", "My App's Crash Report");
In case you're using Redux, you might wanna try redux-catch middleware.