I am unable to trigger the Next.js's 500 error page. Most resources talks about making a custom error page but the Next.js doc briefly mentions their default 500 error page. I would like to trigger this default page when the API responds with a 500 status.
Given an API response of 500 Next.js should display a 500 error page. So far it returns to the page where the request was made.
return res.status(500).end();
The only solution I found is to throw an unhandled error from getServerSideProps:
res.statusCode = 500;
throw new Error('Internal Server Error');
I saw that NextJs handle this as a 500 status code, but only on the production/staging environment. npm run dev will not work, and you will not be able to see the default 500 page.
I needed to throw a 500 status code to prevent Google from deindexing my page because the page content suffered significant changes, and the products from this page were not available anymore.
This is how I was able to trigger this, using npm run build and npm run start
(I put this random error trigger in my index page)
export const getServerSideProps: GetServerSideProps = async () => {
function getRandomInt(max: number): number {
return Math.floor(Math.random() * max);
}
if (getRandomInt(10) === 5) {
throw new Error('Internal Server Error');
}
return {
props: {
},
}
}
After defining the custom 500 page at pages/500.ts as mentioned in the official doc, I'm able to access this page at the url path /500.
Related
I have a page that I get the desired data from within the page using asyncData. When I go to this page from the home page, there is no problem, but if I refresh the same page, the page gets error 500.
in my project SSR is TRUE
and this is my code:
import { GetPriceDetails } from "#/services";
asyncData({ params }) {
return GetPriceDetails.getDetails(params.coinName).then(
(res) => {
return {
coinData: res.data.data,
};
}
);
},
I've change target to static and try npm run generate
that point is this issue occure on localhost not production server
I still think we need to see where that part is failing, but also try it with async/await
async asyncData({ params }) {
const coinData = (await GetPriceDetails.getDetails(params.coinName).data;
return { coinData };
}
I'm trying to show an error page when an error occurs on the client side Javascript of Vue components.
In dev mode, I get a customer error page I've created in the layouts/error.vue page whenever the client runs into an error. But when I build and start the app no error page is displayed even though the error is logged in the console. This error page is only displayed for server errors.
I've tried creating a custom error handling component using the following code:
mounted() {
window.onerror = this.onError
},
methods: {
onError(msg, source, ln, cn, err) {
console.log('Error received')
this.show = true
this.error = { msg, source, ln, cn, err }
}
}
However, this function does not seem to handle the client sides error that occurs.
Does anyone know what the best way is to handle all unhandled clients side errors?
Can we explicitly and specifically catch Puppeteer (Chromme/Chromium) error net::ERR_ABORTED? Or is string matching the only option currently?
page.goto(oneClickAuthPage).catch(e => {
if (e.message.includes('net::ERR_ABORTED')) {}
})
/* "net::ERROR_ABORTED" occurs for sub-resources on a page if we navigate
* away too quickly. I'm specifically awaiting a 302 response for successful
* login and then immediately navigating to the auth-protected page.
*/
await page.waitForResponse(res => res.url() === href && res.status() === 302)
page.goto(originalRequestPage)
Ideally, this would be similar to a potential event we could catch with page.on('requestaborted')
I'd recommend putting your api calls and so in a trycatch block
If it fails, you catch the error, like you are currently doing. But it just looks a bit nicer
try {
await page.goto(PAGE)
} catch(error) {
console.log(error) or console.error(error)
//do specific functionality based on error codes
if(error.status === 300) {
//I don't know what app you are building this in
//But if it's in React, here you could do
//setState to display error messages and so forth
setError('Action aborted')
//if it's in an express app, you can respond with your own data
res.send({error: 'Action aborted'})
}
}
If there are not specific error codes in the error responses for when Puppeteer is aborted, it means that Puppeteer's API has not been coded to return data like that, unfortunately :')
It's not too uncommon to do error messages checks like you are doing in your question. It's, unfortunately, the only way we can do it, since this is what we're given to work with :'P
Is there a way to edit the default error return by Strapi for permission / token error?
For example, in roles & permissions under Public role, I uncheck the route for send-email-confirmation. If I use postman and try doing localhost:1337/auth/send-email-confirmation, I would get such error return
{
"statusCode": 403,
"error": "Forbidden",
"message": "Forbidden"
}
I believe this is the default middleware / policy I know where I can get the default send-email-confirmation controller and edit it, but that is only if Roles & Permissions are enabled / checked inside public role.
Same as if a route requires headers of Authorization token but if it is not provided, a default error will be given again which I am not able to find where to customize it.
I don't seem to find it inside strapi documentation or maybe I am using the wrong key words to search.
Thanks in advance for any suggestions + advices.
auth token - permissions validation and errors are managed in this file - https://github.com/strapi/strapi/blob/0c6d39297f6f8a4f983e22fb48256b42da2a8605/packages/strapi-plugin-users-permissions/config/policies/permissions.js#L15
If you want to update this file, you will have to follow the customization concept - https://strapi.io/documentation/3.0.0-beta.x/concepts/customization.html#plugin-extensions
With this, you will be able to change the error message.
Create custom error response files
In folder config/functions/responses/, create corresponding files with relevant filename matching the error code. Inside you can inspect the event and return a custom response. This works for me using Strapi 3.6.8. I'm not sure of latest Strapi. Here's an older doc page with error codes as reference.
Create files in this format for a variety of error codes...
Examples:
config/functions/responses/404.js
'use strict'
module.exports = async (ctx) => {
// Do other stuff
console.log("404 response is: %O, ctx)
// Return a specific error format (e.g. 'notFound') with your own custom message
return ctx.notFound('My custom 404 message')
}
config/functions/responses/403.js
'use strict'
module.exports = async (ctx) => {
// Do other stuff
console.log("403 response is: %O, ctx)
// Return a specific error format (e.g. 'forbidden') with your own custom message
return ctx.forbidden('My custom 403 message')
}
For some reason documents created on my app are not showing up on my remote couchdb database.
I am using the following
import PouchDB from 'pouchdb-react-native'
let company_id = await AsyncStorage.getItem('company_id');
let device_db = new PouchDB(company_id, {auto_compaction: true});
let remote_db = new PouchDB('https://'+API_KEY+'#'+SERVER+'/'+company_id, {ajax: {timeout: 180000}});
device_db.replicate.to(remote_db).then((resp) => {
console.log(JSON.stringify(resp));
console.log("Device to Remote Server - Success");
return resp;
}, (error) => {
console.log("Device to Remote Server - Error");
return false;
});
I get a successful response the response:
{
"ok":true,
"start_time":"2018-05-17T15:19:05.179Z",
"docs_read":0,
"docs_written":0,
"doc_write_failures":0,
"errors":[
],
"last_seq":355,
"status":"complete",
"end_time":"2018-05-17T15:19:05.555Z"
}
When I go to my remote database, document_id's that am able to search and grab on the application do not show up.
Is there something I am not taking into account?
Is there anything I can do to check why this might be happening?
This worked when I used the same scripting method in Ionic and when I switched to React-Native I noticed this is the case.
NOTE: When I do .from() and get data from remote to the device, I get the data. For some reason it just isn't pushing data out
"Is there anything I can do to check why this might be happening?"
I would try switching on debugging as outlined here.
PouchDB.debug.enable('*');
This should allow you to view debug messages in your browser's JavaScript console.