I would like to apply PWA in nuxt(#2.3.4) web application.
The operating system is OSX latest.
So I have installed #nuxtjs/pwa and add some config to nuxt.config.js.
These are what I have added
module.exports = {
...
modules: [
['#nuxtjs/pwa', {icon : false}]
],
workbox : {
dev: true,
debug: true
},
manifest : {
viewport: 'width=device-width, initial-scale=1',
theme_color: '#3B8070'
},
...
}
And build with NODE_ENV=production and start.
I am able to find sw.js in localhost:9000, but it is not available with
local.jy.net:9000.
I was expecting the same result since I register that hostname on my hosts file.
Here is what I have in /private/etc/hosts.
127.0.0.1 localhost
255.255.255.255 broadcasthost
::1 localhost
127.0.0.1 Juneui-MacBook-Pro.local
127.0.0.1 local.jy.net aad901eb546340cc9a69b0b030b124fc.jy.net
How could I make #nuxtjs/pwa refers system hosts variables?
If you need more information, add reply then I will provide as possible as I can. Thanks.
The #nuxtjs/pwa package is looking for the build.publicPath option: https://github.com/nuxt-community/pwa-module/blob/9f27d5cdae0e0341d6d4b4f6814f91db6eab1432/packages/manifest/index.js#L24
Adding this option to your nuxt.config.js should do the trick:
module.exports = {
...
modules: [
['#nuxtjs/pwa', {icon : false}]
],
workbox : {
dev: true,
debug: true
},
manifest : {
viewport: 'width=device-width, initial-scale=1',
theme_color: '#3B8070'
},
build: {
publicPath: '//local.jy.net:9000/pwa/',
}
...
}
You can find more information about the publicPath property here: https://nuxtjs.org/api/configuration-build#publicpath
Related
I have deployed an API-Platform app using JWT token to ElasticBeanstalk which, as usual, works fine in my local server.
On EB though it is denying access to logged in users despite the correct BearerToken being provided.
This is the error thrown:
{
"errors": [
{
"message": "Access Denied.",
"extensions": {
"category": "graphql"
},
"locations": [
{
"line": 6,
"column": 9
}
],
"path": [
"retrievedQueryUser"
]
}
],
"data": {
"retrievedQueryUser": null
}
}
The query in question attempts to retrieve user profile info through the below graphql config:
* "retrievedQuery"={
* "item_query"=UserProfileResolver::class,
* "normalization_context"={"groups"={"get-owner"}},
* "security"="is_granted('IS_AUTHENTICATED_FULLY') and object == user"
* },
So, it should be a simple matter of checking if the users IS_AUTHENTICATED_FULLY and if it is the user him/herself trying to execute the query.
Far as I could tell, by dump below on /vendor/symfony/security-core/Authorization/AuthorizationChecker.php, it's failing to retrieve a token.
var_dump($this->tokenStorage->getToken()->getUser()->getUsername());
I did a cursory comparison of phpinfo() between my local installation and the one at AWS-EB and could not find any obvious mismatch.
This is the config for JWT at /config/packages/lexik_jwt_authentication.yaml.
lexik_jwt_authentication:
secret_key: '%env(resolve:JWT_SECRET_KEY)%'
public_key: '%env(resolve:JWT_PUBLIC_KEY)%'
pass_phrase: '%env(JWT_PASSPHRASE)%'
user_identity_field: email
token_ttl: 1800
Just to confirm that the users are able to login. It's passing through the isGranted() check that fails.
Any ideas?
EDIT - add `/config/packages/security.yaml
security:
# https://symfony.com/doc/current/security.html#where-do-users-come-from-user-providers
encoders:
App\Entity\User:
algorithm: auto
#algorithm: bcrypt
#algorithm: argon2i
cost: 12
providers:
database:
entity:
class: App\Entity\User
property: email
firewalls:
dev:
pattern: ^/(_(profiler|wdt)|css|images|js)/
security: false
refresh:
pattern: ^/api/token/refresh
stateless: true
anonymous: true
api:
pattern: ^/api
stateless: true
anonymous: true
json_login:
check_path: /api/login_check
success_handler: lexik_jwt_authentication.handler.authentication_success
failure_handler: lexik_jwt_authentication.handler.authentication_failure
guard:
authenticators:
- app.google_login_authenticator
- App\Security\TokenAuthenticator
entry_point: App\Security\TokenAuthenticator
user_checker: App\Security\UserEnabledChecker
access_control:
- { path: ^/login, roles: IS_AUTHENTICATED_ANONYMOUSLY }
- { path: ^/admin, roles: ROLE_SUPERADMIN }
- { path: ^/api/token/refresh, roles: IS_AUTHENTICATED_ANONYMOUSLY }
- { path: ^/api, roles: IS_AUTHENTICATED_ANONYMOUSLY }
role_hierarchy:
ROLE_PROVIDER: ROLE_USER
ROLE_ADMIN: [ROLE_PROVIDER, ROLE_EDITOR]
ROLE_SUPERADMIN: ROLE_ADMIN
Upon further research I found out that Apache was stripping the authorization token from the request.
On the method supports of /lexik/jwt-authenticator-bundle/Security/Guard/JWTTokenAuthenticator, the dump as below will not include the token on AWS:
var_dump($request->headers->all());
var_dump($_SERVER);
As per this question, this is an issue of Apache configuration which is not accepting the authorization headers.
The indicated solution is to add the following to .htaccess:
SetEnvIf Authorization "(.*)" HTTP_AUTHORIZATION=$1
This resolves the issue, though one should note that the local Apache installation works fine without the above edit to .htaccess.
So, it should also be possible to change Apache config directly, but I could not find how to go about it.
EDIT: Later I found a specific instruction on 'JWT-Token' docs as follows, that confirm that solution on this link.
Config;
module.exports = {
apps: [
{
name: 'My App',
script: './dist/app.js',
// Options reference: https://pm2.io/doc/en/runtime/reference/ecosystem-file/
instances: 1,
autorestart: true,
watch: false,
max_memory_restart: '1G',
env: {
NODE_ENV: 'development',
},
env_production: {
NODE_ENV: 'production',
},
},
],
deploy: {
production: {
key: '~/.ssh/id_rsa',
user: '....',
host: 'xx.xxx.xxx.xx',
ref: 'origin/master',
repo: 'git#bitbucket.org:..../....',
path: '/srv/my-app',
ssh_options: ['StrictHostKeyChecking=no', 'PasswordAuthentication=yes'],
'post-deploy':
'yarn && yarn build && pm2 startOrRestart ecosystem.config.js --env production --update-env',
},
},
};
Currently 'PasswordAuthentication=yes' will return git#bitbucket.org: Permission denied (publickey).
If I set it to no, it will return Permission denied (publickey,password).
At no point does it ever prompt me for the SSH key password, it just straight up denies it. It only ever asks for the system password.
How can I solve this since their documentation is pretty garbage and the only thing they suggest on there is making an SSH config which I have done and still doesn't work.
I am trying to connect to MySQL. I have defined the db connection vars in a .env file in my root dir, and I am initializing the connection in the app.module.ts file.
the only issue I am facing now is when creating or running migrations using the CLI,
I followed the typeorm docs here to configure the connection, however when I run typeorm migrate:create -n myNewTable, it should create the migration file in the specified directory, what it does instead is it creates it in the app root directory,
similarily, I solved the issue by using the -d flag after the typeorm migrate:create to specify the directory, however when I try running my migration files, I get this
No connection options were found in any of configurations file.
here is my app.module.ts file.
TypeOrmModule.forRoot({
type: 'mysql',
host: process.env.TYPEORM_HOST,
port: parseInt(process.env.TYPEORM_PORT, 10),
username: process.env.TYPEORM_USERNAME,
password: process.env.TYPEORM_PASSWORD,
database: process.env.TYPEORM_DATABASE,
synchronize: false,
migrations: [process.env.TYPEORM_MIGRATIONS],
cli: {
migrationsDir: process.env.TYPEORM_MIGRATIONS_DIR,
},
logging: (process.env.TYPEORM_LOGGING === 'true') ? true : false,
entities: [__dirname + '/../**/*.entity{.ts,.js}'],
}),
and here is my .env file
# use .ts for development, .js for production
TYPEORM_CONNECTION = mysql
TYPEORM_HOST = 127.0.0.1
TYPEORM_PORT = 3306
TYPEORM_USERNAME = <username>
TYPEORM_PASSWORD = <password>
TYPEORM_DATABASE = <dbname>
TYPEORM_SYNCHRONIZE = true
TYPEORM_MIGRATIONSRUN = true
TYPEORM_LOGGING = true
TYPEORM_ENTITIES = src/**/**.entity.ts
#TYPEORM_ENTITIES = src/**/**.entity.js
TYPEORM_SUBSCRIBERS = src/subscriber/*.ts
#TYPEORM_SUBSCRIBERS = src/subscriber/*.js
TYPEORM_MIGRATIONS = src/database/migration/*.ts
TYPEORM_MIGRATIONS_DIR = src/database/migration
TYPEORM_SUBSCRIBERS_DIR = src/subscriber
any help/hint is highly appreciated, thanks in advance.
Try to change your entities dir in ormconfig.json or .env, it worked for me as:
"entities": ["dist/**/**.entity{.ts,.js}"]
There is an issue, how you are loading the **TypeOrmModule**. The way, you had loaded, it is synchronous so it simply means custom env will not be available instantly on application boot.
So what you can do, is to load TypeOrmModule` asynchronusly like below -
ConfigModule.forRoot({
isGlobal: true, // [REQUIRED if want to use env gloablly among all modules]
}),
TypeOrmModule.forRootAsync({
useFactory: () => ({
type: 'mysql',
host: process.env.TYPEORM_HOST,
port: parseInt(process.env.TYPEORM_PORT, 10),
username: process.env.TYPEORM_USERNAME,
password: process.env.TYPEORM_PASSWORD,
database: process.env.TYPEORM_DATABASE,
synchronize: false,
migrations: [process.env.TYPEORM_MIGRATIONS],
cli: {
migrationsDir: process.env.TYPEORM_MIGRATIONS_DIR,
},
logging: process.env.TYPEORM_LOGGING === 'true' ? true : false,
entities: [__dirname + '/../**/*.entity{.ts,.js}'],
}),
}),
You should specify the connection in ormconfig.json in the project root folder.
looking something like this
{
"type": "postgres",
"host": "localhost",
"port": <port>,
"username": "",
"password": "",
"database": "",
"entities": ["dist/**/*.entity{.ts,.js}"],
"synchronize": true,
"logging": "all",
"migrations": [
"migrations/**/*.js"
],
"subscribers": [
"subscriber/**/*.js"
],
"cli": {
"migrationsDir": "<migrations directory>",
"subscribersDir": "<subscriber directory>"
}
}
Read more in the documentation chapter
On a side note, you might have to remove your dist/ folder for changes to get through.
So I'm trying to use LiteServer in my project, but I can't get it to change the default watch of index.html, my current file is index1.html. I specified app2.js as the entry point during npm init, so I was able to change the JS default, but not for HTML.
> lite-server
Did not detect a `bs-config.json` or `bs-config.js` override file. Using lite-server defaults...
** browser-sync config **
{ injectChanges: false,
files: [ './**/*.{html,htm,css,js}' ],
watchOptions: { ignored: 'node_modules' },
server: { baseDir: './', middleware: [ [Function], [Function] ] } }
[BS] Access URLs:
--------------------------------------
Local: http://localhost:3000
External: http://10.40.244.189:3000
--------------------------------------
UI: http://localhost:3001
UI External: http://10.40.244.189:3001
--------------------------------------
[BS] Serving files from: ./
[BS] Watching files...
16.12.21 18:43:32 200 GET /index.html
16.12.21 18:43:32 200 GET /style.css
16.12.21 18:43:33 200 GET /app2.js
16.12.21 18:43:34 404 GET /favicon.ico
I know the doc mentions the use of a bs-config.json file, but I couldn't get any reference which has the syntax for this.
Would appreciate the help!
UPDATE - I currently have this in the bs-config.json file, but no use -
{
"files": ["style.css", "app2.js", "index1.html"]
}
lite-server is based on BrowserSync. bs-config.js is browsersync's config file. The config options are documented here:
https://browsersync.io/docs/options
For example, to set your default indx to be index1.html, instead of setting it in your routes, the bs-config.json could contain:
{
"server": {
"baseDir": "src",
"index": "/index1.html",
"routes": {
"/node_modules": "node_modules"
}
}
}
When I lift my sails project I get these warnings on terminal
debug: Deprecated: config.adapters.default debug: (see
http://links.sailsjs.org/docs/config/connections) debug: For now, I'll
pretend you set config.models.connection.
debug: Deprecated: config.adapters debug: (see
http://links.sailsjs.org/docs/config/connections) debug: For now, I'll
pretend you set config.connections.
debug: Deprecated: config.adapters.*.module debug: (see
http://links.sailsjs.org/docs/config/connections) debug: For now, I'll
pretend you set config.connections["disk"].adapter.
And my data is not stored in mysql DB.
This is my api model code
module.exports = {
schema:true,
tableName: 'BusStop',
adapters: 'mysql-adapter',
migrate: 'safe',
attributes: {
stopID:{
type: 'int'
},
stopName:{
type: 'string'
},
latitude:{
type: 'float'
},
longitude:{
type: 'float'
}
}
};
This is my local.js code
module.exports = {
port: process.env.PORT || 1337,
environment: process.env.NODE_ENV || 'development',
adapters:{
'default': 'disk',
disk:{
module:'sails-disk'
},
'mysql-adapter': {
module : 'mysql-sails',
host : '127.0.0.1',
user : 'root',
password : '',
database : 'PublicTransport',
schema : true
}
}
};
And this is my connections.js code
module.exports.connections = {
localDiskDb: {
adapter: 'sails-disk'
},
'mysql-adapter': {
module : 'sials-mysql',
host : '127.0.0.1',
port : 3306,
user : 'root',
password : '',
database : 'PublicTransport'
},
someMongodbServer: {
adapter: 'sails-mongo',
host: 'localhost',
port: 27017,
},
somePostgresqlServer: {
adapter: 'sails-postgresql',
host: 'YOUR_POSTGRES_SERVER_HOSTNAME_OR_IP_ADDRESS',
user: 'YOUR_POSTGRES_USER',
password: 'YOUR_POSTGRES_PASSWORD',
database: 'YOUR_POSTGRES_DB'
}
};
I want to know how can I remove these Deprecated warnings and why my data is not being stored in the Database.
Looks like the links in those deprecation warnings are incorrect. For information on how to configure Sails connections, see http://sailsjs.org/#/documentation/reference/sails.config/sails.config.connections.html.
You should be able to make those messages go away by following their instructions regarding what config keys to set.
In order to set a connection for a specific model, you now set the connection property:
module.exports = {
schema:true,
tableName: 'BusStop',
connection: 'mysql-adapter', // "adapter" is now "connection
migrate: 'safe',
attributes: {...}
}
In order to specify the adapter to use for a connection, use the adapter key, not module; you're already doing this in most of your connections, you just need to update mysql-adapter.
In your config/local.js you're using the deprecated adapters key to set up connections; use connections instead.
Lastly, in order to set a default connection for all of your models, you do as the deprecation message says and set sails.config.models.connection rather than sails.config.adapters.default; you can do so easily in the config/models.js file, or in your config/local.js like so:
module.exports = {
models: {
connection: 'mysql-adapter'
},
...more config...
}
This warning can also be generated if your project has an config/adapters.js file. If the file is empty it can be deleted and Zap the warning is gone.If it contains code then you will need to migrate it to the correct path config/models.js and config/connections.js