Nuxt.js middleware this._router.init is not a function - middleware

Using this example https://nuxtjs.org/guide/routing#middleware to set a middleware I get the error this._router.init is not a function.
In default.vue I have
export default {
router: {
middleware: 'test'
},
...
}
And in middleware I have the file test.js with the following content:
export default function (context) {
context.userAgent = process.server ? context.req.headers['user-agent'] : navigator.userAgent
}
Basically I copied whatever was on that page to see if it worked and it does not.

You are reading it wrong. There shouldnt be such thing in default.vue. It says it should be in nuxt config.
nuxt.config.js
export default {
router: {
middleware: 'stats'
}
}
Or if its for page its without router key
export default {
middleware: 'stats'
}

Related

Strapi: error when I register custom middlewares

I’m creating middlewares in strapi
I have three models, company, profile, people, and I’m registering three middlewares,
For instance, the middleware for company is in:
src/api/company/middlewares/my-middleware, which is:
module.exports = (config, { strapi }) => {
return (context, next) => {
console.log("middleware of company”);
};
};
I register each middleware in ./config/middlewares.js as (I'm following strapi v4 documentation)
https://docs.strapi.io/developer-docs/latest/setup-deployment-guides/configurations/required/middlewares.html
module.exports = [
"strapi::errors",
"strapi::security",
"strapi::cors",
"strapi::poweredBy",
"strapi::logger",
"strapi::query",
"strapi::body",
"strapi::session",
"strapi::favicon",
"strapi::public",
{
resolve: "./src/api/company/middlewares/my-middleware",
},
{
resolve: "./src/api/people/middlewares/my-middleware",
},
{
resolve: "./src/api/profile/middlewares/my-middleware",
},
];
No matter where I place these registrations, the outcome is the same
But now, if I call, from postman, http://localhost:1337/api/companies?populate=*, for example, the middleware is executed but I get an error saying that this address was not found,
If I comment out the middlewares registration, the error disappears but the middlewares are not executed
What could I be doing wrong?
Thanks in advance
It seems like you never call the next function.
module.exports = (config, { strapi }) => {
return (context, next) => {
console.log("middleware of company”);
next()
};
};
Keep in mind that if your middleware is async, you need to await next().

Vue - watch url without VueRouter

Is it possible to react on URL changes in a Vue component, without including VueRouter?
In case VueRouter is present, we can watch $route, however, my application does not rely on VueRouter.
export default {
watch: { '$route': route => console.log(window.location.href) }
}
Before I used vue router, I did something like this...
data: function() {
return {
route: window.location.hash,
page: 'home'
}
},
watch: {
route: function(){
this.page = window.location.hash.split("#/")[1];
}
}

Angular rails templates not working in production

I use aws ec2 with elastic beanstalk(eb) to deploy application then I try to access application I got empty page and no error on console. I put my template under
app/assets/templates/simple_template.html.erb
Then I tried to check with server in rails log (production.log) nginx log (access.log , error.log) is no any error in these logs
I search on Google then I found some people talk about
gem sprockets
then I put gem 'sprockets', '~> 3.0' to gem file is still not working
More Detail
Empty page
Inspect HTML
jdgray I tried many debug I just found and post it in here https://github.com/pitr/angular-rails-templates/issues/155
Checkout this
use strict'
alert('route'); <----- is working
angular.module('core').config(['$stateProvider', '$urlRouterProvider', function ($stateProvider, $urlRouterProvider) {
// Redirect to 404 when route not found
$urlRouterProvider.otherwise(function ($injector, $location) {
$injector.get('$state').transitionTo('not-found', null, {
location: false
});
});
alert('inside route') <--- is working
// Home state routing
$stateProvider
.state('home', {
url: '/',
abstract: true,
templateUrl: 'players/layout/home.client.view.html',
controllerAs: 'vm',
controller: 'MasterController',
resolve: {
user_noti: function($http, $stateParams,jwtHelper, $window) {
alert('insde part') <--- not woking
if($window.user) {
return $http.get('/api/v1/notifications');
} else {
return [];
}
},
user_unconfrim_ticket: function($http, $stateParams,jwtHelper, $window){
if($window.user) {
return $http.get('/api/v1/tickets/unconfrim');
} else {
return [];
}
}
}
})
.state('home.index', {
url: '',
controllerAs: 'vm',
controller: 'HomeController',
data: {
ignoreState: true
},
templateUrl: 'players/home.client.view.html',
resolve: {
reward_data: function($http, $stateParams) {
return $http.get('/api/v1/rewards');
},
answers_data: function($http, $stateParams){
return $http.get('/api/v1/answers/current');
}
}
})
.state('home.game', {
url: 'game',
controller: 'GameController',
controllerAs: 'vm',
data: {
roles: ['player']
},
templateUrl: 'players/game/game.client.view.html'
});
}]);
And I put alert() in top of controller file is working and inside controller function is not working, I thought is not working since route can't detect the path
Any Sugesstion?
Update: I found actually problem, A real problem. if some state have resolve function it will be freeze ui. I don't know why because I never met before. I working with resolve many time only error form server will make resolve and ui will freeze. I ran "rails s -e production" is work normal but on real server not working

EmberJS making HTTP Post request to Rails API server using ember-ajax

So I have a Rails API and an Ember application. At the moment, my Ember has a login.hbs template and a login.js controller.
I have done a ember install ember-ajax (https://github.com/ember-cli/ember-ajax).
On entering an email and password, I click on the login button which calls my login.js action loginClicked()
I have the following in my login controller:
// login.js controller
import Ember from 'ember';
export default Ember.Controller.extend({
email: '',
password: '',
actions: {
loginClicked() {
// alert("email: " + this.get('email') + "\npassword: " + this.get('password'));
let params = {
email: this.get('email'),
password: this.get('password')
};
post('/authenticate', {
params: params
});
}
}
});
In my login.js route handler, I have injected the ember-ajax service:
// login.js route handler
import Ember from 'ember';
export default Ember.Route.extend({
ajax: Ember.inject.service()
});
The problem is, my Mac terminal console is outputting an error saying:
controllers/login.js: line 16, col 7, 'post' is not defined.
I have also tried injecting the ember-ajax service into my controller but it made no difference.
Am I doing something wrong ?
Everything is described into the ember-ajax github page https://github.com/ember-cli/ember-ajax
export default Ember.Controller.extend({
ajax: Ember.inject.service(),
actions: {
loginClicked() {
let params = {
email: this.get('email'),
password: this.get('password')
};
return this.get('ajax').request('/authenticate', {
method: 'POST',
data: params
});
}
}
});
Basically, to access any property of your controller (component, ...) in ember, you need to get it using this.get('propertyName').
Here you need to use the request method of the ajax property (the injected service).

Ember.js Error | Cannot read property 'some' of undefined

I'm using Ember for the front end and I am doing basic testing to see if I can properly render my data before adding components. I have two resources 'Topics' and 'Ratings' and I have added both a route and a model hook for these resources. When I type http://localhost:4200/topics, I am able to see all of the topics being rendered on the template. However, when I type http://localhost:4200/ratings, I receive an error on the console saying:
ember.debug.js:32096TypeError: Cannot read property 'some' of undefined
at error (route.js:21)
at Object.triggerEvent (ember.debug.js:28580)
at Object.trigger (ember.debug.js:53473)
at Object.Transition.trigger (ember.debug.js:53287)
at ember.debug.js:53107
at tryCatch (ember.debug.js:53806)
at invokeCallback (ember.debug.js:53821)
at publish (ember.debug.js:53789)
at publishRejection (ember.debug.js:53724)
at ember.debug.js:32054
Which is strange because in my rails console, I am receiving a HTTP: 200 response. Is there some error within the code of my routes? I made sure to mirror ratings similar to topics. Or is this an association issue? Both a USER and a TOPIC have many ratings. I provided snippets of my code below:
Application Route:
import Ember from 'ember';
export default Ember.Route.extend({
auth: Ember.inject.service(),
flashMessages: Ember.inject.service(),
actions: {
signOut () {
this.get('auth').signOut()
.then(() => this.transitionTo('sign-in'))
.then(() => {
this.get('flashMessages').warning('You have been signed out.');
})
.catch(() => {
this.get('flashMessages')
.danger('There was a problem. Are you sure you\'re signed-in?');
});
this.store.unloadAll();
},
error (reason) {
let unauthorized = reason.errors.some((error) =>
error.status === '401'
);
if (unauthorized) {
this.get('flashMessages')
.danger('You must be authenticated to access this page.');
this.transitionTo('/sign-in');
} else {
this.get('flashMessages')
.danger('There was a problem. Please try again.');
}
return false;
},
},
});
Rating Model:
import Model from 'ember-data/model';
import attr from 'ember-data/attr';
import { belongsTo } from 'ember-data/relationships';
export default Model.extend({
score: attr('number'),
user: belongsTo('user'),
topic: belongsTo('topic')
});
Rating Route:
import Ember from 'ember';
export default Ember.Route.extend({
model(params) {
return this.get('store').findRecord('rating', params.id);
},
});
```
Ratings Route:
import Ember from 'ember';
export default Ember.Route.extend({
model() {
return this.get('store').findAll('rating');
},
});
Router:
import Ember from 'ember';
import config from './config/environment';
const Router = Ember.Router.extend({
location: config.locationType,
});
Router.map(function () {
this.route('sign-up');
this.route('sign-in');
this.route('change-password');
this.route('users');
this.route('topics');
this.route('topic', { path: '/topics/:id'});
this.route('ratings');
this.route('rating', { path: '/ratings/:id'});
// Custom route in topics controller that will call NYT API or generate random-show
//topic. This is a GET request essentially
this.route('random-show');
});
export default Router;
SOLVED! Read the DOCS, and used EXPLICIT INVERSNESS:
https://guides.emberjs.com/v2.5.0/models/relationships/
Apparently, Ember needs help understanding when you have multiple has Many or Belong to for the same type.

Resources