New Route in Laravel 9 Doesnt Appear - laravel-9

So... completely new to Laravel and I've run into a fairly basic problem.
I've googled this and searched through stackoverflow and cant find and answer.
I've added a new route into routes/web.php
Route::get('/contact', function () {
return "It works.";
});
The whole web.php looks like this:
<?php
use Illuminate\Support\Facades\Route;
Route::get('/', function () {
return view('welcome');
});
Route::get('/contact', function () {
return "It works.";
});
But I get a 404 when i try to access it.
Laravel is serving ok as I get the generic Laravel
I've tried:
php artisan route:clear
php artisan cache:clear
But still doesn't show anything, can anyone point me in the right direction?
Laravel Version: Laravel v9.41.0 (PHP v8.1.8)
Thanks

Disabled Apache... all good... jeez its always the stupid things that get me.

Related

MethodNotAllowedHttpException using inertia

I'm using Inertia and Laravel. I registered routes in web.php. When I send data to the server, I get error 405 which tells me MethodNotAllowedHttpException and the PUT methods is not allowed for this route but the data was updated successfully in database;
in question componet.vue
update(){
this.$inertia.put(`questions/${this.id}`, this.question, {
onSuccess: () => {
//do some stuffs
})
}
in QuestionsController.php
public function update(AskQuestionRequest $request, Question $question)
{
$question->update($request->only(['title', 'body']));
return redirect()->back()->with('successMsg', 'Your Question has been updated successfully');
}
This generally occurs when the Inertia middleware has not been installed in your app. If you recently upgraded the inertiajs/inertia-laravel package to 0.3.x, you need to follow the upgrade instructions here to install the middleware in your app.

Vuex Action never resolve

I'm having problem to make my Action resolve the promise.
I've read what looks like the most relevant posts.
Returning Promises from Vuex actions
I want to know when my action is finished, then my component can start doing other stuff.
The problem is, the Action never returns the Promise.
myComponent.vue
methods: {
loadUrls() {
this.$store.dispatch('getUrls').then(result => {
console.log("getUrls result", result)
})
},
vuex.js
actions: {
getUrls() {
console.log("getUrls")
return new Promise((resolve) => {
setTimeout(() => {
console.log("setTimeout in")
resolve("Resolved!")
}, 1000)
})
},
That's my console log:
I've used the "setTimeout" to make as simple as possible the problem. In real life I call an API.
I do not need to rely on the result of this promise. I'm aware about it. I use Vuex as the source of truth, but I need to track when the event in completed.
Thanks in advance =)
SOLVED! It worked after I delete my dist Folder, close VSCode and open a new Chrome instance using the new build local host URL.
Thanks #User-28. I saw his shared code and realised nothing was wrong with my code. Then I start looking at my environment.
My very first code didn't have Promise Resolve in the action. I compiled and I was testing it.
Then I found Returning Promises from Vuex actions which explained how to use the Promise in it. I compiled and I was TRYING to test it. Never success. Somehow the code without the Promise was always there. After clean up Dist folder, Close VS code and use a new Chrome instance, the new code was in place and worked.
I'm still don't know the actual problem, but at least it can keep going forward now.

Nuxt 404 error page should redirect to homepage

I am looking for a way to always redirect to homepage when a page doesn't exist using Nuxt.Js.
Our sitemap generation had some problems a few days back and we submitted wrong urls that do not exist. Google Search Console shows a big number of 404 and we want to fix them with 301 redirect to homepage.
I tried this
created() {
this.$router.push(
this.localePath({
name: 'index',
query: {
e: 'er'
}
})
)
}
and although the page redirects to homepage successfully I think Google will have problems with this since the pages initially renders with 404.
I also tried this
async asyncData({ redirect }) {
return redirect(301, '/el?e=rnf')
},
but didn't work (same with fetch)
Any ideas on a solution to this?
Never redirect to home if page is not found as you can see in this Google's article: Create custom 404 pages
instead, redirect to 404 error page
Just use error
async asyncData({ params, $content, error }) {
try {
const post = await $content('blog', params.slug).fetch()
return { post }
} catch (e) {
error({ statusCode: 404, message: 'Post not found' })
}
}
do not forget to creat an error page in layout folder error.vue
You are able to create a default 404-page in nuxt - just put a file with a name _.vue in your ~/pages/ dir. This is your 404-page :)
or you can use another method to create such page: https://github.com/nuxt/nuxt.js/issues/1614 but I have not tried it
Then add a simple 404-redirect-middleware to this page:
// !!! not tested this code !!!
middleware: [
function({ redirect }) {
return redirect(301, '/el?e=rnf')
},
],
Personally I would advise to create a 404 page which provides a better user experience in comparison to being redirected to a homepage and potentially being confused about what happened.
In order to create a custom error page, just create error.vue file in the layouts folder and treat it as a page. See the official documentation. We've implemented this plenty of times and Google has never complained about it.
Still, gleam's solution is clever and if it serves the purpose, very well. Just wanted to point out another solution.
If you need to provide custom routes to your users like domain.com/<userID>
then putting a file with a name _.vue in your ~/pages/ directory will not work, because you'll need it for your custom user routes.
For maximum flexibility use the layouts folder as mentioned by Dan
Create a file called _.vue at pages directory with content:
<script>
export default {
asyncData ({ redirect }) {
return redirect('/')
}
}
</script>

Ember.JS : 'serializer.get is not a function'

So i'm learning EMBER JS from codeschool and i sometime like to save my current progress into my computer. Everything went nice and smoothly until we started to see Array Controller ( and by nice and smoothly i mean everything was working fine, as it does on codeschool ). Since then i got this error :
Error while processing route: index serializer.get is not a function TypeError: serializer.get is not a function
at ember$data$lib$system$store$serializer$response$$normalizeResponseHelper (http://localhost:63342/Cours/EmberJS/Flint/js/vendors/ember-data.js:5696:24)
at http://localhost:63342/Cours/EmberJS/Flint/js/vendors/ember-data.js:7450:31
at Object.Backburner.run (http://localhost:63342/Cours/EmberJS/Flint/js/vendors/ember.js:222:25)
at ember$data$lib$system$store$$Service.extend._adapterRun (http://localhost:63342/Cours/EmberJS/Flint/js/vendors/ember-data.js:13030:37)
at http://localhost:63342/Cours/EmberJS/Flint/js/vendors/ember-data.js:7449:19
at tryCatch (http://localhost:63342/Cours/EmberJS/Flint/js/vendors/ember.js:54770:14)
at invokeCallback (http://localhost:63342/Cours/EmberJS/Flint/js/vendors/ember.js:54785:15)
at publish (http://localhost:63342/Cours/EmberJS/Flint/js/vendors/ember.js:54753:9)
at http://localhost:63342/Cours/EmberJS/Flint/js/vendors/ember.js:31568:7
at Queue.invoke (http://localhost:63342/Cours/EmberJS/Flint/js/vendors/ember.js:901:16)
So i thought, somehow, my ember.js or ember-data.js was the culprit but nay, it's not ( im up-to-date ). I think the bug is somewhere located in the way i initialize my Route ( eventho i copy/pasted the content of my local files from those on codeschool who works perfectly ) and according to the error message, i think the index route is responsible so here is my router map :
App.Router.map(function() {
this.route('credits', { path: '/thanks' });
this.resource('products', function() {
this.resource('product', { path: '/:product_id' });
});
this.resource('contacts', function() {
this.resource('contact', { path: '/:contact_id' });
});
});
And here's my route ( they're all made like this one, except that i sometime search in 'contact' rather than 'product' )
App.IndexRoute = Ember.Route.extend({
model: function(){
return this.store.findAll('product');
}
});
We also use the fixture adapter so it might come from this too :
App.ApplicationAdapter = DS.FixtureAdapter.extend({});
Does anybody ever got this bug about the serializer ? Thank you'all in advance !
I believe this is due to the removal of the Fixture Adapter in a recent ember-data release. I'm just learning ember myself, but I was finally able to get rid of this error using a combination of reverting to a slightly older ember-data version and installing the replacement Fixture Adapter addon.
In your application dir, update the ember-data line in both bower.json and package.json to:
"ember-data": "1.0.0-beta.19.2",
and in package.json add this line after the ember-data one:
"ember-data-fixture-adapter": "^1.0.0",
Delete the bower_components and node_modules dirs in your application, and then run npm install and bower install from your application's home dir.

gulp-durandal TypeError: req.toUrl is not a function

I try to implement gulp to my durandal project as explain on Durandal gulp doc
main.js file is successfully build, but when trying to click something that will open a modal dialog, it will show this error (firefox):
TypeError: req.toUrl is not a function
url = req.toUrl(nonStripName),
main.js (line 48306, col 16)
here my configuration on gulpfile.js
var gulp = require('gulp');
var durandal = require('gulp-durandal');
gulp.task('default', function(cb)
{
durandal({
baseDir: 'public_html/app',
main: 'main.js',
output: 'main.js',
almond: true,
minify: false
})
.on('error', function(err) {
console.error('error. ' + err);
})
.pipe(gulp.dest('public_html/build'))
.on('end', cb);
});
I'm also came across with this answer https://stackoverflow.com/a/23329383/1889014
But i'm not sure if this is related to my issue.
Can someone please help or guide me through this ? Thanks!
I also had this issue using gulp, Durandal and modal dialogs. Adding a getView function to the viewmodel that returns the url for the view fixes it.
eg
function getView() {
return "views/theView.html";
}
I am sure there must be a better way of solving this problem but this seems to work in the few places I have needed it.
I have experienced this error due to writing the view name using the wrong case. E.g. if the file is called myView.html but you require 'MyView'.
I am not building using gulp-durandal because it's giving very odd errors, and requirejs is working much better directly. I fixed this error by including all views manually in my requirejs build config.
include: [
'text!customWidgets/alertsSection/title.html', //custom
'text!customWidgets/alertsSection/body.html', //custom
'text!customWidgets/exclusions/body.html', //custom
'text!customWidgets/exclusions/title.html', //custom
'text!customWidgets/submit/body.html', //custom
'text!customWidgets/submit/title.html', //custom
]
There are many more files in my include due to the nature of durandal and the dynamic loading of views... but I don't want to spam everyone :)