Hi,

I use Vue2Leaflet [1]

Best Regards

[1] https://korigan.github.io/Vue2Leaflet/#/quickstart.md

Hi all.
Does anyone have an example of how to use sync and push in pwa?
Just that, thank you very much.

TJose

Thank you

Pkg quasar… v1.0.0-beta.23
Pkg @quasar/app… v1.0.0-beta.26

The following code [1] works in jsfiddle. When I take my project and click on the QSelect, it works fine, but the console gives these errors (in jsfiddle it does not give them):

What is happening?

Best regards
Jose

[1] https://jsfiddle.net/ecpu3fk4/14/

This is already off-topic, but I want to provide some more information.
Both the api and the front are being developed by me.

the validation of the user in the api use the header Authorization: Bearer my_token
This validation I can enable / disable

To the header I inject it with:
axios.defaults.headers.common [‘Authorization’] = ‘Bearer’ + my_token

after login.

The following happens:

1. Without the header Authorization the api works well:
   a) with validation disabled returns the data.
   b) with validation enabled returns 401 not authorized

The problem happens when I inject the header, in both cases, a) and b), I get the denial of cross resource

I tried this out of a quasar app with axes and with jquery and the same thing happens:

<script>

function test(){
axios.defaults.headers.common[‘Authorization’] = ‘Bearer my-token’;

axios.get('myurl')
      .then((response) => {
        console.log(response.data.data);
      })
      .catch((error) => {
        console.log(error.response.data);
      })

}
</script>

I’ve fixed it temporarily by creating a proxy in domain A. But I do not like it’s solution.

Jose

Hi

• quasar-cli@0.17.23
• quasar-extras@2.0.9
• quasar-framework@0.17.19
• axios@0.18.0

My app consumes two apis:

• A (http) and
• B (https Let’s Encrypt) for user validation
  Both apis with CORS headers:

response.headers[“Access-Control-Allow-Origin”] = “*”
response.headers[“Access-Control-Allow-Credentials”] = “true”
response.headers[“Access-Control-Allow-Methods”] = “OPTIONS, GET, POST, PUT, PATCH, DELETE”
response.headers[“Access-Control-Allow-Headers”] = “Origin, Content-Type, Accept, Authorization”

1. with proxy table in development mode works fine both apis
2. build for electron also works fine
3. creating the apk for android, api A works fine, B does not work (CORS problem)

I’m confused that the electron works fine and the android app fails. I do not know if it will be related to the certificate of let’s encrypt.

Best regards
Jose

I get the same result with pure vue (not quasar) so the problem goes the other way.

First attempt with quasar and vue2-leaflet.
The result has not been good.

It is a newly created project + vue2-leaflet (yarn add vue2-leaflet)

I tried several maps and tiles always appear broken, as shown in the screenshot

pages/Index.vue is:

<template>
  <div>
    <l-map
      :zoom="zoom"
      :center="center"
      style="height: 80%">
      <l-control-layers />
      <l-wms-tile-layer
        v-for="layer in layers"
        :key="layer.name"
        :base-url="baseUrl"
        :layers="layer.layers"
        :visible="layer.visible"
        :name="layer.name"
        layer-type="base" />
    </l-map>
  </div>
</template>

<script>

import { LMap, LTileLayer, LWMSTileLayer, LControlLayers } from 'vue2-leaflet'

export default {
  name: 'WmsLayers',
  components: {
    LMap,
    LTileLayer,
    'l-wms-tile-layer': LWMSTileLayer,
    LControlLayers
  },
  data () {
    return {
      zoom: 4,
      center: [49, 12],
      url: 'http://{s}.tile.osm.org/{z}/{x}/{y}.png',
      baseUrl: 'https://demo.boundlessgeo.com/geoserver/ows?',
      layers: [
        // {
        //   name: 'Boundaries',
        //   visible: true,
        //   layers: 'ne:ne_10m_admin_0_boundary_lines_land'
        // },
        {
          name: 'Countries',
          visible: false,
          layers: 'ne:ne_10m_admin_0_countries'
        },
        {
          name: 'Boundaries and Countries',
          visible: false,
          layers: 'ne:ne_10m_admin_0_boundary_lines_land,ne:ne_10m_admin_0_countries'
        }
      ]
    }
  }
}
</script>

Thanks to both.
I thought you were referring to css classes